settings: Add more color settings

2021-07-19 00:00:33 +08:00 · 2021-07-19 00:00:33 +08:00 · f3df6a1649
parent 6b6b2f74ce
commit f3df6a1649
5 changed files with 118 additions and 26 deletions
--- a/src/ui/flutter_app/lib/common/config.dart
+++ b/src/ui/flutter_app/lib/common/config.dart
@ -56,7 +56,7 @@ class Config {
  static double boardInnerLineWidth = 2.0;
  static double pieceWidth = 0.9;
  static double fontSize = 16.0;
-  static double boardTop = isLargeScreen()? 75.0 : 36.0;
+  static double boardTop = isLargeScreen() ? 75.0 : 36.0;
  static double animationDuration = 0.0;

  // Color
@ -69,6 +69,14 @@ class Config {
  static int drawerColor = AppTheme.drawerColor.value;
  static int drawerBackgroundColor = AppTheme.drawerBackgroundColor.value;
  static int drawerTextColor = AppTheme.drawerTextColor.value;
+  static int drawerHighlightItemColor = AppTheme.drawerHighlightItemColor.value;
+  static int mainToolbarBackgroundColor =
+      AppTheme.mainToolbarBackgroundColor.value;
+  static int mainToolbarIconColor = AppTheme.mainToolbarIconColor.value;
+  static int navigationToolbarBackgroundColor =
+      AppTheme.navigationToolbarBackgroundColor.value;
+  static int navigationToolbarIconColor =
+      AppTheme.navigationToolbarIconColor.value;

  // Rules
  static int piecesCount = specialCountryAndRegion == "Iran" ? 12 : 9;
@ -126,7 +134,7 @@ class Config {
    Config.boardInnerLineWidth = settings['BoardInnerLineWidth'] ?? 2;
    Config.pieceWidth = settings['PieceWidth'] ?? 0.9;
    Config.fontSize = settings['FontSize'] ?? 16.0;
-    Config.boardTop = settings['BoardTop'] ?? (isLargeScreen()? 75 :36);
+    Config.boardTop = settings['BoardTop'] ?? (isLargeScreen() ? 75 : 36);
    Config.animationDuration = settings['AnimationDuration'] ?? 0;

    // Color
@ -147,6 +155,19 @@ class Config {
        AppTheme.drawerBackgroundColor.value;
    Config.drawerTextColor =
        settings['DrawerTextColor'] ?? AppTheme.drawerTextColor.value;
+    Config.drawerHighlightItemColor = settings['DrawerHighlightItemColor'] ??
+        AppTheme.drawerHighlightItemColor.value;
+    Config.mainToolbarBackgroundColor =
+        settings['MainToolbarBackgroundColor'] ??
+            AppTheme.mainToolbarBackgroundColor.value;
+    Config.mainToolbarIconColor =
+        settings['MainToolbarIconColor'] ?? AppTheme.mainToolbarIconColor.value;
+    Config.navigationToolbarBackgroundColor =
+        settings['NavigationToolbarBackgroundColor'] ??
+            AppTheme.navigationToolbarBackgroundColor.value;
+    Config.navigationToolbarIconColor =
+        settings['NavigationToolbarIconColor'] ??
+            AppTheme.navigationToolbarIconColor.value;

    // Rules
    rule.piecesCount = Config.piecesCount =
@ -227,6 +248,12 @@ class Config {
    settings['DrawerColor'] = Config.drawerColor;
    settings['DrawerBackgroundColor'] = Config.drawerBackgroundColor;
    settings['DrawerTextColor'] = Config.drawerTextColor;
+    settings['DrawerHighlightItemColor'] = Config.drawerHighlightItemColor;
+    settings['MainToolbarBackgroundColor'] = Config.mainToolbarBackgroundColor;
+    settings['MainToolbarIconColor'] = Config.mainToolbarIconColor;
+    settings['NavigationToolbarBackgroundColor'] =
+        Config.navigationToolbarBackgroundColor;
+    settings['NavigationToolbarIconColor'] = Config.navigationToolbarIconColor;

    // Rules
    settings['PiecesCount'] = Config.piecesCount;
--- a/src/ui/flutter_app/lib/style/app_theme.dart
+++ b/src/ui/flutter_app/lib/style/app_theme.dart
@ -14,6 +14,8 @@ class AppTheme {
  /// Game page
  static var gamePageHeaderIconColor = Colors.white;
  static var boardBackgroundColor = UIColors.burlyWood;
+  static var mainToolbarBackgroundColor = UIColors.burlyWood;
+  static var navigationToolbarBackgroundColor = UIColors.burlyWood;
  static var boardLineColor = Color(0x996D000D);
  static var blackPieceColor = Color.fromARGB(0xFF, 0x00, 0x00, 0x00);
  static var blackPieceBorderColor = Color.fromARGB(0xFF, 0x22, 0x22, 0x22);
@ -22,8 +24,9 @@ class AppTheme {
  static var messageColor = Colors.white;
  static var banColor = Color.fromARGB(0xFF, 0xFF, 0x00, 0x00); // unused
  static var banBorderColor = Color.fromARGB(0x80, 0xFF, 0x00, 0x00); // unused
-  static var toolbarIconColor = listTileSubtitleColor;
-  static var toolbarTextColor = toolbarIconColor;
+  static var mainToolbarIconColor = listTileSubtitleColor;
+  static var navigationToolbarIconColor = listTileSubtitleColor;
+  static var toolbarTextColor = mainToolbarIconColor;
  static var moveHistoryTextColor = Colors.yellow;
  static var moveHistoryDialogBackgroundColor = Colors.transparent;
  static var infoDialogBackgroundColor = moveHistoryDialogBackgroundColor;
@ -106,7 +109,7 @@ class AppTheme {
      height: 1.5,
      color: moveHistoryTextColor);

-  static double boardTop = isLargeScreen()? 75.0 : 36.0;
+  static double boardTop = isLargeScreen() ? 75.0 : 36.0;
  static double boardMargin = 10.0;
  static double boardScreenPaddingH = 10.0;
  static double boardBorderRadius = 5.0;
--- a/src/ui/flutter_app/lib/widgets/game_page.dart
+++ b/src/ui/flutter_app/lib/widgets/game_page.dart
@ -1430,10 +1430,10 @@ class _GamePageState extends State<GamePage>
        children: <Widget>[
          Icon(
            FluentIcons.board_24_regular,
-            color: AppTheme.toolbarIconColor,
+            color: Color(Config.mainToolbarIconColor),
          ),
          Text(S.of(context).game,
-              style: TextStyle(color: AppTheme.toolbarTextColor)),
+              style: TextStyle(color: Color(Config.mainToolbarIconColor))),
        ],
      ),
      onPressed: onGameButtonPressed,
@ -1445,10 +1445,10 @@ class _GamePageState extends State<GamePage>
        children: <Widget>[
          Icon(
            FluentIcons.settings_24_regular,
-            color: AppTheme.toolbarIconColor,
+            color: Color(Config.mainToolbarIconColor),
          ),
          Text(S.of(context).options,
-              style: TextStyle(color: AppTheme.toolbarTextColor)),
+              style: TextStyle(color: Color(Config.mainToolbarIconColor))),
        ],
      ),
      onPressed: onOptionButtonPressed,
@ -1460,10 +1460,10 @@ class _GamePageState extends State<GamePage>
        children: <Widget>[
          Icon(
            FluentIcons.calendar_agenda_24_regular,
-            color: AppTheme.toolbarIconColor,
+            color: Color(Config.mainToolbarIconColor),
          ),
          Text(S.of(context).move,
-              style: TextStyle(color: AppTheme.toolbarTextColor)),
+              style: TextStyle(color: Color(Config.mainToolbarIconColor))),
        ],
      ),
      onPressed: onMoveButtonPressed,
@ -1475,10 +1475,10 @@ class _GamePageState extends State<GamePage>
        children: <Widget>[
          Icon(
            FluentIcons.lightbulb_24_regular,
-            color: AppTheme.toolbarIconColor,
+            color: Color(Config.mainToolbarIconColor),
          ),
          Text(S.of(context).info,
-              style: TextStyle(color: AppTheme.toolbarTextColor)),
+              style: TextStyle(color: Color(Config.mainToolbarIconColor))),
        ],
      ),
      onPressed: onInfoButtonPressed,
@ -1487,7 +1487,7 @@ class _GamePageState extends State<GamePage>
    return Container(
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(5),
-        color: Color(Config.boardBackgroundColor),
+        color: Color(Config.mainToolbarBackgroundColor),
      ),
      margin: EdgeInsets.symmetric(horizontal: GamePage.screenPaddingH),
      padding: EdgeInsets.symmetric(vertical: 2),
@ -1514,7 +1514,7 @@ class _GamePageState extends State<GamePage>
            ltr
                ? FluentIcons.arrow_previous_24_regular
                : FluentIcons.arrow_next_24_regular,
-            color: AppTheme.toolbarIconColor,
+            color: Color(Config.navigationToolbarIconColor),
          ),
        ],
      ),
@ -1527,7 +1527,7 @@ class _GamePageState extends State<GamePage>
        children: <Widget>[
          Icon(
            FluentIcons.chevron_left_24_regular,
-            color: AppTheme.toolbarIconColor,
+            color: Color(Config.navigationToolbarIconColor),
          ),
        ],
      ),
@ -1540,7 +1540,7 @@ class _GamePageState extends State<GamePage>
        children: <Widget>[
          Icon(
            FluentIcons.chevron_right_24_regular,
-            color: AppTheme.toolbarIconColor,
+            color: Color(Config.navigationToolbarIconColor),
          ),
        ],
      ),
@ -1555,7 +1555,7 @@ class _GamePageState extends State<GamePage>
            ltr
                ? FluentIcons.arrow_next_24_regular
                : FluentIcons.arrow_previous_24_regular,
-            color: AppTheme.toolbarIconColor,
+            color: Color(Config.navigationToolbarIconColor),
          ),
        ],
      ),
@ -1565,7 +1565,7 @@ class _GamePageState extends State<GamePage>
    return Container(
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(5),
-        color: Color(Config.boardBackgroundColor),
+        color: Color(Config.navigationToolbarBackgroundColor),
      ),
      margin: EdgeInsets.symmetric(horizontal: GamePage.screenPaddingH),
      padding: EdgeInsets.symmetric(vertical: 2),
--- a/src/ui/flutter_app/lib/widgets/home_drawer.dart
+++ b/src/ui/flutter_app/lib/widgets/home_drawer.dart
@ -278,7 +278,7 @@ class _HomeDrawerState extends State<HomeDrawer> {
              width: MediaQuery.of(context).size.width * 0.75 - 64,
              height: 46,
              decoration: BoxDecoration(
-                color: AppTheme.drawerHighlightItemColor,
+                color: Color(Config.drawerHighlightItemColor),
                borderRadius: new BorderRadius.only(
                  topLeft: Radius.circular(ltr ? 0 : radius),
                  topRight: Radius.circular(ltr ? radius : 0),
--- a/src/ui/flutter_app/lib/widgets/personalization_settings_page.dart
+++ b/src/ui/flutter_app/lib/widgets/personalization_settings_page.dart
@ -62,6 +62,14 @@ class _PersonalizationSettingsPageState
      S.of(context).drawerColor: Config.drawerColor,
      S.of(context).drawerBackgroundColor: Config.drawerBackgroundColor,
      S.of(context).drawerTextColor: Config.drawerTextColor,
+      S.of(context).drawerHighlightItemColor: Config.drawerHighlightItemColor,
+      S.of(context).mainToolbarBackgroundColor:
+          Config.mainToolbarBackgroundColor,
+      S.of(context).mainToolbarIconColor: Config.mainToolbarIconColor,
+      S.of(context).navigationToolbarBackgroundColor:
+          Config.navigationToolbarBackgroundColor,
+      S.of(context).navigationToolbarIconColor:
+          Config.navigationToolbarIconColor,
    };

    AlertDialog alert = AlertDialog(
@ -109,6 +117,19 @@ class _PersonalizationSettingsPageState
              Config.drawerBackgroundColor = pickerColor.value;
            } else if (colorString == S.of(context).drawerTextColor) {
              Config.drawerTextColor = pickerColor.value;
+            } else if (colorString == S.of(context).drawerHighlightItemColor) {
+              Config.drawerHighlightItemColor = pickerColor.value;
+            } else if (colorString ==
+                S.of(context).mainToolbarBackgroundColor) {
+              Config.mainToolbarBackgroundColor = pickerColor.value;
+            } else if (colorString == S.of(context).mainToolbarIconColor) {
+              Config.mainToolbarIconColor = pickerColor.value;
+            } else if (colorString ==
+                S.of(context).navigationToolbarBackgroundColor) {
+              Config.navigationToolbarBackgroundColor = pickerColor.value;
+            } else if (colorString ==
+                S.of(context).navigationToolbarIconColor) {
+              Config.navigationToolbarIconColor = pickerColor.value;
            }

            Config.save();
@ -390,13 +411,15 @@ class _PersonalizationSettingsPageState
          ListItemDivider(),
          Constants.windowAspectRatio > 1.7
              ? SettingsSwitchListTile(
-            context: context,
-            value: Config.isHistoryNavigationToolbarShown,
-            onChanged: setIsHistoryNavigationToolbarShown,
-            titleString: S.of(context).isHistoryNavigationToolbarShown,
-          ) : SizedBox(height: 1),
+                  context: context,
+                  value: Config.isHistoryNavigationToolbarShown,
+                  onChanged: setIsHistoryNavigationToolbarShown,
+                  titleString: S.of(context).isHistoryNavigationToolbarShown,
+                )
+              : SizedBox(height: 1),
          Constants.windowAspectRatio > 1.7
-              ? ListItemDivider(): SizedBox(height: 1),
+              ? ListItemDivider()
+              : SizedBox(height: 1),
          SettingsListTile(
              context: context,
              titleString: S.of(context).boardBorderLineWidth,
@ -507,6 +530,45 @@ class _PersonalizationSettingsPageState
            trailingColor: Config.drawerTextColor,
            onTap: () => showColorDialog(S.of(context).drawerTextColor),
          ),
+          ListItemDivider(),
+          SettingsListTile(
+            context: context,
+            titleString: S.of(context).drawerHighlightItemColor,
+            trailingColor: Config.drawerHighlightItemColor,
+            onTap: () =>
+                showColorDialog(S.of(context).drawerHighlightItemColor),
+          ),
+          ListItemDivider(),
+          SettingsListTile(
+            context: context,
+            titleString: S.of(context).mainToolbarBackgroundColor,
+            trailingColor: Config.mainToolbarBackgroundColor,
+            onTap: () =>
+                showColorDialog(S.of(context).mainToolbarBackgroundColor),
+          ),
+          ListItemDivider(),
+          SettingsListTile(
+            context: context,
+            titleString: S.of(context).mainToolbarIconColor,
+            trailingColor: Config.mainToolbarIconColor,
+            onTap: () => showColorDialog(S.of(context).mainToolbarIconColor),
+          ),
+          ListItemDivider(),
+          SettingsListTile(
+            context: context,
+            titleString: S.of(context).navigationToolbarBackgroundColor,
+            trailingColor: Config.navigationToolbarBackgroundColor,
+            onTap: () =>
+                showColorDialog(S.of(context).navigationToolbarBackgroundColor),
+          ),
+          ListItemDivider(),
+          SettingsListTile(
+            context: context,
+            titleString: S.of(context).navigationToolbarIconColor,
+            trailingColor: Config.navigationToolbarIconColor,
+            onTap: () =>
+                showColorDialog(S.of(context).navigationToolbarIconColor),
+          ),
        ],
      ),
    ];