Skip to content

Commit

Permalink
Updates for Fluter 3.13.0 stable
Browse files Browse the repository at this point in the history
  • Loading branch information
rydmike committed Aug 16, 2023
1 parent 717bd8e commit c5006b4
Show file tree
Hide file tree
Showing 10 changed files with 40 additions and 41 deletions.
20 changes: 10 additions & 10 deletions .github/workflows/deploy.yml
Original file line number Diff line number Diff line change
Expand Up @@ -68,14 +68,14 @@ jobs:
- name: "EXAMPLE-1 START BUILD - Flutter clean before build"
run: flutter clean && cd example && flutter clean
- name: "EXAMPLE-1 WEB release build"
run: cd example && flutter build web --web-renderer canvaskit --base-href "/flexcolorscheme/basictheme-v7-2/" --release -t lib/example1_basic_theme_usage/main.dart
run: cd example && flutter build web --web-renderer canvaskit --base-href "/flexcolorscheme/basictheme-latest/" --release -t lib/example1_basic_theme_usage/main.dart
- name: "EXAMPLE-1 DEPLOY to GitHub Pages repository, published on commit."
uses: dmnemec/[email protected]
env:
API_TOKEN_GITHUB: ${{ secrets.API_TOKEN_GITHUB }}
with:
source_file: 'example/build/web/.'
destination_folder: 'flexcolorscheme/basictheme-v7-2'
destination_folder: 'flexcolorscheme/basictheme-latest'
destination_repo: 'rydmike/rydmike.github.io'
user_email: '[email protected]'
user_name: 'rydmike'
Expand All @@ -84,14 +84,14 @@ jobs:
- name: "EXAMPLE-2 START BUILD - Flutter clean before build"
run: flutter clean && cd example && flutter clean
- name: "EXAMPLE-2 WEB release build"
run: cd example && flutter build web --web-renderer canvaskit --base-href "/flexcolorscheme/customtheme-v7-2/" --release -t lib/example2_custom_theme/main.dart
run: cd example && flutter build web --web-renderer canvaskit --base-href "/flexcolorscheme/customtheme-latest/" --release -t lib/example2_custom_theme/main.dart
- name: "EXAMPLE-2 DEPLOY to GitHub Pages repository, published on commit."
uses: dmnemec/[email protected]
env:
API_TOKEN_GITHUB: ${{ secrets.API_TOKEN_GITHUB }}
with:
source_file: 'example/build/web/.'
destination_folder: 'flexcolorscheme/customtheme-v7-2'
destination_folder: 'flexcolorscheme/customtheme-latest'
destination_repo: 'rydmike/rydmike.github.io'
user_email: '[email protected]'
user_name: 'rydmike'
Expand All @@ -100,14 +100,14 @@ jobs:
- name: "EXAMPLE-3 START BUILD - Flutter clean before build"
run: flutter clean && cd example && flutter clean
- name: "EXAMPLE-3 WEB release build"
run: cd example && flutter build web --web-renderer canvaskit --base-href "/flexcolorscheme/fourthemes-v7-2/" --release -t lib/example3_four_themes/main.dart
run: cd example && flutter build web --web-renderer canvaskit --base-href "/flexcolorscheme/fourthemes-latest/" --release -t lib/example3_four_themes/main.dart
- name: "EXAMPLE-3 DEPLOY to GitHub Pages repository, published on commit."
uses: dmnemec/[email protected]
env:
API_TOKEN_GITHUB: ${{ secrets.API_TOKEN_GITHUB }}
with:
source_file: 'example/build/web/.'
destination_folder: 'flexcolorscheme/fourthemes-v7-2'
destination_folder: 'flexcolorscheme/fourthemes-latest'
destination_repo: 'rydmike/rydmike.github.io'
user_email: '[email protected]'
user_name: 'rydmike'
Expand All @@ -116,14 +116,14 @@ jobs:
- name: "EXAMPLE-4 START BUILD - Flutter clean before build"
run: flutter clean && cd example && flutter clean
- name: "EXAMPLE-4 WEB release build"
run: cd example && flutter build web --web-renderer canvaskit --base-href "/flexcolorscheme/allthemes-v7-2/" --release -t lib/example4_all_themes/main.dart
run: cd example && flutter build web --web-renderer canvaskit --base-href "/flexcolorscheme/allthemes-latest/" --release -t lib/example4_all_themes/main.dart
- name: "EXAMPLE-4 DEPLOY to GitHub Pages repository, published on commit."
uses: dmnemec/[email protected]
env:
API_TOKEN_GITHUB: ${{ secrets.API_TOKEN_GITHUB }}
with:
source_file: 'example/build/web/.'
destination_folder: 'flexcolorscheme/allthemes-v7-2'
destination_folder: 'flexcolorscheme/allthemes-latest'
destination_repo: 'rydmike/rydmike.github.io'
user_email: '[email protected]'
user_name: 'rydmike'
Expand All @@ -132,14 +132,14 @@ jobs:
- name: "EXAMPLE-5 START BUILD - Flutter clean before build"
run: flutter clean && cd example && flutter clean
- name: "EXAMPLE-5 WEB release build"
run: cd example && flutter build web --web-renderer canvaskit --base-href "/flexcolorscheme/themesplayground-v7-2/" --release -t lib/example5_themes_playground/main.dart
run: cd example && flutter build web --web-renderer canvaskit --base-href "/flexcolorscheme/themesplayground-latest/" --release -t lib/example5_themes_playground/main.dart
- name: "EXAMPLE-5 DEPLOY to GitHub Pages repository, published on commit."
uses: dmnemec/[email protected]
env:
API_TOKEN_GITHUB: ${{ secrets.API_TOKEN_GITHUB }}
with:
source_file: 'example/build/web/.'
destination_folder: 'flexcolorscheme/themesplayground-v7-2'
destination_folder: 'flexcolorscheme/themesplayground-latest'
destination_repo: 'rydmike/rydmike.github.io'
user_email: '[email protected]'
user_name: 'rydmike'
4 changes: 2 additions & 2 deletions .github/workflows/deploy_playground.yml
Original file line number Diff line number Diff line change
Expand Up @@ -60,14 +60,14 @@ jobs:
- name: "EXAMPLE-5 START BUILD - Flutter clean before build"
run: flutter clean && cd example && flutter clean
- name: "EXAMPLE-5 WEB release build"
run: cd example && flutter build web --web-renderer canvaskit --base-href "/flexcolorscheme/themesplayground-v7-2/" --release -t lib/example5_themes_playground/main.dart
run: cd example && flutter build web --web-renderer canvaskit --base-href "/flexcolorscheme/themesplayground-latest/" --release -t lib/example5_themes_playground/main.dart
- name: "EXAMPLE-5 DEPLOY to GitHub Pages repository, published on commit."
uses: dmnemec/[email protected]
env:
API_TOKEN_GITHUB: ${{ secrets.API_TOKEN_GITHUB }}
with:
source_file: 'example/build/web/.'
destination_folder: 'flexcolorscheme/themesplayground-v7-2'
destination_folder: 'flexcolorscheme/themesplayground-latest'
destination_repo: 'rydmike/rydmike.github.io'
user_email: '[email protected]'
user_name: 'rydmike'
15 changes: 6 additions & 9 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,11 @@ All changes to the **FlexColorScheme** (FCS) package are documented here.

## 7.3.0

**August 13, 2023**
**August 16, 2023**

* Requires minimum Flutter **Channel beta, 3.13.0-0.3.pre**.
* This is a WIP branch to prepare for new theming features and changes in the next Flutter stable release. It is assumed to arrive within a month using version number Flutter stable 3.13.0.
This release uses new features in Material-3 theming that are only available in Flutter 3.13 or later. It thus **requires** minimum **Flutter 3.13.0**.

In the next Flutter stable release after 3.13, Flutter will change the `ThemeData.useMaterial3` default from `false` to true. In other words, applications using FCS will get the Material-3 colors, text styles, and other visuals, by default. The `FlexColorScheme` API will then be following along with this breaking change. In this release the `FlexColorScheme` API `useMaterial3` still defaults to `false`. The **Themes Playground** app has for quite some time already defaulted to setting the value to `true`. Which is also already the case in Flutter when you create a new application with `flutter create`.

**PACKAGE**

Expand All @@ -29,7 +30,7 @@ All changes to the **FlexColorScheme** (FCS) package are documented here.
* The `TextStyle` additions above, to mentioned `FlexSubThemes`, do not yet bring any new features usable via `FlexColorScheme` theming APIs. They are a preparation for adding more component `TextStyles` to `FlexSubThemesData`. This in turn, will enable more direct `TextStyle` theming via `FlexColorScheme` API without using `copyWith` to override produced `ThemeData`.


* As planned in previous versions, made the `FlexSubThemesData.useInputDecoratorThemeInDialogs` apply also to `DatePickerDialog` and not only to `TimePickerDialog`. This feature is not optimally supported by the framework. The current implementation has severe issues and limitations. See more info in [PR #128950 comment](https://github.com/flutter/flutter/pull/128950#issuecomment-1657177393). Additional info about the differences in how `InputDecorationTheme` behaves in different component themes, read the proposal **"Make InputDecorationTheme usage in components consistent"** in [issue #131666](https://github.com/flutter/flutter/issues/131666).
* As planned in previous versions, made the `FlexSubThemesData.useInputDecoratorThemeInDialogs` apply also to `DatePickerDialog` and not only to `TimePickerDialog`. This feature is not optimally supported by the framework. The current implementation has severe limitations. See more info in [PR #128950 comment](https://github.com/flutter/flutter/pull/128950#issuecomment-1657177393). For more information about the differences in how `InputDecorationTheme` behaves in different component themes, read the proposal **"Make InputDecorationTheme usage in components consistent"** in [issue #131666](https://github.com/flutter/flutter/issues/131666).

**CHANGE**

Expand All @@ -39,7 +40,7 @@ All changes to the **FlexColorScheme** (FCS) package are documented here.

**FIX**

* Fixed the `FlexSubThemes.checkboxTheme` that broke due to an unexpected breaking change in Flutter caused by PR [#125643](https://github.com/flutter/flutter/pull/125643). The breaking change is discussed further in [issue #130295](https://github.com/flutter/flutter/issues/130295). The fix to the checkbox theme incorporates the new behavior to keep its custom styling working as before and expected.
* Fixed the `FlexSubThemes.checkboxTheme` that broke due to an unexpected breaking change in Flutter 3.13 caused by PR [#125643](https://github.com/flutter/flutter/pull/125643). The breaking change is discussed further in [issue #130295](https://github.com/flutter/flutter/issues/130295). The fix to the checkbox theme incorporates the new behavior to keep its custom styling working as before and expected.

* Fixed `useInputDecoratorThemeInDialogs` not working for some properties in the `InputDecorator`, when the value was null or `false`, where some properties in the `TextField`s in the `TimePickerDialog` did not revert back to default styles. Now they do, but via hard defined values to mimic the default M3 style, as that is the only way to get back to it when a very custom `themeData.inputDecoratorTheme` is being used.

Expand All @@ -63,11 +64,7 @@ All changes to the **FlexColorScheme** (FCS) package are documented here.

* Fixed the old default color info for the toggles Switch, Checkbox and Radio, that are shown when FlexColorScheme is disabled as default values in Material 2 dark mode. They have been updated in Flutter SDK to `ColorScheme.secondary` color and are no longer not the horrid dark mode teal color. This default color info, shown when FlexColorScheme is disabled in the **Themes Playground**, had not been updated for the dark M2 mode Switch, Checkbox and Radio colors.

### TODO

* The `TextStyle`'s added to `FlexSubThemes` also needs to be added to `FlexSubThemesData` to pass any configured text styles to respective sub-themes. They will not be added to **Themes Playground** in current generation. They are intended to with API make it easier to use custom `TextStyles` on these components with using a deep `copyWith` on produced `ThemeData` by **FlexColorScheme**. This will probably be postponed to version 7.4.0, depends on when the next Flutter stable is released.

* Add some basic theming for `ListTileThemeData` and `ProgressIndicatorThemeData`. This will probably be postponed to version 7.4.0, depends on when the next Flutter stable is released.


## 7.2.0
Expand Down
20 changes: 11 additions & 9 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ Use **FlexColorScheme** to make beautiful Flutter Material Design themes. Apply
</tr>
</table>

When you theme a Flutter application correctly, all built-in widgets use the colors of the `ColorScheme` in your theme. At least in theory, and it is almost so if you defined your `ThemeData` by using the `ThemeData.from` factory, but it misses a few details. This applies in particular when you use Material-2 design in Flutter, which is the default. When you opt in on using Material-3, the results are much more consistent by default.
When you theme a Flutter application correctly, all built-in widgets use the colors of the `ColorScheme` in your theme. At least in theory, and it is almost so if you defined your `ThemeData` by using the `ThemeData.from` factory, but it misses a few details. This applies in particular when you use Material-2 design in Flutter, which is the default. When you opt in on using Material-3, the color results and styles are much more consistent by default.

**FlexColorScheme** ensures that all Flutter SDK UI components get themed completely by its color scheme and custom colors you provide. It applies effective `ColorScheme` colors to all color properties in `ThemeData`. This ensures that all the direct colors properties in `ThemeData` match your `ColorScheme`. There are no surprising colors in `ThemeData` legacy colors that do not match your `ColorScheme`. This applies regardless of if you use Material-2 or Material-3 mode.

Expand Down Expand Up @@ -133,23 +133,23 @@ Complete generated package [**API documentation**](https://pub.dev/documentation

## Themes Playground

To make it even easier to configure and setup **FlexColorScheme**, it comes with a WEB companion app called the [**Themes Playground**](https://rydmike.com/flexcolorscheme/themesplayground-v7-2).
To make it even easier to configure and setup **FlexColorScheme**, it comes with a WEB companion app called the [**Themes Playground**](https://rydmike.com/flexcolorscheme/themesplayground-latest).

The **Themes Playground** is a useful tool to find **FlexColorScheme** themes and settings you like. You can use it to discover what you can do with FlexColorScheme. The playground persists all its settings. You can reset settings back to their default values, so you can always start over if you get lost in all the configuration possibilities.

The most useful and popular feature of the **Playground** is that it can generate **FlexColorScheme API** setup code needed to produce the shown active theme configuration. The themed style of the app itself and the same styled demo apps shown in the included theme simulator, is what you get when you copy the code of the current theme configuration to your app, and use it with the **FlexColorScheme** package.

[<img src="https://raw.githubusercontent.com/rydmike/flex_color_scheme_docs/master/docs/images/themes_playground_7_2.png" alt="Themes Playround Image"/>](https://rydmike.com/flexcolorscheme/themesplayground-v7-2)
[<img src="https://raw.githubusercontent.com/rydmike/flex_color_scheme_docs/master/docs/images/themes_playground_7_2.png" alt="Themes Playround Image"/>](https://rydmike.com/flexcolorscheme/themesplayground-latest)

*In [Themes Playground](https://rydmike.com/flexcolorscheme/themesplayground-v7-2) you can visually configure your theme and copy its setup code.*
*In [Themes Playground](https://rydmike.com/flexcolorscheme/themesplayground-latest) you can visually configure your theme and copy its setup code.*

If you use the code view panel side-by-side, as you change settings, the Playground modifies the code as you change settings. This is a fun way to get familiar with the API.

[<img src="https://raw.githubusercontent.com/rydmike/flex_color_scheme_docs/master/docs/images/themes_playground_7_2_dark_code.png" alt="Themes Playround Image"/>](https://rydmike.com/flexcolorscheme/themesplayground-v7-2)
[<img src="https://raw.githubusercontent.com/rydmike/flex_color_scheme_docs/master/docs/images/themes_playground_7_2_dark_code.png" alt="Themes Playround Image"/>](https://rydmike.com/flexcolorscheme/themesplayground-latest)

*Viewing API configuration and its updates as you change setting in [Themes Playground](https://rydmike.com/flexcolorscheme/themesplayground-v7-2).*
*Viewing API configuration and its updates as you change setting in [Themes Playground](https://rydmike.com/flexcolorscheme/themesplayground-latest).*

The latest **Themes Playground v7.2** build can be used as a [web app here](https://rydmike.com/flexcolorscheme/themesplayground-v7-2). For guidance on how to use the Themes Playground, please read the [Themes Playground chapter](https://docs.flexcolorscheme.com/playground) available in the documentation site.
The latest **Themes Playground** build can be used as a [web app here](https://rydmike.com/flexcolorscheme/themesplayground-latest). For guidance on how to use the Themes Playground, please read the [Themes Playground chapter](https://docs.flexcolorscheme.com/playground) available in the documentation site.

Beware, fiddling with all the different themes and settings can be quite fun and addictive, happy theming! 💙

Expand All @@ -162,9 +162,11 @@ The Playground app is also the last step in the package tutorial series. The [tu

### Older versions of the Themes Playground

If you are using **FlexColorScheme version 7.1**, you can go here to use [**Themes Playground V7.1**](https://rydmike.com/flexcolorscheme/themesplayground-v7) and generate API setup code for version 7.1. Prefer updating to version 7.2.
If you are using **FlexColorScheme version 7.2**, you can go here to use [**Themes Playground V7.2**](https://rydmike.com/flexcolorscheme/themesplayground-v7-2) and generate API setup code for version 7.2. Prefer updating to version 7.3 if you can use Flutter 3.13.

If you are using **FlexColorScheme version 7.0**, you can go here to use [**Themes Playground V7.0**](https://rydmike.com/flexcolorscheme/themesplayground-v7) and generate API setup code for version 7.0. Prefer updating to version 7.2.
If you are using **FlexColorScheme version 7.1**, you can go here to use [**Themes Playground V7.1**](https://rydmike.com/flexcolorscheme/themesplayground-v7-1) and generate API setup code for version 7.1. Prefer updating to version 7.3 if you can use Flutter 3.13.

If you are using **FlexColorScheme version 7.0**, you can go here to use [**Themes Playground V7.0**](https://rydmike.com/flexcolorscheme/themesplayground-v7) and generate API setup code for version 7.0. Prefer updating to version 7.3 if you can use Flutter 3.13.

If you are using **FlexColorScheme version 6**, you can go here to use [**Themes Playground V6**](https://rydmike.com/flexcolorscheme/themesplayground-v6) and generate API setup code for version 6. It supports FlexColorScheme version 6.1, you can also use this version of the Playground with FlexColorScheme version 6.0. If you do, you may have to delete some generated API config setup code for properties only available in version 6.1 that are not supported by FlexColorScheme 6.0. You will see those as unsupported API errors when you copy/paste the Themes Playground code to Flutter if you use 6.0 and not 6.1. Delete such rows, or you can of course upgrade the package to 6.1 to get those features, or even better move up to the latest version.

Expand Down
2 changes: 1 addition & 1 deletion example/lib/example1_basic_theme_usage/main.dart
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ class _DemoAppState extends State<DemoApp> {
// Used to select if we use the dark or light theme, start with system mode.
ThemeMode themeMode = ThemeMode.system;
// Opt in/out on Material 3
bool useMaterial3 = false;
bool useMaterial3 = true;

@override
Widget build(BuildContext context) {
Expand Down
2 changes: 1 addition & 1 deletion example/lib/shared/const/app.dart
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@ class App {
static const String packageVersion =
'$versionMajor.$versionMinor.$versionPatch';
static const String packageVersionMinor = '$versionMajor.$versionMinor.x';
static const String flutterVersion = 'stable 3.10.6 (canvaskit)';
static const String flutterVersion = 'stable 3.13.0 (canvaskit)';
static const String copyright = '© 2020 - 2023';
static const String author = 'Mike Rydstrom';
static const String license = 'BSD 3-Clause License';
Expand Down
Loading

0 comments on commit c5006b4

Please sign in to comment.