Flutter學習- theme

 Flutter Theme是在Flutter應用程序中用於定義元件外觀和行為的外觀和行為配置屬性。它可以通過配置顏色，字體，尺寸，間距等屬性來定義應用程序的外觀。

教學影片:https://www.bilibili.com/video/BV1B44y1m7Dc/?spm_id_from=333.788.recommend_more_video.5&vd_source=fa9081c24751e12d42048a4d68c83d90

以下為theme可以設定的部分屬性，引用自 https://www.jianshu.com/p/d1d54576a016 ，補上一些未完成的部分，並將註解繁體中文

Brightness? brightness, // 應用整體主題的亮度，用於按鈕之類的小部件，已確定在使用主色或強調色時選擇什麼顏色。
VisualDensity? visualDensity, // 視覺密度
MaterialColor? primarySwatch, // 主題樣式，設置primaryColor後該背景色會被覆蓋,primarySwatch是Flutter中的一個顏色屬性，它可以用於指定一系列顏色，可以用於建立應用程式的主題。它可以包含多個顏色，如棕色、藍色、綠色、紅色等。
Color? primaryColor, // 主要部分背景顏色（導航欄和tabBar等）
Brightness? primaryColorBrightness, // primaryColor的亮度
Color? primaryColorLight, // primaryColor的淺色版
Color? primaryColorDark, // primaryColor的深色版
Color? accentColor, // 前景色（文本和按鈕等）,用來提高對象的色彩，用於閃爍或提升對象的可見性，通常是按鈕、選項卡或文字之類的對象。
Brightness? accentColorBrightness, //用於指定選擇的色彩的亮度
Color? canvasColor, // MaterialType.canvas畫布的預設顏色
Color? shadowColor, // 陰影顏色
Color? scaffoldBackgroundColor, // scaffold的背景顏色，經典Material應用程式或應用程式內頁面的背景顏色。
Color? bottomAppBarColor, // BottomAppBar的預設顏色。
Color? cardColor, // Card這個組件的顏色
Color? dividerColor, // 分隔線的顏色和popipMenuDivider的顏色，也用於ListTitle之間，DataTable的行之間。
Color? focusColor, // 控件獲得焦点時的顏色，通常是灰色、藍色或綠色。它用於表示控件是当前正在接受輸入的控件。
Color? hoverColor, //用戶滑鼠懸停在上面時，就會出現該顏色，以指示用戶可以點擊它。
Color? highlightColor, // 高亮顏色，選中的潑墨動畫期間使用的突出顯示顏色，或用於指示菜單中的項。
Color? splashColor, //使用者按下對應元件時，對應元件會發出的潮濕效果，即水波紋效果的顏色
InteractiveInkFeatureFactory? splashFactory,
Color? selectedRowColor, // 當使用者按下一個表格元素時，該元素的背景顏色。
Color? unselectedWidgetColor, //沒有選widget時的顏色
Color? disabledColor, // 不可點擊時的顏色
Color? buttonColor, // 按鈕的顏色、
ButtonThemeData? buttonTheme, // 定義按鈕的預設主題
ToggleButtonsThemeData? toggleButtonsTheme, //ToggleButtonsTheme是Flutter中的一個小部件,此為它的預設主題
Color? secondaryHeaderColor, //定義第二層頁面頂部工具欄（AppBar）的背景色
Color? textSelectionHandleColor, //控制文本選擇控件的顏色
Color? backgroundColor, //背景色
Color? dialogBackgroundColor,  //跳窗dialog的背景色
Color? indicatorColor, // 選項卡中選定的選項卡指示器的顏色
Color? hintColor, // 用於提示文本或佔位符文本的顏色，例如在TextField中。
AppBarTheme? appBarTheme, // 導航欄主題
ScrollbarThemeData? scrollbarTheme, // 捲動軸bar的主題

使用範例如下:

  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      //預設布景
      //theme: ThemeData(primarySwatch: Colors.blue,),
      // 黑色布景
      //theme: ThemeData.dark(),
      //白色布景
      //theme: ThemeData.light(),
      //白色布景
      theme: ThemeData(
        colorScheme: ColorScheme.fromSwatch(primarySwatch: Colors.orange),
      ),

      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

其餘參考網頁:https://www.gushiciku.cn/pl/pQnY/zh-tw