Jonny Borges
Committed by GitHub

Merge pull request #494 from juanjoseleca/master

Add function to get responsive value
@@ -431,6 +431,14 @@ context.isLargeTablet() @@ -431,6 +431,14 @@ context.isLargeTablet()
431 431
432 /// True if the current device is Tablet 432 /// True if the current device is Tablet
433 context.isTablet() 433 context.isTablet()
  434 +
  435 +/// Returns a value according to the screen size
  436 +/// can give value for
  437 +/// swatch: if the shortestSide is smaller than 300
  438 +/// mobile: if the shortestSide is smaller than 600
  439 +/// tablet: if the shortestSide is smaller than 1200
  440 +/// desktop: if width is largest than 1200
  441 +context.responsiveValue<T>()
434 ``` 442 ```
435 443
436 ### Optional Global Settings and Manual configurations 444 ### Optional Global Settings and Manual configurations
1 import 'package:flutter/material.dart'; 1 import 'package:flutter/material.dart';
2 import 'package:flutter/widgets.dart'; 2 import 'package:flutter/widgets.dart';
  3 +import 'package:flutter/foundation.dart';
3 4
4 extension ContextExtensionss on BuildContext { 5 extension ContextExtensionss on BuildContext {
5 /// The same of [MediaQuery.of(context).size] 6 /// The same of [MediaQuery.of(context).size]
@@ -102,4 +103,27 @@ extension ContextExtensionss on BuildContext { @@ -102,4 +103,27 @@ extension ContextExtensionss on BuildContext {
102 103
103 /// True if the current device is Tablet 104 /// True if the current device is Tablet
104 bool get isTablet => isSmallTablet || isLargeTablet; 105 bool get isTablet => isSmallTablet || isLargeTablet;
  106 +
  107 + /// Returns a specific value according to the screen size
  108 + /// if the device width is higher than or equal to 1200 return [desktop] value.
  109 + /// if the device width is higher than or equal to 600 and less than 1200
  110 + /// return [tablet] value.
  111 + /// if the device width is less than 300 return [watch] value.
  112 + /// in other cases return [mobile] value.
  113 + T responsiveValue<T>({
  114 + T mobile,
  115 + T tablet,
  116 + T desktop,
  117 + T watch,
  118 + }) {
  119 + double deviceWidth = mediaQuerySize.shortestSide;
  120 +
  121 + if (kIsWeb) {
  122 + deviceWidth = mediaQuerySize.width;
  123 + }
  124 + if (deviceWidth >= 1200 && desktop != null) return desktop;
  125 + if (deviceWidth >= 600 && tablet != null) return tablet;
  126 + if (deviceWidth < 300 && watch != null) return watch;
  127 + return mobile;
  128 + }
105 } 129 }