Merge pull request #891 from SchabanBo/master

Fixs for #888 #889

@@ -53,6 +53,8 @@
       - [ObxValue](#obxvalue)
   - [Useful tips](#useful-tips)
       - [GetView](#getview)
+      - [GetResponsiveView](#getresponsiveview)
+        - [How to use it](#how-to-use-it)
       - [GetWidget](#getwidget)
       - [GetxService](#getxservice)
 - [Breaking changes from 2.0](#breaking-changes-from-20)
@@ -903,6 +905,29 @@ Is a `const Stateless` Widget that has a getter `controller` for a registered `C
  }
 ```
 
+#### GetResponsiveView
+
+Extend this widget to build responsive view.
+this widget contains the `screen` property that have all
+information about the screen size and type.
+
+##### How to use it
+
+You have two options to build it.
+
+- with `builder` method you return the widget to build.
+- with methods `desktop`, `tablet`,`phone`, `watch`. the specific
+method will be built when the screen type matches the method
+when the screen is [ScreenType.Tablet] the `tablet` method
+will be exuded and so on.
+**Note:** If you use this method please set the property `alwaysUseBuilder` to `false`
+
+With `settings` property you can set the width limit for the screen types.
+
+![example](https://github.com/SchabanBo/get_page_example/blob/master/docs/Example.gif?raw=true)
+Code to this screen
+[code](https://github.com/SchabanBo/get_page_example/blob/master/lib/pages/responsive_example/responsive_view.dart)
+
 #### GetWidget
 
 Most people have no idea about this Widget, or totally confuse the usage of it.

@@ -191,135 +191,126 @@ class GetCupertinoApp extends StatelessWidget {
     return PageRedirect(settings, unknownRoute).page();
   }
 
-  List<Route<dynamic>> initialRoutesGenerate(String name) {
-    final match = Get.routeTree.matchRoute(name);
-    Get.parameters = match?.parameters;
-
-    //Route can be nullable, just pass the unknown route
-    if (match?.route == null) {
-      return [
-        GetPageRoute(
-          page: unknownRoute.page,
-          parameter: unknownRoute.parameter,
-          settings: RouteSettings(name: name, arguments: null),
-          curve: unknownRoute.curve,
-          opaque: unknownRoute.opaque,
-          routeName: unknownRoute.name,
-          customTransition: unknownRoute.customTransition,
-          binding: unknownRoute.binding,
-          bindings: unknownRoute.bindings,
-          transitionDuration: (unknownRoute.transitionDuration ??
-              Get.defaultTransitionDuration),
-          transition: unknownRoute.transition,
-          popGesture: unknownRoute.popGesture,
-          fullscreenDialog: unknownRoute.fullscreenDialog,
-        )
-      ];
-    }
-
-    return [
-      GetPageRoute(
-        page: match.route.page,
-        parameter: match.route.parameter,
-        settings: RouteSettings(name: name, arguments: null),
-        curve: match.route.curve,
-        opaque: match.route.opaque,
-        routeName: match.route.name,
-        binding: match.route.binding,
-        bindings: match.route.bindings,
-        transitionDuration:
-            (match.route.transitionDuration ?? Get.defaultTransitionDuration),
-        transition: match.route.transition,
-        popGesture: match.route.popGesture,
-        fullscreenDialog: match.route.fullscreenDialog,
-      )
-    ];
-  }
+  List<Route<dynamic>> initialRoutesGenerate(String name) =>
+      [PageRedirect(RouteSettings(name: name), unknownRoute).page()];
 
   @override
-  Widget build(BuildContext context) {
-    return GetBuilder<GetMaterialController>(
-        init: Get.rootController,
-        dispose: (d) {
-          onDispose?.call();
-        },
-        initState: (i) {
-          Get.engine.addPostFrameCallback((timeStamp) {
-            onReady?.call();
-          });
-          if (locale != null) Get.locale = locale;
-
-          if (fallbackLocale != null) Get.fallbackLocale = fallbackLocale;
+  Widget build(BuildContext context) => GetBuilder<GetMaterialController>(
+      init: Get.rootController,
+      dispose: (d) {
+        onDispose?.call();
+      },
+      initState: (i) {
+        Get.engine.addPostFrameCallback((timeStamp) {
+          onReady?.call();
+        });
+        if (locale != null) Get.locale = locale;
 
-          if (translations != null) {
-            Get.addTranslations(translations.keys);
-          } else if (translationsKeys != null) {
-            Get.addTranslations(translationsKeys);
-          }
+        if (fallbackLocale != null) Get.fallbackLocale = fallbackLocale;
 
-          Get.customTransition = customTransition;
+        if (translations != null) {
+          Get.addTranslations(translations.keys);
+        } else if (translationsKeys != null) {
+          Get.addTranslations(translationsKeys);
+        }
 
-          initialBinding?.dependencies();
-          Get.addPages(getPages);
-          Get.smartManagement = smartManagement;
-          onInit?.call();
+        Get.customTransition = customTransition;
 
-          Get.config(
-            enableLog: enableLog ?? Get.isLogEnable,
-            logWriterCallback: logWriterCallback,
-            defaultTransition: defaultTransition ?? Get.defaultTransition,
-            defaultOpaqueRoute: opaqueRoute ?? Get.isOpaqueRouteDefault,
-            defaultPopGesture: popGesture ?? Get.isPopGestureEnable,
-            defaultDurationTransition:
-                transitionDuration ?? Get.defaultTransitionDuration,
-          );
-        },
-        builder: (_) {
-          return CupertinoApp(
-            key: _.unikey,
-            theme: theme,
-            navigatorKey:
-                (navigatorKey == null ? Get.key : Get.addKey(navigatorKey)),
-            home: home,
-            routes: routes ?? const <String, WidgetBuilder>{},
-            initialRoute: initialRoute,
-            onGenerateRoute: (getPages != null ? generator : onGenerateRoute),
-            onGenerateInitialRoutes: (getPages == null || home != null)
-                ? onGenerateInitialRoutes
-                : initialRoutesGenerate,
-            onUnknownRoute: onUnknownRoute,
-            navigatorObservers: (navigatorObservers == null
-                ? <NavigatorObserver>[GetObserver(routingCallback, Get.routing)]
-                : <NavigatorObserver>[GetObserver(routingCallback, Get.routing)]
-              ..addAll(navigatorObservers)),
-            builder: (context, child) {
-              return Directionality(
-                textDirection: textDirection ??
-                    (rtlLanguages.contains(Get.locale?.languageCode)
-                        ? TextDirection.rtl
-                        : TextDirection.ltr),
-                child: builder == null ? child : builder(context, child),
-              );
-            },
-            title: title ?? '',
-            onGenerateTitle: onGenerateTitle,
-            color: color,
+        initialBinding?.dependencies();
+        Get.addPages(getPages);
+        Get.smartManagement = smartManagement;
+        onInit?.call();
 
-            locale: Get.locale ?? locale,
-            localizationsDelegates: localizationsDelegates,
-            localeListResolutionCallback: localeListResolutionCallback,
-            localeResolutionCallback: localeResolutionCallback,
-            supportedLocales:
-                supportedLocales ?? const <Locale>[Locale('en', 'US')],
-            showPerformanceOverlay: showPerformanceOverlay ?? false,
-            checkerboardRasterCacheImages:
-                checkerboardRasterCacheImages ?? false,
-            checkerboardOffscreenLayers: checkerboardOffscreenLayers ?? false,
-            showSemanticsDebugger: showSemanticsDebugger ?? false,
-            debugShowCheckedModeBanner: debugShowCheckedModeBanner ?? true,
-            shortcuts: shortcuts,
-            //   actions: actions,
-          );
-        });
-  }
+        Get.config(
+          enableLog: enableLog ?? Get.isLogEnable,
+          logWriterCallback: logWriterCallback,
+          defaultTransition: defaultTransition ?? Get.defaultTransition,
+          defaultOpaqueRoute: opaqueRoute ?? Get.isOpaqueRouteDefault,
+          defaultPopGesture: popGesture ?? Get.isPopGestureEnable,
+          defaultDurationTransition:
+              transitionDuration ?? Get.defaultTransitionDuration,
+        );
+      },
+      builder: (_) => routerDelegate != null
+          ? CupertinoApp.router(
+              routerDelegate: routerDelegate,
+              routeInformationParser: routeInformationParser,
+              backButtonDispatcher: backButtonDispatcher,
+              routeInformationProvider: routeInformationProvider,
+              key: _.unikey,
+              theme: theme,
+              builder: (context, child) {
+                return Directionality(
+                  textDirection: textDirection ??
+                      (rtlLanguages.contains(Get.locale?.languageCode)
+                          ? TextDirection.rtl
+                          : TextDirection.ltr),
+                  child: builder == null ? child : builder(context, child),
+                );
+              },
+              title: title ?? '',
+              onGenerateTitle: onGenerateTitle,
+              color: color,
+              locale: Get.locale ?? locale,
+              localizationsDelegates: localizationsDelegates,
+              localeListResolutionCallback: localeListResolutionCallback,
+              localeResolutionCallback: localeResolutionCallback,
+              supportedLocales:
+                  supportedLocales ?? const <Locale>[Locale('en', 'US')],
+              showPerformanceOverlay: showPerformanceOverlay ?? false,
+              checkerboardRasterCacheImages:
+                  checkerboardRasterCacheImages ?? false,
+              checkerboardOffscreenLayers: checkerboardOffscreenLayers ?? false,
+              showSemanticsDebugger: showSemanticsDebugger ?? false,
+              debugShowCheckedModeBanner: debugShowCheckedModeBanner ?? true,
+              shortcuts: shortcuts,
+            )
+          : CupertinoApp(
+              key: _.unikey,
+              theme: theme,
+              navigatorKey:
+                  (navigatorKey == null ? Get.key : Get.addKey(navigatorKey)),
+              home: home,
+              routes: routes ?? const <String, WidgetBuilder>{},
+              initialRoute: initialRoute,
+              onGenerateRoute: (getPages != null ? generator : onGenerateRoute),
+              onGenerateInitialRoutes: (getPages == null || home != null)
+                  ? onGenerateInitialRoutes
+                  : initialRoutesGenerate,
+              onUnknownRoute: onUnknownRoute,
+              navigatorObservers: (navigatorObservers == null
+                  ? <NavigatorObserver>[
+                      GetObserver(routingCallback, Get.routing)
+                    ]
+                  : <NavigatorObserver>[
+                      GetObserver(routingCallback, Get.routing)
+                    ]
+                ..addAll(navigatorObservers)),
+              builder: (context, child) {
+                return Directionality(
+                  textDirection: textDirection ??
+                      (rtlLanguages.contains(Get.locale?.languageCode)
+                          ? TextDirection.rtl
+                          : TextDirection.ltr),
+                  child: builder == null ? child : builder(context, child),
+                );
+              },
+              title: title ?? '',
+              onGenerateTitle: onGenerateTitle,
+              color: color,
+              locale: Get.locale ?? locale,
+              localizationsDelegates: localizationsDelegates,
+              localeListResolutionCallback: localeListResolutionCallback,
+              localeResolutionCallback: localeResolutionCallback,
+              supportedLocales:
+                  supportedLocales ?? const <Locale>[Locale('en', 'US')],
+              showPerformanceOverlay: showPerformanceOverlay ?? false,
+              checkerboardRasterCacheImages:
+                  checkerboardRasterCacheImages ?? false,
+              checkerboardOffscreenLayers: checkerboardOffscreenLayers ?? false,
+              showSemanticsDebugger: showSemanticsDebugger ?? false,
+              debugShowCheckedModeBanner: debugShowCheckedModeBanner ?? true,
+              shortcuts: shortcuts,
+              //   actions: actions,
+            ));
 }

@@ -198,141 +198,135 @@ class GetMaterialApp extends StatelessWidget {
         initialRoute = null,
         super(key: key);
 
-  Route<dynamic> generator(RouteSettings settings) {
-    return PageRedirect(settings, unknownRoute).page();
-  }
+  Route<dynamic> generator(RouteSettings settings) =>
+      PageRedirect(settings, unknownRoute).page();
 
-  List<Route<dynamic>> initialRoutesGenerate(String name) {
-    final match = Get.routeTree.matchRoute(name);
-    Get.parameters = match?.parameters;
-
-    //Route can be nullable, just pass the unknown route
-    if (match?.route == null) {
-      return [
-        GetPageRoute(
-          page: unknownRoute.page,
-          parameter: unknownRoute.parameter,
-          settings: RouteSettings(name: name, arguments: null),
-          curve: unknownRoute.curve,
-          opaque: unknownRoute.opaque,
-          routeName: unknownRoute.name,
-          customTransition: unknownRoute.customTransition,
-          binding: unknownRoute.binding,
-          bindings: unknownRoute.bindings,
-          transitionDuration: (unknownRoute.transitionDuration ??
-              Get.defaultTransitionDuration),
-          transition: unknownRoute.transition,
-          popGesture: unknownRoute.popGesture,
-          fullscreenDialog: unknownRoute.fullscreenDialog,
-        )
-      ];
-    }
-
-    return [
-      GetPageRoute(
-        page: match.route.page,
-        parameter: match.route.parameter,
-        settings: RouteSettings(name: name, arguments: null),
-        curve: match.route.curve,
-        opaque: match.route.opaque,
-        binding: match.route.binding,
-        routeName: match.route.name,
-        bindings: match.route.bindings,
-        transitionDuration:
-            (match.route.transitionDuration ?? Get.defaultTransitionDuration),
-        transition: match.route.transition,
-        popGesture: match.route.popGesture,
-        fullscreenDialog: match.route.fullscreenDialog,
-      )
-    ];
-  }
+  List<Route<dynamic>> initialRoutesGenerate(String name) =>
+      [PageRedirect(RouteSettings(name: name), unknownRoute).page()];
 
   @override
-  Widget build(BuildContext context) {
-    return GetBuilder<GetMaterialController>(
-        init: Get.rootController,
-        dispose: (d) {
-          onDispose?.call();
-        },
-        initState: (i) {
-          Get.engine.addPostFrameCallback((timeStamp) {
-            onReady?.call();
-          });
-          if (locale != null) Get.locale = locale;
+  Widget build(BuildContext context) => GetBuilder<GetMaterialController>(
+      init: Get.rootController,
+      dispose: (d) {
+        onDispose?.call();
+      },
+      initState: (i) {
+        Get.engine.addPostFrameCallback((timeStamp) {
+          onReady?.call();
+        });
+        if (locale != null) Get.locale = locale;
 
-          if (fallbackLocale != null) Get.fallbackLocale = fallbackLocale;
+        if (fallbackLocale != null) Get.fallbackLocale = fallbackLocale;
 
-          if (translations != null) {
-            Get.addTranslations(translations.keys);
-          } else if (translationsKeys != null) {
-            Get.addTranslations(translationsKeys);
-          }
+        if (translations != null) {
+          Get.addTranslations(translations.keys);
+        } else if (translationsKeys != null) {
+          Get.addTranslations(translationsKeys);
+        }
 
-          Get.customTransition = customTransition;
+        Get.customTransition = customTransition;
 
-          initialBinding?.dependencies();
-          Get.addPages(getPages);
-          Get.smartManagement = smartManagement;
-          onInit?.call();
+        initialBinding?.dependencies();
+        Get.addPages(getPages);
+        Get.smartManagement = smartManagement;
+        onInit?.call();
 
-          Get.config(
-            enableLog: enableLog ?? Get.isLogEnable,
-            logWriterCallback: logWriterCallback,
-            defaultTransition: defaultTransition ?? Get.defaultTransition,
-            defaultOpaqueRoute: opaqueRoute ?? Get.isOpaqueRouteDefault,
-            defaultPopGesture: popGesture ?? Get.isPopGestureEnable,
-            defaultDurationTransition:
-                transitionDuration ?? Get.defaultTransitionDuration,
-          );
-        },
-        builder: (_) {
-          return MaterialApp(
-            key: _.unikey,
-            navigatorKey:
-                (navigatorKey == null ? Get.key : Get.addKey(navigatorKey)),
-            home: home,
-            routes: routes ?? const <String, WidgetBuilder>{},
-            initialRoute: initialRoute,
-            onGenerateRoute: (getPages != null ? generator : onGenerateRoute),
-            onGenerateInitialRoutes: (getPages == null || home != null)
-                ? onGenerateInitialRoutes
-                : initialRoutesGenerate,
-            onUnknownRoute: onUnknownRoute,
-            navigatorObservers: (navigatorObservers == null
-                ? <NavigatorObserver>[GetObserver(routingCallback, Get.routing)]
-                : <NavigatorObserver>[GetObserver(routingCallback, Get.routing)]
-              ..addAll(navigatorObservers)),
-            builder: (context, child) {
-              return Directionality(
-                textDirection: textDirection ??
-                    (rtlLanguages.contains(Get.locale?.languageCode)
-                        ? TextDirection.rtl
-                        : TextDirection.ltr),
-                child: builder == null ? child : builder(context, child),
-              );
-            },
-            title: title ?? '',
-            onGenerateTitle: onGenerateTitle,
-            color: color,
-            theme: _.theme ?? theme ?? ThemeData.fallback(),
-            darkTheme: darkTheme,
-            themeMode: _.themeMode ?? themeMode ?? ThemeMode.system,
-            locale: Get.locale ?? locale,
-            localizationsDelegates: localizationsDelegates,
-            localeListResolutionCallback: localeListResolutionCallback,
-            localeResolutionCallback: localeResolutionCallback,
-            supportedLocales:
-                supportedLocales ?? const <Locale>[Locale('en', 'US')],
-            debugShowMaterialGrid: debugShowMaterialGrid ?? false,
-            showPerformanceOverlay: showPerformanceOverlay ?? false,
-            checkerboardRasterCacheImages:
-                checkerboardRasterCacheImages ?? false,
-            checkerboardOffscreenLayers: checkerboardOffscreenLayers ?? false,
-            showSemanticsDebugger: showSemanticsDebugger ?? false,
-            debugShowCheckedModeBanner: debugShowCheckedModeBanner ?? true,
-            shortcuts: shortcuts,
-            //   actions: actions,
-          );
-        });
-  }
+        Get.config(
+          enableLog: enableLog ?? Get.isLogEnable,
+          logWriterCallback: logWriterCallback,
+          defaultTransition: defaultTransition ?? Get.defaultTransition,
+          defaultOpaqueRoute: opaqueRoute ?? Get.isOpaqueRouteDefault,
+          defaultPopGesture: popGesture ?? Get.isPopGestureEnable,
+          defaultDurationTransition:
+              transitionDuration ?? Get.defaultTransitionDuration,
+        );
+      },
+      builder: (_) => routerDelegate != null
+          ? MaterialApp.router(
+              routerDelegate: routerDelegate,
+              routeInformationParser: routeInformationParser,
+              backButtonDispatcher: backButtonDispatcher,
+              routeInformationProvider: routeInformationProvider,
+              key: _.unikey,
+              builder: (context, child) {
+                return Directionality(
+                  textDirection: textDirection ??
+                      (rtlLanguages.contains(Get.locale?.languageCode)
+                          ? TextDirection.rtl
+                          : TextDirection.ltr),
+                  child: builder == null ? child : builder(context, child),
+                );
+              },
+              title: title ?? '',
+              onGenerateTitle: onGenerateTitle,
+              color: color,
+              theme: _.theme ?? theme ?? ThemeData.fallback(),
+              darkTheme: darkTheme,
+              themeMode: _.themeMode ?? themeMode ?? ThemeMode.system,
+              locale: Get.locale ?? locale,
+              localizationsDelegates: localizationsDelegates,
+              localeListResolutionCallback: localeListResolutionCallback,
+              localeResolutionCallback: localeResolutionCallback,
+              supportedLocales:
+                  supportedLocales ?? const <Locale>[Locale('en', 'US')],
+              debugShowMaterialGrid: debugShowMaterialGrid ?? false,
+              showPerformanceOverlay: showPerformanceOverlay ?? false,
+              checkerboardRasterCacheImages:
+                  checkerboardRasterCacheImages ?? false,
+              checkerboardOffscreenLayers: checkerboardOffscreenLayers ?? false,
+              showSemanticsDebugger: showSemanticsDebugger ?? false,
+              debugShowCheckedModeBanner: debugShowCheckedModeBanner ?? true,
+              shortcuts: shortcuts,
+            )
+          : MaterialApp(
+              key: _.unikey,
+              navigatorKey:
+                  (navigatorKey == null ? Get.key : Get.addKey(navigatorKey)),
+              home: home,
+              routes: routes ?? const <String, WidgetBuilder>{},
+              initialRoute: initialRoute,
+              onGenerateRoute: (getPages != null ? generator : onGenerateRoute),
+              onGenerateInitialRoutes: (getPages == null || home != null)
+                  ? onGenerateInitialRoutes
+                  : initialRoutesGenerate,
+              onUnknownRoute: onUnknownRoute,
+              navigatorObservers: (navigatorObservers == null
+                  ? <NavigatorObserver>[
+                      GetObserver(routingCallback, Get.routing)
+                    ]
+                  : <NavigatorObserver>[
+                      GetObserver(routingCallback, Get.routing)
+                    ]
+                ..addAll(navigatorObservers)),
+              builder: (context, child) {
+                return Directionality(
+                  textDirection: textDirection ??
+                      (rtlLanguages.contains(Get.locale?.languageCode)
+                          ? TextDirection.rtl
+                          : TextDirection.ltr),
+                  child: builder == null ? child : builder(context, child),
+                );
+              },
+              title: title ?? '',
+              onGenerateTitle: onGenerateTitle,
+              color: color,
+              theme: _.theme ?? theme ?? ThemeData.fallback(),
+              darkTheme: darkTheme,
+              themeMode: _.themeMode ?? themeMode ?? ThemeMode.system,
+              locale: Get.locale ?? locale,
+              localizationsDelegates: localizationsDelegates,
+              localeListResolutionCallback: localeListResolutionCallback,
+              localeResolutionCallback: localeResolutionCallback,
+              supportedLocales:
+                  supportedLocales ?? const <Locale>[Locale('en', 'US')],
+              debugShowMaterialGrid: debugShowMaterialGrid ?? false,
+              showPerformanceOverlay: showPerformanceOverlay ?? false,
+              checkerboardRasterCacheImages:
+                  checkerboardRasterCacheImages ?? false,
+              checkerboardOffscreenLayers: checkerboardOffscreenLayers ?? false,
+              showSemanticsDebugger: showSemanticsDebugger ?? false,
+              debugShowCheckedModeBanner: debugShowCheckedModeBanner ?? true,
+              shortcuts: shortcuts,
+              //   actions: actions,
+            ));
 }

@@ -5,6 +5,7 @@ export 'src/rx_flutter/rx_getx_widget.dart';
 export 'src/rx_flutter/rx_notifier.dart';
 export 'src/rx_flutter/rx_obx_widget.dart';
 export 'src/rx_flutter/rx_ticket_provider_mixin.dart';
+export 'src/simple/get_responsive.dart';
 export 'src/simple/get_state.dart';
 export 'src/simple/get_view.dart';
 export 'src/simple/immutable_state.dart';

+import 'package:flutter/widgets.dart';
+
+import '../../../get.dart';
+import 'get_view.dart';
+
+abstract class _GetResponsive<T> extends GetView<T> {
+  final ResponsiveScreen screen;
+  _GetResponsive(ResponsiveScreenSettings settings, {Key key})
+      : screen = ResponsiveScreen(settings),
+        super(key: key);
+
+  Widget builder();
+  Widget phone();
+  Widget tablet();
+  Widget desktop();
+  Widget watch();
+}
+
+/// Extend this widget to build responsive view.
+/// this widget contains the `screen` property that have all
+/// information about the screen size and type.
+/// You have two options to build it.
+/// 1- with `builder` method you return the widget to build.
+/// 2- with methods `desktop`, `tablet`,`phone`, `watch`. the specific
+/// method will be built when the screen type matches the method
+/// when the screen is [ScreenType.Tablet] the `tablet` method
+/// will be exuded and so on.
+/// Note if you use this method please set the 
+/// property `alwaysUseBuilder` to false
+/// With `settings` property you can set the width limit for the screen types.
+class GetResponsiveView<T> extends _GetResponsive<T> {
+  final bool alwaysUseBuilder = true;
+  GetResponsiveView(
+      {alwaysUseBuilder,
+      ResponsiveScreenSettings settings = const ResponsiveScreenSettings(),
+      Key key})
+      : super(settings, key: key);
+  @override
+  Widget build(BuildContext context) {
+    screen.context = context;
+    Widget widget;
+    if (alwaysUseBuilder) {
+      widget = builder();
+      if (widget != null) return widget;
+    }
+    if (screen.isDesktop) {
+      widget = desktop() ?? widget;
+      if (widget != null) return widget;
+    }
+    if (screen.isTablet) {
+      widget = tablet() ?? desktop();
+      if (widget != null) return widget;
+    }
+    if (screen.isPhone) {
+      widget = phone() ?? tablet() ?? desktop();
+      if (widget != null) return widget;
+    }
+    return watch() ?? phone() ?? tablet() ?? desktop() ?? builder();
+  }
+
+  @override
+  Widget builder() => null;
+
+  @override
+  Widget desktop() => null;
+
+  @override
+  Widget phone() => null;
+
+  @override
+  Widget tablet() => null;
+
+  @override
+  Widget watch() => null;
+}
+
+class ResponsiveScreenSettings {
+  /// When the width is greater als this value
+  /// the display will be set as [ScreenType.Desktop]
+  final double desktopChangePoint;
+
+  /// When the width is greater als this value
+  /// the display will be set as [ScreenType.Tablet]
+  /// or when width greater als [watchChangePoint] and smaller als this value
+  /// the display will be [ScreenType.Mobile]
+  final double tabletChangePoint;
+
+  /// When the width is smaller als this value
+  /// the display will be set as [ScreenType.Watch]
+  /// or when width greater als this value and smaller als [tabletChangePoint]
+  /// the display will be [ScreenType.Mobile]
+  final double watchChangePoint;
+
+  const ResponsiveScreenSettings(
+      {this.desktopChangePoint = 1200,
+      this.tabletChangePoint = 600,
+      this.watchChangePoint = 300});
+}
+
+class ResponsiveScreen {
+  BuildContext context;
+  final ResponsiveScreenSettings settings;
+
+  bool _isPaltformDesktop;
+  ResponsiveScreen(this.settings) {
+    _isPaltformDesktop = GetPlatform.isDesktop;
+  }
+
+  double get height => context.height;
+  double get width => context.width;
+
+  /// Is [screenType] [ScreenType.Desktop]
+  bool get isDesktop => (screenType == ScreenType.Desktop);
+
+  /// Is [screenType] [ScreenType.Tablet]
+  bool get isTablet => (screenType == ScreenType.Tablet);
+
+  /// Is [screenType] [ScreenType.Mobile]
+  bool get isPhone => (screenType == ScreenType.Phone);
+
+  /// Is [screenType] [ScreenType.Watch]
+  bool get isWatch => (screenType == ScreenType.Watch);
+
+  double get _getdeviceWidth {
+    if (_isPaltformDesktop) {
+      return width;
+    }
+    return context.mediaQueryShortestSide;
+  }
+
+  ScreenType get screenType {
+    final deviceWidth = _getdeviceWidth;
+    if (deviceWidth >= settings.desktopChangePoint) return ScreenType.Desktop;
+    if (deviceWidth >= settings.tabletChangePoint) return ScreenType.Tablet;
+    if (deviceWidth < settings.watchChangePoint) return ScreenType.Watch;
+    return ScreenType.Phone;
+  }
+
+  /// Return widget according to screen type
+  /// if the [screenType] is [ScreenType.Desktop] and
+  /// `desktop` object is null the `tablet` object will be returned
+  /// and if `tablet` object is null the `mobile` object will be returned
+  /// and if `mobile` object is null the `watch` object will be returned
+  ///  also when it is null.
+  T responsiveValue<T>({
+    T mobile,
+    T tablet,
+    T desktop,
+    T watch,
+  }) {
+    if (isDesktop && desktop != null) return desktop;
+    if (isTablet && tablet != null) return tablet;
+    if (isPhone && mobile != null) return mobile;
+    return watch;
+  }
+}
+
+enum ScreenType {
+  Watch,
+  Phone,
+  Tablet,
+  Desktop,
+}