#158 new: follow system color

lib/view/page/setting/entry.dart

@@ -10,16 +10,14 @@ import 'package:toolbox/core/extension/colorx.dart';
 import 'package:toolbox/core/extension/locale.dart';
 import 'package:toolbox/core/extension/context.dart';
 import 'package:toolbox/core/extension/stringx.dart';
-import 'package:toolbox/core/persistant_store.dart';
-import 'package:toolbox/core/route.dart';
-import 'package:toolbox/data/model/app/net_view.dart';
-import 'package:toolbox/view/widget/input_field.dart';
-import 'package:toolbox/view/widget/value_notifier.dart';
 
+import '../../../core/persistant_store.dart';
+import '../../../core/route.dart';
 import '../../../core/utils/misc.dart';
 import '../../../core/utils/platform.dart';
 import '../../../core/update.dart';
 import '../../../core/utils/ui.dart';
+import '../../../data/model/app/net_view.dart';
 import '../../../data/provider/app.dart';
 import '../../../data/provider/server.dart';
 import '../../../data/res/build_data.dart';
@@ -29,9 +27,12 @@ import '../../../data/res/ui.dart';
 import '../../../data/store/server.dart';
 import '../../../data/store/setting.dart';
 import '../../../locator.dart';
+import '../../widget/color_picker.dart';
 import '../../widget/custom_appbar.dart';
 import '../../widget/future_widget.dart';
+import '../../widget/input_field.dart';
 import '../../widget/round_rect_card.dart';
+import '../../widget/value_notifier.dart';
 
 class SettingPage extends StatefulWidget {
   const SettingPage({Key? key}) : super(key: key);
@@ -313,16 +314,45 @@ class _SettingPageState extends State<SettingPage> {
       onTap: () async {
         final ctrl = TextEditingController(text: primaryColor.toHex);
         await showRoundDialog(
-          context: context,
-          title: Text(_s.primaryColorSeed),
-          child: Input(
-            autoFocus: true,
-            onSubmitted: _onSaveColor,
-            controller: ctrl,
-            hint: '#8b2252',
-            icon: Icons.colorize,
-          ),
-        );
+            context: context,
+            title: Text(_s.primaryColorSeed),
+            child: StatefulBuilder(builder: (context, setState) {
+              final children = <Widget>[
+                /// Plugin [dynamic_color] is not supported on iOS
+                if (!isIOS) ListTile(
+                  title: Text(_s.followSystem),
+                  trailing: buildSwitch(
+                    context,
+                    _setting.useSystemPrimaryColor,
+                    func: (_) => setState(() {}),
+                  ),
+                )
+              ];
+              if (!_setting.useSystemPrimaryColor.fetch()) {
+                children.addAll([
+                  Input(
+                    onSubmitted: _onSaveColor,
+                    controller: ctrl,
+                    hint: '#8b2252',
+                    icon: Icons.colorize,
+                  ),
+                  ColorPicker(
+                    color: primaryColor,
+                    onColorChanged: (c) => ctrl.text = c.toHex,
+                  )
+                ]);
+              }
+              return Column(
+                mainAxisSize: MainAxisSize.min,
+                children: children,
+              );
+            }),
+            actions: [
+              TextButton(
+                onPressed: () => _onSaveColor(ctrl.text),
+                child: Text(_s.ok),
+              ),
+            ]);
       },
     );
   }

lib/view/widget/color_picker.dart

@@ -0,0 +1,77 @@
+import 'package:flutter/material.dart';
+
+enum _ColorPropType {
+  r,
+  g,
+  b,
+}
+
+class ColorPicker extends StatefulWidget {
+  final Color color;
+  final ValueChanged<Color> onColorChanged;
+
+  const ColorPicker({
+    super.key,
+    required this.color,
+    required this.onColorChanged,
+  });
+
+  @override
+  _ColorPickerState createState() => _ColorPickerState();
+}
+
+class _ColorPickerState extends State<ColorPicker> {
+  late int _r = widget.color.red;
+  late int _g = widget.color.green;
+  late int _b = widget.color.blue;
+
+  @override
+  Widget build(BuildContext context) {
+    return Column(
+      children: [
+        _buildProgress(_ColorPropType.r, 'R', _r.toDouble()),
+        _buildProgress(_ColorPropType.g, 'G', _g.toDouble()),
+        _buildProgress(_ColorPropType.b, 'B', _b.toDouble()),
+      ],
+    );
+  }
+
+  Widget _buildProgress(_ColorPropType type, String title, double value) {
+    return Row(
+      children: [
+        Text(
+          title,
+          style: const TextStyle(
+            fontSize: 16,
+            fontWeight: FontWeight.bold,
+          ),
+        ),
+        Expanded(
+          child: Slider(
+            value: value,
+            onChanged: (v) {
+              setState(() {
+                switch (type) {
+                  case _ColorPropType.r:
+                    _r = v.toInt();
+                    break;
+                  case _ColorPropType.g:
+                    _g = v.toInt();
+                    break;
+                  case _ColorPropType.b:
+                    _b = v.toInt();
+                    break;
+                }
+              });
+              widget.onColorChanged(Color.fromARGB(255, _r, _g, _b));
+            },
+            min: 0,
+            max: 255,
+            divisions: 255,
+            label: value.toInt().toString(),
+          ),
+        ),
+      ],
+    );
+  }
+}