Can I provide theme thumbnails?

[jahnli]

I want to give the user a choice of themes in my APP, but I have no idea how to display them, can I provide thumbnails of themes in themesplayground, I can't find them in the warehouse

[rydmike]

Hi @jahnli and thanks for your question.

If you want to you can certainly use the widget used above to make your own thumbnail theme selection too. The widget used to make the above thumbnail is actually a part of the package. Although it is not so difficult to build your own, but in very early version I was asked if I could add it as widget to the package, and I did and it is still around, just not very well advertised 😄

In the docs you can find a bit info about it here: https://docs.flexcolorscheme.com/deep_dives#flexthememodeswitch

Where there are also links to its API docs. It was primary offered as a theme mode switch button: https://pub.dev/documentation/flex_color_scheme/latest/flex_color_scheme/FlexThemeModeSwitch-class.html but its building block just the box with the four colors is also available, https://pub.dev/documentation/flex_color_scheme/latest/flex_color_scheme/FlexThemeModeOptionButton-class.html

As shown in the docs page it can be styled quite a bit:

For some examples of how to use it as theme selector, then talking about the FlexThemeModeOptionButton,
you can check the open source Themes Playground code. The Playground is actually step/example 5, in FlexColorScheme usage tutorial: https://docs.flexcolorscheme.com/tutorial5

Here you can find the code for this full screen horizontal theme color selector

and also for the vertical theme color selector

using the theme thumbs and see how it was used in the Themes Playground app:

https://github.com/rydmike/flex_color_scheme/blob/master/example/lib/example5_themes_playground/widgets/panels/theme_colors_settings/input_colors_selector.dart

In the Themes Playground colors panel, there is also a popup menu based theme selector:

Since this code base was originally made as a tutorial for showing different possibilities it sometimes app wise contain different ways of modifying and doing things, just as a tutorial. As an app UX it can actually be a bit confusing, so I plan to remove these dual ways of doing things a future redesign of the Playground app.

In this case the code for the popup example is more "isolated" and it is a much easier example to use to see how it makes the theme color selection thumbs:

https://github.com/rydmike/flex_color_scheme/blob/master/example/lib/example5_themes_playground/widgets/panels/theme_colors_settings/input_colors_popup_menu.dart

This is just one way of making theme color thumb presentations, I've seen more elegant ways of providing a mini app as thumb with prominent colors shown on maybe 5 widgets. The thumbs used in this app is just one example that can also serve as a guide on how to make something even fancier.

[rydmike]

Added an enhancement issue for the needed convenience API on enum FlexScheme here #210

[rydmike]

This fix/new feature for this is included the 8.0.0-dev release.

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 peak. No new API changes are planned for the stable 8.0.0 release from this dev.1 release.

• Doc site has some pre-info
• Dev release of PKG here
• The PKG changelog has the most detailed info

FOR INFO there will be no new features or changes in it compared to this one. Only any issues found from the QA 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.

[jahnli]

Thank you for your reply, when will v8 be released?

[rydmike]

You can use it already now if it is urgent. Even if it is 8.0.0-dev.1 release, there are no additional changes plans. The only diff between this 8.0.0-dev.1 and 8.0.0 release will be a lot of Quality Assurance work, which means reviewing and updating all existing tests and adding a lot of new test, plus also updating some doc API comments, although those are already up to date, but some double check.

One of the reasons for the pre-release/dev-release is also to check its pub scoring, which all look good.

Reviewing and doing all the test until they are up to my standard will take some time, no idea how long, sorry, it is all evening and weekend work :(

The doc site will be updated after the 8.0.0 stable release, gradually.

A dev release of the 8.0.0 Themes Playground is already out too:
https://rydmike.com/flexcolorscheme/themesplayground-dev/

It has a lot of new features.

Once the stable 8.0.0 is ready I plan to to make some short form video tutorials too.

[jahnli]

Thank you for your work and look forward to it.