Version 8.2.0

8.2.0

March 23, 2025

Package

CHORE

• Update the package to support and require at least Flutter v3.29.0.
  • Remove all usage and references to new deprecated properties in Flutter 3.29.0:
    • MaterialStateUnderlineInputBorder → WidgetStateInputBorder
    • MaterialStateOutlineInputBorder → WidgetStateInputBorder
    • Themedata.dialogBackgroundColor: Removed all usage and references in the FCS packages and Themes Playground app.
• Remove all usage and references to new deprecated properties in Flutter 3.31.0 BETA:
  • ThemeData.indicatorColor: Removed all usage and references in the FCS packages and Themes Playground app. FlexColorScheme has not used this property for a while, but kept it defined while it still existed. It is deprecated in Flutter 3.31.0 BETA and will be so in next stable Flutter release as well. FCS 8.2.0 stops defining any value for it and also removes it from the Themes Playground app. It has in FCS for a long time already been replaced by TabBarThemeData.indicatorColor. Test were now also updated to use this reference instead of the to be deprecated one.
• Fix lints for the stable, beta and master channels.
• FlexColorScheme is still using pre-Dart 3.7.0 formatter. It will change to new format, with longer line length, when the Flutter stable channel supports manual trailing comma. Change to the new formatter was tested, but reverted because it was horrible.

FIX

• Fix TabBarTheme normalization Flutter SDK breaking change on the master and beta channel, see issue #276.
  • The TabBar theme API had breaking changes in Flutter 3.27 release. These were addressed in FlexColorScheme v8.1.0. In Flutter 3.31 (beta) there are additional compile-time breaking changes not present in Flutter 3.29 and earlier versions. FlexColorScheme v8.2.0 is compatible with these Flutter SDK breaking changes. For more information, see the TabBar theme API breaking changes, that documented the in Flutter 3.27 breaking changes. Apparently, something more changed now, as the TabBar theming that still works in Flutter 3.29, broke again in Flutter 3.31 beta and later. Regardless of what and why it was broken, FCS v8.2.0 fixes the usage of the compile-time broken API, it now works again, with at release time used APIs in Flutter stable, beta and master channels.

NEW

• Beta feature:

  • Added Shadcn UI color schemes. This includes, custom classes to store the Shadcn color tokens, FlexSchemeColor implementations of them and FlexScheme enums of the configs to make it easy to use them.

    The FlexScheme enums for using the Shadcn colors are:

    • FlexScheme.shadBlue
    • FlexScheme.shadGray
    • FlexScheme.shadGreen
    • FlexScheme.shadNeutral
    • FlexScheme.shadOrange
    • FlexScheme.shadRed
    • FlexScheme.shadRose
    • FlexScheme.shadSlate
    • FlexScheme.shadStone
    • FlexScheme.shadViolet
    • FlexScheme.shadYellow
    • FlexScheme.shadZinc

  • The Shadcn color schemes are still considered beta. The current version does not yet support or use the Shadcn default colors for background, surface and container colors. In this release those colors are using FlexColorScheme's monochrome surface colors. Later versions may change this and use the Shadcn surface colors by default when selecting these themes, with an option to switch to FlexColorScheme's monochrome surface colors, which this version currently uses as the only choice.

  • The Shadcn color selections only set default colors, you will have to theme Material to look more like Shadcn yourself by selecting the correct Material components and modifying their properties to look and behave more like Shadcn style. The Themes Playground includes a pre-configured very preliminary configuration that you can use to do this.

  • The Shadcn color features are in this beta release excluded from FlexColorScheme's otherwise rigorous tests.

Themes Playground

FIX

• Playground: Fix code gen for the first scheme, see issue #275.

CHANGE

• Fix/improve code gen for the second and third Playground scheme. It now exports these schemes the way they are defined internally in the Playground app, instead of as their configuration resulting colors.
• Improved the theme code gen order and added some comments to the generated code to make it easier to understand what the main parts do.
• Removed the theme codegen option used to generate a config to be pasted directly into MaterialApp properties theme and themeDark, in favor of the newer one that generates the configs as its own file. The newer one has been the default option since version 8.0.0.
• Updated TabBar "Known issues" info-expand to state that the broken elastic indicator animation is fixed in Flutter 3.27.3.
• The NavigationRail default configuration in the Playground is now NavigationRailLabelType.none.
  • This is already the default in the FlexColorScheme package and in Flutter SDK. This default value is used to avoid the issue that Flutter SDK only supports using the none option as the collapsed style, when the rail is expanded. For more info about this peculiar limitation see issue #277.
  • Added an info-expand to the NavigationRail panel to explain this known-issue.
  • You can work around this issue, but only on component config level, by setting the labelType to NavigationRailLabelType.none when extended is set to true, and back to null when it is false to use a themed value, that may then have another value than none when the rail is collapsed. This is a limitation in Flutter SDK, not in FlexColorScheme. The Playground app uses this workaround to avoid the issue when it displays the demo NavigationRail in the extended state.

NEW

• Added showing all existing Material-Cupertino platform adaptive widgets. Switch already existed but now also added:
  • AlertDialog.adaptive
  • Slider.adaptive
  • Checkbox.adaptive
  • Radio.adaptive
• BETA
  • Added a built-in config for a Shadcn UI like config to the Premade Designs panel. This is only a first rough beta config.
    • This style configures the Material theme to look a bit like the Shadcn UI design system. It is not an exact replica and never will be, consider it more like inspired by Shadcn. It is primarily intended to be used with the Shadcn theme colors, but you can of course use it with any of the built-in schemes. This is a preliminary first config and will be refined over time as more theming features are added to the Playground that allow us to bring it closer to the Shadcn design. Be aware that the results you get when you use this configuration WILL change in future Themes Playground releases. As always, export your settings and save them as JSON if you want to keep them and use them later again in the Playground.

Version 8.2.0-dev.1

8.2.0-dev.1

March 23, 2025

Test release to check PUB status result for release.

Package

CHORE

• Update the package to support and require at least Flutter v3.29.0.
  • Remove all usage and references to new deprecated properties in Flutter 3.29.0:
    • MaterialStateUnderlineInputBorder → WidgetStateInputBorder
    • MaterialStateOutlineInputBorder → WidgetStateInputBorder
    • Themedata.dialogBackgroundColor: Removed all usage and references in the FCS packages and Themes Playground app.
• Remove all usage and references to new deprecated properties in Flutter 3.31.0 BETA:
  • ThemeData.indicatorColor: Removed all usage and references in the FCS packages and Themes Playground app. FlexColorScheme has not used this property for a while, but kept it defined while it still existed. It is deprecated in Flutter 3.31.0 BETA and will be so in next stable Flutter release as well. FCS 8.2.0 stops defining any value for it and also removes it from the Themes Playground app. It has in FCS for a long time already been replaced by TabBarThemeData.indicatorColor. Test were now also updated to use this reference instead of the to be deprecated one.
• Fix lints for the stable, beta and master channels.
• FlexColorScheme is still using pre-Dart 3.7.0 formatter. It will change to new format, with longer line length, when the Flutter stable channel supports manual trailing comma. Change to the new formatter was tested, but reverted because it was horrible.

FIX

• Fix TabBarTheme normalization Flutter SDK breaking change on the master and beta channel, see issue #276.
  • The TabBar theme API had breaking changes in Flutter 3.27 release. These were addressed in FlexColorScheme v8.1.0. In Flutter 3.31 (beta) there are additional compile-time breaking changes not present in Flutter 3.29 and earlier versions. FlexColorScheme v8.2.0 is compatible with these Flutter SDK breaking changes. For more information, see the TabBar theme API breaking changes, that documented the in Flutter 3.27 breaking changes. Apparently, something more changed now, as the TabBar theming that still works in Flutter 3.29, broke again in Flutter 3.31 beta and later. Regardless of what and why it was broken, FCS v8.2.0 fixes the usage of the compile-time broken API, it now works again, with at release time used APIs in Flutter stable, beta and master channels.

NEW

• Beta feature:

  • Added Shadcn UI color schemes. This includes, custom classes to store the Shadcn color tokens, FlexSchemeColor implementations of them and FlexScheme enums of the configs to make it easy to use them.

    The FlexScheme enums for using the Shadcn colors are:

    • FlexScheme.shadBlue
    • FlexScheme.shadGray
    • FlexScheme.shadGreen
    • FlexScheme.shadNeutral
    • FlexScheme.shadOrange
    • FlexScheme.shadRed
    • FlexScheme.shadRose
    • FlexScheme.shadSlate
    • FlexScheme.shadStone
    • FlexScheme.shadViolet
    • FlexScheme.shadYellow
    • FlexScheme.shadZinc

  • The Shadcn color schemes are still considered beta. The current version does not yet support or use the Shadcn default colors for background, surface and container colors. In this release those colors are using FlexColorScheme's monochrome surface colors. Later versions may change this and use the Shadcn surface colors by default when selecting these themes, with an option to switch to FlexColorScheme's monochrome surface colors, which this version currently uses as the only choice.

  • The Shadcn color selections only set default colors, you will have to theme Material to look more like Shadcn yourself by selecting the correct Material components and modifying their properties to look and behave more like Shadcn style. The Themes Playground includes a pre-configured very preliminary configuration that you can use to do this.

  • The Shadcn color features are in this beta release excluded from FlexColorScheme's otherwise rigorous tests.

Themes Playground

FIX

• Playground: Fix code gen for the first scheme, see issue #275.

CHANGE

• Fix/improve code gen for the second and third Playground scheme. It now exports these schemes the way they are defined internally in the Playground app, instead of as their configuration resulting colors.
• Improved the theme code gen order and added some comments to the generated code to make it easier to understand what the main parts do.
• Removed the theme codegen option used to generate a config to be pasted directly into MaterialApp properties theme and themeDark, in favor of the newer one that generates the configs as its own file. The newer one has been the default option since version 8.0.0.
• Updated TabBar "Known issues" info-expand to state that the broken elastic indicator animation is fixed in Flutter 3.27.3.
• The NavigationRail default configuration in the Playground is now NavigationRailLabelType.none.
  • This is already the default in the FlexColorScheme package and in Flutter SDK. This default value is used to avoid the issue that Flutter SDK only supports using the none option as the collapsed style, when the rail is expanded. For more info about this peculiar limitation see issue #277.
  • Added an info-expand to the NavigationRail panel to explain this known-issue.
  • You can work around this issue, but only on component config level, by setting the labelType to NavigationRailLabelType.none when extended is set to true, and back to null when it is false to use a themed value, that may then have another value than none when the rail is collapsed. This is a limitation in Flutter SDK, not in FlexColorScheme. The Playground app uses this workaround to avoid the issue when it displays the demo NavigationRail in the extended state.

NEW

• Added showing all existing Material-Cupertino platform adaptive widgets. Switch already existed but now also added:
  • AlertDialog.adaptive
  • Slider.adaptive
  • Checkbox.adaptive
  • Radio.adaptive
• BETA
  • Added a built-in config for a Shadcn UI like config to the Premade Designs panel. This is only a first rough beta config.
    • This style configures the Material theme to look a bit like the Shadcn UI design system. It is not an exact replica and never will be, consider it more like inspired by Shadcn. It is primarily intended to be used with the Shadcn theme colors, but you can of course use it with any of the built-in schemes. This is a preliminary first config and will be refined over time as more theming features are added to the Playground that allow us to bring it closer to the Shadcn design. Be aware that the results you get when you use this configuration WILL change in future Themes Playground releases. As always, export your settings and save them as JSON if you want to keep them and use them later again in the Playground.

Version 8.1.1

8.1.1

Feb 15, 2025

NOTE

This fix release only contains a critical Flutter BUG workaround solution for users of Flutter versions 3.27.0 to 3.27.4 and 3.29.0.

This release does not contain any support for new theming features released in Flutter 3.29.0, nor does it address theming properties that were deprecated in Flutter 3.29.0. FlexColorScheme v8.1.1 and v8.1.0, sans the useful workaround released here, are verified to work with Flutter v3.29 as is. A later FlexColorScheme release v8.2.0, will add new theming features and also remove the theming properties that were deprecated in Flutter 3.29.0. Removing them has no impact on FlexColorScheme produced Material-3 themes in Flutter 3.29. Removing and fixing all the deprecations will break things in Flutter 3.27 versions, since some of their replacements do not exist in Flutter 3.27. The issue workaround and fix added here is intended to also support the issue in Flutter 3.27 versions, not only in Flutter 3.29, thus we cannot address the 3.29 deprecations in this release.

Package

FIX

• In Flutter 3.27.0 to at least Flutter 3.29.0 the iconColor on buttons ElevatedButton, FilledButton, OutlinedButton, TextButton and SegmentedButton no longer default to foregroundColor when iconColor is not defined. This is caused by a BREAKING REGRESSION BUG in Flutter SDK, see issue 162839. The issue in Flutter SDK has been fixed via PR 162880. However, this fix will never apply to Flutter versions 3.27.0 to at least 3.29.0. It may land as a cherry-picked hotfix in Flutter 3.29.1 or later minor release of Flutter 3.29. The FIX released here in this version of FlexColorScheme, adds a workaround to this issue. Without this workaround patch, the icon color on the above-mentioned buttons will not work correctly. The used workaround patch will also work correctly after Flutter PR 162880 lands in Flutter.

Themes Playground

• The above-mentioned Flutter SDK issue was added to "Known issues" in info expands on the Buttons and Segmented Buttons Playground panels.

Version 8.1.0

8.1.0

Dec 29, 2024

Package

• Updated the package to support and require at least Flutter v3.27.0.
• Fixed all new analyzer lint warnings and removed usage of all deprecated Color properties.

NEW

• Slider: Added theming properties for the Slider thumb color.

  • FlexSubThemesData got the property sliderThumbSchemeColor.
  • FlexSubThemes.sliderTheme got the property thumbSchemeColor.

• BottomSheet: Added theming properties for the BottomSheet clip behavior property.

  • FlexSubThemesData got the property bottomSheetClipBehavior.
  • FlexSubThemes.bottomSheetTheme got the property clipBehavior.
  • The default value is now null causing the sheet to use Clip.none as the default via the component's built-in default value. Keeping it null, or setting it to Clip.none helps avoid this Flutter SDK issue: #270 where using a BackdropFilter does not work correctly is any other clip behavior value than Clip.none is used.
  • CHANGE/FIX
    • Previously FlexColorScheme made BottomSheetThemeData where the clip behavior was set to Clip.antialias by default, causing the issue with BackdropFilter usage to emerge by default. Now you have to select another clip behavior explicitly to get the same result as before, and ne warned that Flutter SDK has issues when doing so.

• TabBar: Added theming properties for the TabBar indicator animation behavior, that are based on the new enum property TabIndicatorAnimation in Flutter 3.27.0.

  • FlexSubThemesData got the property tabBarIndicatorAnimation.
  • FlexSubThemes.tabBarTheme got the property indicatorAnimation.

• Exposes the convenience Color sRGB extensions from package flex_seed_scheme, that can be used as none deprecated replacements for alpha, red, green, blue and value they are called alpha8bit, red8bit, green8bit, blue8bit and value32bit. FlexColorPicker uses them internally to avoid using the deprecated Color properties.

CHANGE

• Slider: Minor color fidelity change to the Slider's thumb overlay color, it now uses Material-3 default for none tinted overlay. The M3 spec default is tinted as well, so the difference to when using FlexColorScheme's tinted interactions via FlexSubThemesData(interactionEffects: true) is now negligible for the Slider's default thumb overlay color.
• Migrated FlexSubThemes.cardTheme and FlexSubThemes.dialogTheme to use normalized component themes and return CardThemeData and DialogThemeData instead of CardThemeand DialogTheme. This is in-line with changes in Flutter 3.27.0.

FIX

• BUG: Locked errorContainer used tertiaryContainer, corrected to use errorContainer.

Themes Playground

NEW

• Slider: On the Slider panel added a scheme color selector for the Slider thumb color.
• BottomSheet: On the BottomSheet panel added a clipping behavior selector.
• TabBar: On the TabBar panel added a tab indicator animation selector.

CHANGE

• Slider: Increased Playground allowed max Slider track height from 14 to 40.

Version 8.0.2

8.0.2

Dec 1, 2024

Package

FIX

• Changelog for version 8.0.0 says and intended this:

  "The FlexSubThemesData property inputDecoratorIsFilled now default to false when undefined, like Flutter SDK does.
  Set it to true to get the same style it had with previous undefined value."

  Due to a bug, this was not the case. This release fixes the bug and the property now defaults to false when undefined, as intended and documented in version 8.0.0 changelog. FIX: #265

Version 8.0.1

8.0.1

Nov 13, 2024

Package

FIX

• Fixed the version constraint. The V8 package is only compatible with Flutter 3.24.0 and later. It was intended to be compatible with Flutter 3.22.0 and later, but a theming API that is only available in Flutter version 3.24.0 and later made it into the release. If you need a release of version 8 that is also compatible with Flutter 3.22.x, you can use version 8.0.1-dev.3.22 of the package. That package release is identical to this release, but excludes the API not available in Flutter 3.22.0.

Themes Playground

NEW

• Added a quick share button on the side menu. It exports the Playground settings to JSON, makes a URL of it and copies the result to the clip board in one go. Ready to be shared where needed.

CHANGE

• Made changes to the Playground to make it possible to compile it to a Web WASM-GC build. The Playground WASM build is still experimental and not yet published anywhere.

Version 8.0.1-dev.3.22

8.0.1-dev.3.22

Nov 13, 2024

Package

FIX

• This is a special release of FlexColorScheme version 8, it is identical to release 8.0.1, but it removes the locale API from the InputDecorationTheme to keep version 8 compatible with Flutter 3.22.x. If you use Flutter 3.24 or later, you should use the 8.0.0 or later releases instead.

Themes Playground

• Added a quick share button on the side menu. It exports the Playground settings to JSON, makes a URL of it and copies the result to the clip board in one go. Ready to be shared where needed.

Version 8.0.0

Nov 3, 2024

SUMMARY

Version 8.0.0 makes FlexColorScheme fully aligned with Flutter's MAJOR BREAKING Material-3 theming changes introduced in Flutter version 3.22. Due to Flutter 3.22 breaking many past Material styles, introducing new colors to ColorScheme and deprecating three colors, FlexColorScheme had to undergo major revision and also break many of its past styles and some older APIs.

Most APIs are still there and work as before, but a few produce results that differ slightly from past ones, just like Flutter 3.22 also does over previous versions. Generally, the upgrade should be smooth, but you may need to review the produced theme result to see that you don't get any changes that don't fit with your design goals. Some past defaults have changed in FCS V8, but previous settings are still available. However, you will need to enable them explicitly to get the same results as before. The purpose of these default value changes is to make FCS have less opinionated defaults, and be more aligned with Flutter's Material-3 design defaults. The Themes Playground app will still have some of its own opinionated defaults, done via default settings values the app uses in its default configuration, but the package Material-3 default starting points are now much more aligned with Flutter's Material-3 defaults.

In the Themes Playground you can now export and import settings to a JSON file, and import them back into the Playground later. This is a great way to save your theme settings for later re-use. The exported JSON contains all the internal controller settings values you have configured in the Playground app, that are needed to restore a given configuration state. This Playground feature was a nice contribution by GitHub user @akiller in !PR 257, thank you! This contributed feature got enhanced with more error handling and a slightly refined UI to make it production ready. As a further enhancement of the JSON export feature, the Themes Playground app also got the ability to convert the exported settings JSON config to a shareable URL. You can now share Playground settings with other Flutter developers.

MIGRATION

The most critical changes to migrate from FlexColorScheme V7 to V8 are listed below. For a full list of all breaking changes, see PACKAGE CHANGES and the BREAKING part further below.

• The flag useMaterial3 now defaults to true in FlexColorScheme and FlexThemeData constructors. Set it to false to explicitly use Material-2 theming. It defaulted to true before. Material-2 is still fully supported in FCS v8 and Flutter v3.24, but will eventually be deprecated in Flutter, when that happens, it will also happen in FCS.

  With the Themes Playground app, you can use a pre-configured Material-3 based theme that looks very similar to legacy Material-2 design. This will continue to be available also after Material-2 is deprecated in Flutter.

• The FlexSubThemesData properties interactionEffects, tintedDisabledControls, defaultUseM2StyleDividerInM3 and blendOnColors now all default to false. In previous versions they defaulted to true. If you before had not explicitly turned these properties false, they were all true by default. To get the same result as before in FCS V8, you now have to set these properties to true. This change was made to have fewer opinionated defaults in FCS to align it more with Flutter SDK default styles.

• The FlexSubThemesData property navigationRailLabelType no default to NavigationRailLabelType.none. To get the same result as before by default, you will need to set it to NavigationRailLabelType.all. This change was made to have fewer opinionated defaults in FCS to align it more with Flutter SDK default styles. The Playground defaults it to NavigationRailLabelType.all by adding this by default to new default themes.

• Since ColorScheme.background color was deprecated in Flutter 3.22.0 we can no longer use it as a part of surface blends and its modes. For example, when surfaceMode is set to FlexSurfaceMode.highBackgroundLowScaffold it now uses surface and dialog blends set to 2x instead of 1x, so that it represents the "high background" style as before, but done via surface color. Without this breaking change, this mode would produce the same result as FlexSurfaceMode.levelSurfacesLowScaffold and be redundant.

  • NOTE: You may want to check your surface mode and blends to see that they still look as you want them to, as they may have changed slightly depending on your configuration. We have tried to keep required changes subtle, you may not notice any difference, but it is good to check. These changes we forced by Flutter 3.22.0 deprecation of ColorScheme colors background, onBackground and surfaceVariant.

This major release has many breaking changes forced via breaking changes in Flutter 3.22.0. Due to this, the release also uses this opportunity to clean up APIs with opinionated defaults, like the ones mentioned above. There are additional smaller and more subtle changes in defaults values, that align FCS to use the same color defaults from the new ColorScheme colors, that Flutter started using in version 3.22.0 as well. You can find all the details below in the PACKAGE CHANGES chapter.

BACKGROUND

Flutter 3.22 introduced a large number of breaking changes to the ColorScheme and default color mappings that Flutter's Material components use. In total, the Flutter 3.22.0 release adjusted 249 of its own internal tests to accommodate for new Material-3 spec changes, that all broke past Flutter Material-3 component styles. For a reference to the broken and updated tests, see this issue side comment.

FlexColorScheme V8 now allows you to use the new colors introduced in Flutter 3.22. As before, with FCS you can get fully defined hand-tuned ColorSchemes without using Material-3 design's Material Color Utilities (MCU) based seed-generated ColorSchemes. You may prefer to use seed generated ColorSchemes with Material-3, but it is nice to know you do not have to.

To the seed generated ColorSchemes, FCS adds support for all the Flutter DynamicSchemeVariant seed generated variants. It also improves them by allowing you to use separate seed colors for each palette. With Flutter's ColorScheme.fromSeed, you can only seed with one color, the primary color. The resulting ColorScheme always uses computed values for secondary and tertiary palettes, plus a hard coded fixed color for the error palette seeding. Surfaces colors are always tied to primary color as well and include a hint of primary color. With FCS, you do not have these limitations, you can seed with separate colors for each palette with even with Flutter's own dynamic scheme variants. This was always possible with FlexColorScheme and its FlexSeedScheme (FSS) based FlexTones, seed generated scheme variants. FCS now brings this feature to Flutter's own dynamic scheme variants as well.

As before, FCS also has its own even configurable FlexTones way of making seed generated ColorSchemes. Typically, you use predefined FlexTones, but you can also create your own FlexTones configurations. With it, you can define the chroma goals for each palette and define which tone is mapped to what ColorScheme color. An internal example of using them is the implementation of FlexTones modifiers.

FlexColorScheme V8 adds three new FlexTones modifiers. The most useful one is called monochromeSurfaces(). This tone modifier makes the surface shades of any used FlexTones configuration use monochrome greyscale shades for the surface and surface variant palettes. It thus gives us greyscale colors for ALL surfaces, instead of primary-tinted ones. It can be applied to any FlexTones seed generated scheme variant. The other new modifiers are expressiveOnContainer() and higherContrastFixed(). Check the API docs for more details.

PACKAGE CHANGES

This section contains a detailed list of all changes introduced in FlexColorScheme version 8.0.0.

BREAKING CHANGES

This version contains a lot of breaking changes due to updates in the Material-3 ColorScheme in Flutter 3.22. At the same time, this release uses the forced breaking change to clean up some older APIs. FCS is now more aligned with Flutter's Material-3 theming defaults, by typically using them as starting points in the default Material-3 mode. Material-2 mode is still supported, it has its own opinionated defaults as before.

• The ThemeData flag useMaterial3 is now true by default to align with Flutter 3.16.0 and later default for ThemeData. To continue using Material-2 theming, set useMaterial3 to false. All component themes in FlexSubThemes that have a useMaterial3 property now also default to true.

• Keeping to Material-3 defaults, in the theme factories light and dark, if scheme is undefined it now defaults to FlexScheme.materialBaseline the Material-3 baseline scheme, when useMaterial3 is true. If useMaterial3 is false and schemeis undefined, it defaults to FlexScheme.material, the default Material-2 theme, as before.

• Removed ALL references to in Flutter 3.22 deprecated ColorScheme colors background, onBackground and surfaceVariant. They are not used in FCS anymore. The background color was critical for FCS surface blending, it is now handled differently. The removal of these ColorScheme colors had far-reaching, but typically still subtle implications on styles created by FCS. There are many breaking minor style changes in this release due to this. Here are the critical changes caused by all these breaking changes in Flutter 3.22:...

Version 8.0.0-dev.2

8.0.0-dev.2

Oct 26, 2024

SUMMARY

Version 8.0.0 makes FlexColorScheme fully aligned with Flutter's MAJOR BREAKING Material-3 theming changes introduced in Flutter version 3.22. Due to Flutter 3.22 breaking many past Material styles, introducing new colors to ColorScheme and deprecating three colors, FlexColorScheme had to undergo major revision and also break many of its past styles and some older APIs.

Most APIs are still there and work as before, but a few produce results that differ slightly from past ones, just like Flutter 3.22 also does over previous versions. Generally, the upgrade should be smooth, but you may need to review the produced theme result to see that you don't get any changes that don't fit with your design goals. Some past defaults have changed in FCS V8, but previous values are still available. You will need to enable them explicitly to get the same results as before. The purpose of these default value changes is to make FCS have less opinionated defaults, and be more aligned with Flutter's Material-3 design defaults. The Themes Playground app will still have some of its own opinionated defaults, done via default settings values the app uses in its default configuration, but the package Material-3 default starting points, are now much more aligned with Flutter's Material-3 defaults.

In the Themes Playground you can now export and import settings to a JSON file, and import them back into the Playground later. This is a great way to save your theme settings for later re-use. The exported JSON contains all the internal controller settings values you have configured in the Playground app, that are needed to restore a given configuration state. This Playground feature was a nice contribution by GitHub user @akiller in !PR 257, thank you!
This contributed feature got enhanced with more error handling and a slightly refined UI to make it production ready. It can now be tried for the first time in the 8.0.0-dev.2 release and build. As a further enhancement of the JSON export feature, the Themes Playground app also got the ability to convert the exported settings JSON config to a shareable URL. You can now share Playground settings with other Flutter developers.

MIGRATION

The most critical changes to migrate from FlexColorScheme V7 to V8 are listed below. For a full list of all breaking changes, see PACKAGE CHANGES and the BREAKING part further below.

• The flag useMaterial3 now defaults to true in FlexColorScheme and FlexThemeData constructors. Set it to false to explicitly use Material-2 theming. It defaulted to true before. Material-2 is still fully supported in FCS v8 and Flutter v3.24, but will eventually be deprecated in Flutter, when that happens, it will also happen in FCS.

  With the Themes Playground app, you can use a pre-configured Material-3 based theme that looks very similar to legacy Material-2 design. This will continue to be available also after Material-2 is deprecated in Flutter.

• The FlexSubThemesData properties interactionEffects, tintedDisabledControls, defaultUseM2StyleDividerInM3 and blendOnColors now all default to false. In previous versions they defaulted to true. If you before had not explicitly turned these properties false, they were all true by default. To get the same result as before in FCS V8, you now have to set these properties to true. This change was made to have fewer opinionated defaults in FCS to align it more with Flutter SDK default styles.

• The FlexSubThemesData property navigationRailLabelType no default to NavigationRailLabelType.none. To get the same result as before by default, you will need to set it to NavigationRailLabelType.all. This change was made to have fewer opinionated defaults in FCS to align it more with Flutter SDK default styles. The Playground defaults it to NavigationRailLabelType.all by adding this by default to new default themes.

• Since ColorScheme.background color was deprecated in Flutter 3.22.0 we can no longer use it as a part of surface blends and its modes. For example, when surfaceMode is set to FlexSurfaceMode.highBackgroundLowScaffold it now uses surface and dialog blends set to 2x instead of 1x, so that it represents the "high background" style as before, but done via surface color. Without this breaking change, this mode would produce the same result as FlexSurfaceMode.levelSurfacesLowScaffold and be redundant.

  • NOTE: You may want to check your surface mode and blends to see that they still look as you want them to, as they may have changed slightly depending on your configuration. We have tried to keep required changes subtle, you may not notice any difference, but it is good to check. These changes we forced by Flutter 3.22.0 deprecation of ColorScheme colors background, onBackground and surfaceVariant.

This major release has many breaking changes forced via breaking changes in Flutter 3.22.0. Due to this, the release also uses this opportunity to clean up APIs with opinionated defaults, like the ones mentioned above. There are additional smaller and more subtle changes in defaults values, that align FCS to use the same color defaults from the new ColorScheme colors, that Flutter started using in version 3.22.0 as well. You can find all the details below in the PACKAGE CHANGES chapter.

BACKGROUND

Flutter 3.22 introduced a large number of breaking changes to the ColorScheme and default color mappings that Flutter's Material components use. In total, the Flutter 3.22.0 release adjusted 249 of its own internal tests to accommodate for new Material-3 spec changes, that all broke past Flutter Material-3 component styles. For a reference to the broken and updated tests, see this issue side comment.

FlexColorScheme V8 now allows you to use the new colors introduced in Flutter 3.22. As before, with FCS you can get fully defined hand-tuned ColorSchemes without using Material-3 design's Material Color Utilities (MCU) based seed-generated ColorSchemes. You may prefer to use seed generated ColorSchemes with Material-3, but it is nice to know you do not have to.

To the seed generated ColorSchemes, FCS adds support for all the Flutter DynamicSchemeVariant seed generated variants. It also improves them by allowing you to use separate seed colors for each palette. With Flutter's ColorScheme.fromSeed, you can only seed with one color, the primary color. The resulting ColorScheme always uses computed values for secondary and tertiary palettes, plus a hard coded fixed color for the error palette seeding. Surfaces colors are always tied to primary color as well and include a hint of primary color. With FCS, you do not have these limitations, you can seed with separate colors for each palette with even with Flutter's own dynamic scheme variants. This was always possible with FlexColorScheme and its FlexSeedScheme (FSS) based FlexTones, seed generated scheme variants. FCS now brings this feature to Flutter's own dynamic scheme variants as well.

As before, FCS also has its own even configurable FlexTones way of making seed generated ColorSchemes. Typically, you use predefined FlexTones, but you can also create your own FlexTones configurations. With it, you can define the chroma goals for each palette and define which tone is mapped to what ColorScheme color. An internal example of using them is the implementation of FlexTones modifiers.

FlexColorScheme V8 adds three new FlexTones modifiers. The most useful one is called monochromeSurfaces(). This tone modifier makes the surface shades of any used FlexTones configuration use monochrome greyscale shades for the surface and surface variant palettes. It thus gives us greyscale colors for ALL surfaces, instead of primary-tinted ones. It can be applied to any FlexTones seed generated scheme variant. The other new modifiers are expressiveOnContainer() and higherContrastFixed(). Check the API docs for more details.

TODOS BEFORE STABLE RELEASE

• TODO: Flutter 3.22 broke +300 tests in FCS 7.3.1, review and fix them after all updates.
  • New features and adapting FCS to Flutter 3.22 also broke many tests.
  • Update and review all tests.
    • Test fix status:
      • At quality assurance start, 309 tests to fix
      • Now 59 tests remain to fix.
      • Of at start total 2103 tests, and now 2189 total tests.
      • Coverage is now at 94%.
    • Add tests for new features. Get the FCS package back to 100% test coverage.
  • Will release 8.0.0-dev releases without all test fixes and updates to them, to test the release WEB build and to offer early access to V8 and try new features.

• TODO: Study and potentially report 14 found new Flutter SDK theming issues. Report if not already existing and if they are still valid after check on master using a simple reproduction sample. Add issue GitHub links to known issue expands in the Playground app and to package doc comments, as well as code TODOs where relevant.

MINOR KNOWN ISSUES

• Playground: Cancelling input colors from custom theme get reset to active ColorScheme, not to input values.
  • This is a bug in the Playground app. It should reset them to the input values, not to the active ColorScheme values. It now changes the underlying input color to the scheme and not back to the input value it had when we cancel color editing. We do not see this faulty change in the effective theme, but if we change theme modifiers, we no longer have the original input color. If we show the input colors, we can easily observe this bug. This bug is not new, it has existed a long time.
    ...

Version 8.0.0-dev.1

Changelog

All changes to the FlexColorScheme (FCS) package are documented here.

8.0.0-dev.1

Oct 14, 2024

SUMMARY

Version 8.0.0 makes FlexColorScheme fully aligned with Flutter's MAJOR BREAKING Material-3 theming changes introduced in Flutter version 3.22. Due to Flutter 3.22 breaking many past Material styles, introducing new colors to ColorScheme and deprecating three colors, FlexColorScheme had to undergo major revision and also break many of its past styles and some older APIs.

Most APIs are still there and work as before, but a few produce results that differ slightly from past ones, just like Flutter 3.22 also does over previous versions. Generally, the upgrade should be smooth, but you may need to review the produced theme result to see that you don't get any changes that don't fit with your design goals. Some past defaults have changed in FCS V8, but previous values are still available. You will need to enable them explicitly to get the same results as before. The purpose of these default value changes is to make FCS have less opinionated defaults, and be more aligned with Flutter's Material-3 design defaults. The Themes Playground app will still have some of its own opinionated defaults, done via default settings values the app uses in its default configuration, but the package Material-3 default starting points, are now much more aligned with Flutter's Material-3 defaults.

MIGRATION

The most critical changes to migrate from FlexColorScheme V7 to V8 are listed below. For a full list of all breaking changes, see PACKAGE CHANGES and the BREAKING part further below.

• The flag useMaterial3 now defaults to true in FlexColorScheme and FlexThemeData constructors. Set it to false to explicitly use Material-2 theming. It defaulted to true before. Material-2 is still fully supported in FCS v8 and Flutter v3.24, but will eventually be deprecated in Flutter, when that happens, it will also happen in FCS.

  With the Themes Playground app, you can use a pre-configured Material-3 based theme that looks very similar to legacy Material-2 design. This will continue to be available also after Material-2 is deprecated in Flutter.

• The FlexSubThemesData properties interactionEffects, tintedDisabledControls, defaultUseM2StyleDividerInM3 and blendOnColors now all default to false. In previous versions they defaulted to true. If you before had not explicitly turned these properties false, they were all true by default. To get the same result as before in FCS V8, you now have to set these properties to true. This change was made to have fewer opinionated defaults in FCS to align it more with Flutter SDK default styles.

• The FlexSubThemesData property navigationRailLabelType no default to NavigationRailLabelType.none. To get the same result as before by default, you will need to set it to NavigationRailLabelType.all. This change was made to have fewer opinionated defaults in FCS to align it more with Flutter SDK default styles. The Playground defaults it to NavigationRailLabelType.all by adding this by default to new default themes.

• Since ColorScheme.background color was deprecated in Flutter 3.22.0 we can no longer use it as a part of surface blends and its modes. For example, when surfaceMode is set to FlexSurfaceMode.highBackgroundLowScaffold it now uses surface and dialog blends set to 2x instead of 1x, so that it represents the "high background" style as before, but done via surface color. Without this breaking change, this mode would produce the same result as FlexSurfaceMode.levelSurfacesLowScaffold and be redundant.

  • NOTE: You may want to check your surface mode and blends to see that they still look as you want them to, as they may have changed slightly depending on your configuration. We have tried to keep required changes subtle, you may not notice any difference, but it is good to check. These changes we forced by Flutter 3.22.0 deprecation of ColorScheme colors background, onBackground and surfaceVariant.

This major release has many breaking changes forced via breaking changes in Flutter 3.22.0. Due to this, the release also uses this opportunity to clean up APIs with opinionated defaults, like the ones mentioned above. There are additional smaller and more subtle changes in defaults values, that align FCS to use the same color defaults from the new ColorScheme colors, that Flutter started using in version 3.22.0 as well. You can find all the details below in the PACKAGE CHANGES chapter.

BACKGROUND

Flutter 3.22 introduced a large number of breaking changes to the ColorScheme and default color mappings that Flutter's Material components use. In total, the Flutter 3.22.0 release adjusted 249 of its own internal tests to accommodate for new Material-3 spec changes, that all broke past Flutter Material-3 component styles. For a reference to the broken and updated tests, see this issue side comment.

FlexColorScheme V8 now allows you to use the new colors introduced in Flutter 3.22. As before, with FCS you can get fully defined hand-tuned ColorSchemes without using Material-3 design's Material Color Utilities (MCU) based seed-generated ColorSchemes. You may prefer to use seed generated ColorSchemes with Material-3, but it is nice to know you do not have to.

To the seed generated ColorSchemes, FCS adds support for all the Flutter DynamicSchemeVariant seed generated variants. It also improves them by allowing you to use separate seed colors for each palette. With Flutter's ColorScheme.fromSeed, you can only seed with one color, the primary color. The resulting ColorScheme always uses computed values for secondary and tertiary palettes, plus a hard coded fixed color for the error palette seeding. Surfaces colors are always tied to primary color as well and include a hint of primary color. With FCS, you do not have these limitations, you can seed with separate colors for each palette with even with Flutter's own dynamic scheme variants. This was always possible with FlexColorScheme and its FlexSeedScheme (FSS) based FlexTones, seed generated scheme variants. FCS now brings this feature to Flutter's own dynamic scheme variants as well.

As before, FCS also has its own even configurable FlexTones way of making seed generated ColorSchemes. Typically, you use predefined FlexTones, but you can also create your own FlexTones configurations. With it, you can define the chroma goals for each palette and define which tone is mapped to what ColorScheme color. An internal example of using them is the implementation of FlexTones modifiers.

FlexColorScheme V8 adds three new FlexTones modifiers. The most useful one is called monochromeSurfaces(). This tone modifier makes the surface shades of any used FlexTones configuration use monochrome greyscale shades for the surface and surface variant palettes. It thus gives us greyscale colors for ALL surfaces, instead of primary-tinted ones. It can be applied to any FlexTones seed generated scheme variant. The other new modifiers are expressiveOnContainer() and higherContrastFixed(). Check the API docs for more details.

TODOS BEFORE STABLE RELEASE

• TODO: Flutter 3.22 broke +150 tests in FCS 7.3.1, review and fix them after all updates.
  • New features and adapting FCS to Flutter 3.22 also intentionally introduced more breakage. Currently, 309 tests of 2097 are broken.
  • Update and review all tests. Add tests for new features. Get the FCS package back to 100% test coverage.
  • Will release 8.0.0-dev releases without all test fixes and updates to them, to test the release WEB build and offer them as early access.

• TODO: Study and potentially report 14 found new Flutter SDK theming issues. Report if not already existing and if they are still issues after check on master using a simple reproduction sample. Add issue GitHub links to known issue expands in the Playground and to package doc comments and code TODOs where relevant.

MINOR KNOWN ISSUES

• Package: The toScheme method may need some updates for the raw FlexColorScheme? constructor to not provide surprises

  • Theming and toScheme works as intended with light/dark factories. This update would only be for a better raw constructor result. The raw constructor is not supposed to be used directly, so any gaps are not really that relevant.

• Playground: Cancelling input colors from custom theme get reset to active ColorScheme, not to input values.

  • This is a bug in the Playground app. It should reset them to the input values, not to the active ColorScheme values. While this kind of buggy behavior is a bit easier to understand visually, it does change the underlying input color to the scheme and not back to its input it had when we cancel. We do not see this faulty change in the effective theme, but if we change theme modifiers, we no longer have the original input color. If we show the input colors, we can more easily observe this bug.

COMPLETED CRITICAL CHANGES

• DONE: Consider what to do with surfaceTint removal.
  • It is basically obsolete now in Flutter 3.22 and later.
  • Will keep it around for now, but added info about it being obsolete in Flutter 3.22 or later, in its info-expands.
• DONE: Consider what to do with shadows back.
  • Keep and add more fine-grained control later, via shadow color selection per component.
• DONE: Generate full ColorScheme in Themes Playground, also when not seeding. Need all "fixed" and "fixedDim" colors.
  • This was tricky, big rework and new features.
• DONE: Figure out how to handle background not existing in ColorScheme; it was critical in FCS for its surface blends....