ThemeData のアクセントプロパティは非推奨になりました

コンテンツ

まとめ

テーマデータアクセントの色、アクセントの色明るさ、アクセントアイコンテーマとアクセントテキストテーマプロパティは非推奨になりました。

のマテリアルデザイン仕様「アクセント」を指定または使用しなくなりましたマテリアルコンポーネントの色。コンポーネントのデフォルト値色は全体的なテーマから派生します。カラースキーム。のColorSchemeの二次色現在では通常、代わりに使用されますaccentColorそしてそのon2次色対照的な場合に使用されます色が必要です。

コンテクスト

これはほんの一部でしたが、マテリアルテーマシステムアップデート計画。

Flutter 1.17 以降、ThemeData のアクセントプロパティ - AccentColor、 AccentColorBrightness、accentIconTheme、accentTextTheme - はありませんでしたマテリアルライブラリで使用されるようになりました。彼らに取って代わられたのは、テーマへの依存性colorSchemeとtextTheme長期目標の一環としての特性材料コンポーネントのデフォルト設定を依存させるほぼこれら 2 つのプロパティのみを対象としています。

これらの変更の動機は、テーマシステムをより簡単にすることです。理解して使用してください。すべてのコンポーネントのデフォルトの色は次のとおりです。コンポーネント自体によって定義され、色に基づいて定義されます。図式。特定のコンポーネントタイプのデフォルトをオーバーライドできます次のようなコンポーネント固有のテーマFloatingActionButtonThemeDataまたCheckBoxTheme。以前は、acccessColor のようなプロパティは、コンポーネントの種類が少数で、一部の状況でのみ発生するため、それらをオーバーライドすることの影響を理解するのは困難です。

変更内容の説明

ThemeData のアクセントカラー、アクセントカラーの明るさ、アクセントアイコンのテーマ、 AccentTextTheme プロパティは非推奨になりました。図書館はもうそれらを使用しません。

移行ガイド

アプリケーションテーマ

ThemeData値でアクセントカラーを指定する必要がなくなりました。 AccentColorBrightness、accentIconTheme、またはaccentTextTheme。

マテリアルコンポーネントの外観を設定するには、先ほどと同様に、配色の二次色を指定しますアクセントカラーの代わりに。

移行前のコード:

MaterialApp(
  theme: ThemeData(accentColor: myColor),
  // ...
);

移行後のコード:

final ThemeData theme = ThemeData();
MaterialApp(
  theme: theme.copyWith(
    colorScheme: theme.colorScheme.copyWith(secondary: myColor),
  ),
  //...
)

`accentColor`

最も近い下位互換性ColorScheme色はColorScheme.secondary。最新の素材に最も近づけるために設計ガイドラインでは、代わりに ColorScheme.primary を置き換えることができます。対照的な色が必要な場合は、使用しますColorScheme.onSecondary。

テーマの AccentColor を検索するために使用されていたカスタムコンポーネントは、検索できるようになります。のColorScheme.secondaryその代わり。

移行前のコード:

Color myColor = Theme.of(context).accentColor;

移行後のコード:

Color myColor = Theme.of(context).colorScheme.secondary;

`accentColorBrightness`

静電気ThemeData.estimateBrightnessForColor()方法を使用できます任意の色の明るさを計算します。

`accentTextTheme`

これは白でしたTextStyle暗いテーマの場合は黒ライトテーマ用の TextStyles。ほとんどの場合、textTheme を使用できますその代わり。一般的な慣用句は、次の 1 つの TextStyle を参照することでした。テキストスタイルの色のコントラストが保証されているため、accentTextTheme アクセントカラーとの相性もいいです（今ColorScheme.secondaryColor）。同じ結果を得るには、テキストスタイルの色を次のように指定します。ColorScheme.onSecondary:

移行前のコード:

TextStyle style = Theme.of(context).accentTextTheme.headline1;

移行後のコード:

final ThemeData theme = Theme.of(context);
TextStyle style = theme.textTheme.headline1.copyWith(
  color: theme.colorScheme.onSecondary,
)

`accentIconTheme`

このプロパティは、アイコンの色を構成するためにのみ使用されていました。以内FloatingActionButton。アイコンの設定が可能になりました直接またはFloatingActionButtonThemeData。見るFloatingActionButton と ThemeData のアクセントプロパティ。

タイムライン

リリースされたバージョン: 2.3.0-0.1.pre
安定版リリース: 2.5

参考文献

API ドキュメント:

ColorScheme
FloatingActionButton
FloatingActionButtonThemeData
TextStyle
TextTheme
Theme
ThemeData