跳至主要內容
目錄

ThemeData 的 toggleableActiveColor 屬性已棄用

目錄

摘要

#

Material 小部件 Switch、SwitchListTile、Checkbox、CheckboxListTile、Radio、RadioListTile 現在使用 ColorScheme.secondary 顏色作為其可切換的小部件。ThemeData.toggleableActiveColor 已棄用，最終將被移除。

背景

#

將依賴 ThemeData.toggleableActiveColor 的小部件遷移到 ColorScheme.secondary 導致 toggleableActiveColor 屬性變得不必要。根據 Flutter 的棄用政策，此屬性最終將被移除。

變更描述

#

使用 ThemeData.toggleableActiveColor 顏色作為活動/選定狀態的小部件現在使用 ColorScheme.secondary。

遷移指南

#

可切換小部件的活動/選定顏色通常可以通過 3 種方式自訂

  1. 使用 ThemeData 的 ColorScheme.secondary。
  2. 使用元件主題 SwitchThemeData、ListTileThemeData、CheckboxThemeData 和 RadioThemeData。
  3. 通過自訂小部件的顏色屬性。

遷移前的程式碼

dart
MaterialApp(
  theme: ThemeData(toggleableActiveColor: myColor),
  // ...
);

遷移後的程式碼

dart
final ThemeData theme = ThemeData();
MaterialApp(
  theme: theme.copyWith(
    switchTheme: SwitchThemeData(
      thumbColor: MaterialStateProperty.resolveWith<Color?>(
          (Set<MaterialState> states) {
        if (states.contains(MaterialState.disabled)) {
          return null;
        }
        if (states.contains(MaterialState.selected)) {
          return myColor;
        }
        return null;
      }),
      trackColor: MaterialStateProperty.resolveWith<Color?>(
          (Set<MaterialState> states) {
        if (states.contains(MaterialState.disabled)) {
          return null;
        }
        if (states.contains(MaterialState.selected)) {
          return myColor;
        }
        return null;
      }),
    ),
    radioTheme: RadioThemeData(
      fillColor: MaterialStateProperty.resolveWith<Color?>(
          (Set<MaterialState> states) {
        if (states.contains(MaterialState.disabled)) {
          return null;
        }
        if (states.contains(MaterialState.selected)) {
          return myColor;
        }
        return null;
      }),
    ),
    checkboxTheme: CheckboxThemeData(
      fillColor: MaterialStateProperty.resolveWith<Color?>(
          (Set<MaterialState> states) {
        if (states.contains(MaterialState.disabled)) {
          return null;
        }
        if (states.contains(MaterialState.selected)) {
          return myColor;
        }
        return null;
      }),
    ),
  ),
  //...
)

時間軸

#

在穩定版本中：3.7

參考資料

#

API 文件

相關問題

相關 PR

除非另有說明，否則此網站上的文件反映了 Flutter 的最新穩定版本。頁面最後更新於 2024-04-04。 檢視原始碼 或 回報問題。