rydmike / flex_seed_scheme

A more flexible version of Flutter's ColorScheme.fromSeed
Other
24 stars 2 forks source link

levels of contrast #14

Closed fredgrott closed 4 months ago

fredgrott commented 4 months ago

Hello Mike,

So I re-examined the ColorScheme.seed source code and it seems that Flutter SDK is moving towards supporting high constrast across all platforms via levels of contrast. Is their a solution how we do that using FSS or FCS yet?

Thanks.

rydmike commented 4 months ago

Hi Fred,

Good question and yes I plan to add this as well, maybe in next release already.

It is currently not supported in Flutter 3.22.2 (the private _buildDynamicScheme is still hard coded to contrast level 0), but it is exposed on master channel.

In this case I can actually add this feature to FlexSeedScheme before it is supported in Flutter stable channel.

fredgrott commented 4 months ago

Yeah, when I saw that the CS methods of light, dark, etc marked as MD2...I had a feeling that contrast levels would be tacked in Flutter SDK...glad I caught it now as was just pre planning theme articles for my substack.

My work around now is to create some extra custom Flex Tones...

rydmike commented 4 months ago

Cool to hear someone is using and creating custom FlexTones, one of the key points with FSS is to give users the power to create their own FlexTones, with custom chroma limits and tone mappings to fit their needs. This in addition to allow users to use separate key/seed colors for all tonal palettes, not just the primary palette, something Flutter's ColorScheme.fromSeed API still refuses to do, even in master.

fredgrott commented 4 months ago

Okay contrastLevels is connected to generating the content scheme...since MCU in FSS already has the hooks I am going about creating the FSS work around to do it as its how we use brand logo to generate the color scheme in a Flutter App....design happy now.. basically its down to this pseudo code:

HCT.fromInt(argb)

Then I feed that into ContentScheme with the contrast level and whether its dark or light and then that produces the full ContentScheme to use in the app as a ColorScheme via extension methods to convert the ContentScheme to a SDK colorscheme.

rydmike commented 4 months ago

The contrastLevel will land in the next release. https://github.com/rydmike/flex_seed_scheme/blob/version-2-1-0-dev-1/CHANGELOG.md

It only works on variants that are based on MCU's DynamicScheme:

https://github.com/rydmike/flex_seed_scheme/assets/39990307/5946a8a3-58c4-4f8d-a749-92f05e278950

It has no effect on FlexTones based schemes. Using contrastLevel has some odd side effects, it make the fixed colors no longer fixed, meaning they are different for light/dark mode as soon as a none 0 contrast is used. I wonder if this is a design oversight by MCU authors, I might post a question about it later in the MCU repo.

Using contrastLevel also makes primary color no longer usable as a contrasting color on inversePrimary when using contrastLevel below 0. But I guess inverseSurface is a better contrast color combo for it generally than primary every was. Going t chnage to it in the demo and also in FlexColorScheme as its prefferred auto contrast,

As before MCU's DynamcScheme based seed generated ColorScheme's can only use on seed color, the one for primary color. Where as FlexTones based ones can use a separate seed/key color for each palette (ie main colors, error color and neutral surface colors). I guess I could remove ti limitation if I customize my internal version of the MCU DynamicScheme, or maybe add a modified version version of it, as I would like to keep the 1-to-1 copy of the internal MCU version.

FSS internal MCU is bumped to version 0.12.0, it has some breaking results on its DynamicScheme compared to previous version concerning all the onNnnnContainer (Nnnn = Primary, Secondary, Tertiary, Error) colors. Flutter is not yet using 0.12.0 anywhere, but it will switch eventually.

By the way the reason why I have an internal own version of MCU baked into FSS is so that FSS can be used with whatever Flutter channel, since the different channels often pin different versions of MCU it became a hassle to deal with MCU version conflicts in FSS and FCS. Plu my version of MCU has more tests, so I can see when the break past color values. Which is why I noticed 0.12.0 breaks more than what is led on in the 0.12.0 change log when it comes to some part color values seed generation produces.

In version 2.1.0 the FlexTones based schemes can now be used with a new modifier monochromeSurfaces() that removes any tint from all the surface shades, useful for those tired of tinted surface. One can also remove tint in light mode where many dislike it and keep it in dark mdoe, where it is more subtle. Or remove in both.

https://github.com/rydmike/flex_seed_scheme/assets/39990307/9bebeaf8-61be-415e-9922-06b40e7f6fc1

rydmike commented 4 months ago

The above is not released yet though, maybe later today when I finish writing the tests for it and tweak the demo app a bit more and update docs.

rydmike commented 4 months ago

Closing this enhancement request as it is supported in just released version 3.0.0.