createPrimarySwatch static method

MaterialColor createPrimarySwatch(
  1. Color? color
)

Create a primary Material color swatch from a given color.

This function is since version 5.0.0 no longer used by FlexColorScheme. In previous version it was used by FlexColorScheme.toTheme to provide ColorScheme.primary matching colors for ThemeData.primaryColorLight, ThemeData.primaryColorDark and ThemeData.secondaryHeaderColor.

Since algorithm does not produce a correct MaterialColor, it did not work so well if the provided color was not of roughly a mid point 500 index equivalent. So it worked well for light theme mode, but not so well for dark theme mode themes were ColorScheme.primary is typically much lighter than then MaterialColor 500 index. FlexColorScheme moved to using alpha blends to provide primary color matching colors to above mentioned colors. Since the colors are very rarely used and on a deprecation path in Flutter SDK they are not so critical.

Since this function is no longer need by this library, it may be deprecated and removed. Deprecation could e.g. happen in FlexColorScheme version 6, and removal in version 7.

There reason why it is not deprecated already is because I would like to replace it with the correct Material 2 MaterialColor algorithm, which is not available in Dart. There are reversed engineered JS versions of the official Material Color algorithm made from the Material Guide web tools. If anybody has the energy to make a Dart version of it, that would be fabulous. SO discussion here: https://stackoverflow.com/questions/32942503/material-design-color-palette

Starting points here:

Old documentation for using createPrimarySwatch.

The provided color is used as the Material swatch default color 500 in the returned swatch, with lighter hues for lower indexes and darker shades for higher index values.

If you give this function a standard Material color index 500 value, eg Colors.red[500] it will not return the same swatch as Colors.red. This function is an approximation and gives an automated way of creating a Material like primary swatch.

The used algorithm is identical to the same named function found in ColorTools in FlexColorPicker at https://pub-web.flutter-io.cn/packages/flex_color_picker.

Implementation

static MaterialColor createPrimarySwatch(final Color? color) {
  // Null default fallback is default material primary light color.
  final Color usedColor = color ?? FlexColor.materialLightPrimary;
  const List<double> strengths = <double> //
      [0.05, 0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9];
  final Map<int, Color> swatch = <int, Color>{};
  final int r = usedColor.red;
  final int g = usedColor.green;
  final int b = usedColor.blue;
  for (final double strength in strengths) {
    final double ds = 0.5 - strength;
    swatch[(strength * 1000).round()] = Color.fromRGBO(
      r + ((ds < 0 ? r : (255 - r)) * ds).round(),
      g + ((ds < 0 ? g : (255 - g)) * ds).round(),
      b + ((ds < 0 ? b : (255 - b)) * ds).round(),
      1,
    );
  }
  // The above gives a starting point, this tunes it a bit better, still far
  // from the real algorithm.
  swatch[50] = swatch[50]!.lighten(18);
  swatch[100] = swatch[100]!.lighten(16);
  swatch[200] = swatch[200]!.lighten(14);
  swatch[300] = swatch[300]!.lighten(10);
  swatch[400] = swatch[400]!.lighten(6);
  swatch[700] = swatch[700]!.darken(2);
  swatch[800] = swatch[800]!.darken(3);
  swatch[900] = swatch[900]!.darken(4);
  return MaterialColor(usedColor.value, swatch);
}