rydmike / flex_color_scheme

A Flutter package to make and use beautiful color scheme based themes.
Other
956 stars 107 forks source link

After using flex_color_scheme, in addition to the prepaid theme, how can I switch to the theme of M3's dynamic adaptive wallpaper #252

Closed maxfrees closed 4 days ago

maxfrees commented 5 days ago

After using flex_color_scheme, in addition to the prepaid theme, how can I switch to the theme of M3's dynamic adaptive wallpaper

rydmike commented 4 days ago

Hi @maxfrees, I guess what you mean with "M3's dynamic adaptive wallpaper" is the DynamicSchemeVariants in Flutter's ColorScheme.fromSeed(variant) property?

And prepaid is premade I suppose, since they are all free 😄

If so this is a new feature just made available in the pre-release of FlexColorScheme version 8.0.0.

FlexColorScheme package dev release 8.0.0-dev.1 has been published. This is a BIG update with breaking changes and many new features. It has its own dev pre-release of the Themes Playground as well, feel free to take a look. No new API changes are planned for the stable 8.0.0 release from this dev.1 release.

We would appreciate any feedback about found issues from early adopters.

FOR INFO there will be no new features or changes in it compared to this one. Only any issues found from the quality assurance will be addressed. The stable release will also include many doc updates, but docs site will continue to be edited and revised AFTER the 8.0.0 stable release.

Screenshot 2024-10-15 at 14 13 01

Quick demo:

https://github.com/user-attachments/assets/f58bfa64-ae2f-4adc-85ee-5141d469f437


If on the other hand you actually refer to using the current wallpaper, or Android system theme colors, as input for you own app's theme, then you need to use the package https://pub.dev/packages/dynamic_color to first extract such system colors.

You can then use either the fully extracted ColorScheme or some colors from it as color input to the FlexColorScheme to make the theme for your app.

maxfrees commented 4 days ago

Yes, I'm referring to using the current wallpaper or Android system theme color as the app theme

maxfrees commented 4 days ago

image And I've noticed that this part is blank, and I'm not sure if it's a bug

rydmike commented 4 days ago

Yes the colors from the native system can only be extracted with native API using libs from Google called https://pub.dev/packages/dynamic_color. As mentioned you can use it in combo with FlexColorScheme too. Someday I should add an example of that. Will add it to my todo list.

But bascially get the color scheme from it first, then either use its entire result as input to FlexColorScheme and its colorScheme prop, or use a few colors from the ColorScheme you get from it as seed/key color in FlexColorsScheme to make a new, a bit tuned ColorScheme that has its own twist in relation to the one you got from DynamicColor.


The switch works as expected. I admit it is a but unusual UX. It is "multifunctional". It both Turns ON/OFF using seeding at all and also allows you to select which color palettes should use their input color as seed colors.

You can only turn it ON by first enabling using the primary color as seed color, as a seed/key color for the ColorScheme, by clicking Primary option, you then get the option to also toggle using the other seed colors, individually.

If you then toggle OFF primary, everything turns off, and seeding is not used at all, as it always has to be used, seeding cannot be used without it.

To use seed generation you must always use at least primary. When you turn it on using primary again, it remembers the other selections you had when you turned OFF primary, so you don't have to toggle them back to the selection you made before when it was on.

Since this is more of discussion and not an issue. I'm going to convert this to Discussion and keep it around there as a Q&A, we can continue the discussion there 😄