responsiveValue<T> method

T responsiveValue<T>({
  1. T? watch,
  2. T? mobile,
  3. T? tablet,
  4. T? desktop,
})

Returns a specific value according to the screen size if the device width is higher than or equal to 1200 return desktop value. if the device width is higher than or equal to 600 and less than 1200 return tablet value. if the device width is less than 300 return watch value. in other cases return mobile value.

Implementation

T responsiveValue<T>({
  T? watch,
  T? mobile,
  T? tablet,
  T? desktop,
}) {
  assert(
      watch != null || mobile != null || tablet != null || desktop != null);

  var deviceWidth = mediaQuerySize.width;
  //big screen width can display smaller sizes
  final strictValues = [
    if (deviceWidth >= 1200) desktop, //desktop is allowed
    if (deviceWidth >= 600) tablet, //tablet is allowed
    if (deviceWidth >= 300) mobile, //mobile is allowed
    watch, //watch is allowed
  ].whereType<T>();
  final looseValues = [
    watch,
    mobile,
    tablet,
    desktop,
  ].whereType<T>();
  return strictValues.firstOrNull ?? looseValues.first;
}