跳到主內容

概述

#

用於控制 Material Widget 中選中文字外觀的 ThemeData 屬性已移至其自身的 TextSelectionTheme 中。這些屬性包括 cursorColor、textSelectionColor 和 textSelectionHandleColor。這些屬性的預設值也已更改，以匹配 Material Design 規範。

背景

#

作為更大範圍的 Material 主題更新 的一部分，我們引入了一個新的 Text Selection Theme，用於指定 TextField 和 SelectableText Widget 中選中文字的屬性。這些屬性取代了 ThemeData 的幾個頂級屬性，並更新了它們的預設值以匹配 Material Design 規範。本文件描述了應用程式如何遷移到此新 API。

遷移指南

#

如果您當前正在使用 ThemeData 的以下屬性，則需要更新它們以使用 ThemeData.textSelectionTheme 上的新等效屬性。

之前之後
ThemeData.cursorColorTextSelectionThemeData.cursorColor
ThemeData.textSelectionColorTextSelectionThemeData.selectionColor
ThemeData.textSelectionHandleColorTextSelectionThemeData.selectionHandleColor

遷移前的程式碼

dart
ThemeData(
  cursorColor: Colors.red,
  textSelectionColor: Colors.green,
  textSelectionHandleColor: Colors.blue,
)

遷移後的程式碼

dart
ThemeData(
  textSelectionTheme: TextSelectionThemeData(
    cursorColor: Colors.red,
    selectionColor: Colors.green,
    selectionHandleColor: Colors.blue,
  )
)

預設值更改

如果您沒有明確使用這些屬性，而是依賴於之前用於文字選擇的預設顏色，則可以為您的應用程式向 ThemeData 新增一個新欄位，以恢復到舊的預設值，如下所示。

dart
// Old defaults for a light theme
ThemeData(
  textSelectionTheme: TextSelectionThemeData(
    cursorColor: const Color.fromRGBO(66, 133, 244, 1.0),
    selectionColor: const Color(0xff90caf9),
    selectionHandleColor: const Color(0xff64b5f6),
  )
)
dart
// Old defaults for a dark theme
ThemeData(
  textSelectionTheme: TextSelectionThemeData(
    cursorColor: const Color.fromRGBO(66, 133, 244, 1.0),
    selectionColor: const Color(0xff64ffda),
    selectionHandleColor: const Color(0xff1de9b6),
  )
)

如果您對新的預設值感到滿意，但黃金檔案測試失敗，您可以使用以下命令更新您的主黃金檔案。

flutter test --update-goldens

時間線

#

已於版本：1.23.0-4.0.pre 登入
穩定版本：2.0.0

參考資料

#

API 文件

相關 PR

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