search

rydmike / flex_color_scheme

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

useMaterial3: true, doesn't work for dialogs #225

Closed Mounix99 closed 6 months ago

Mounix99 commented 6 months ago

My app uses useMaterial3: true, for a long time and after latest updates of Flutter my dialogs become square, and this option doesn't handle this, only direct override of themeData above dialog can change the shape

rydmike commented 6 months ago

Without more information on how your FlexColorScheme theme definitions look like and are made, it is not possible to answer your question with any significant detail.

Please provide a runnable code reproduction sample, reproducing the current result and describe the result you are expecting.

Meanwhile, a few hints and suggestions on what to look into

By default, if M3 mode is used in FlexColorScheme, radius of dialogs are the same as as with vanilla ThemeData, as shown here:

Screenshot 2024-03-29 at 16 15 24

One possibility is of course that you have set the global default theme radius in your FlexColorScheme too, in its M3 mode, to something custom like 4 or 8. Only at its default undefined setting value, will all components use their default value that varies by component type in M3 mode design. If the value is set, then in that case pretty much every corner radius will use that value, as also explained in the Themes Playground and API docs:

Screenshot 2024-03-29 at 16 17 53

Screenshot 2024-03-29 at 16 19 42

Even if it is the case, that you want eg 8dp on most other components (a very common design), but not on Dialogs, you can specify the radius value for each dialog component theme separately as well and it will the override the global setting. So if you want 28dp back, then use that, it is enough to set it on the general dialog, TimePicker and and DatePicker will follow, but you can if you want to, also give them other values.

Screenshot 2024-03-29 at 16 26 49

Screenshot 2024-03-29 at 16 29 38

TIP With FlexColorScheme you can even have platform adaptive responses to border radius on many components, so it can look different on e.g. Android and iOS, as well as remove the elevation tint used in Material3 on none Android platforms. These feature are intended to enable more platform agnostic designs when Material3 mode is used on e.g. iOS, desktop and web platform, while keeping M3 Android look on Android.

Mounix99 commented 6 months ago

Hm, I have tried this options, but it doesn't help. I've managed to achieve what I need by copyWith method for Theme data and set DialogTheme with shape parameter

rydmike commented 6 months ago

Hi @Mounix99, sadly without seeing your code or a sample that reproduces the same issue, to be able to figure out what goes wrong were, there is unfortunately not much else I can advice with or do.

It works in all tests and samples. Clearly there is something different with your use case, but I would need more info to be able figure out what it is. Still, glad if you can get it to work as desired with copyWith, even if it should not be needed based on your description of your use case.

Mounix99 commented 6 months ago

Sorry, I would like but I can't share the code of this project, maybe I'll prepare a sample in future, if I will have time, thanks for help!