Look at all these colors!🌈

2025-08-12 09:58:10 +02:00 · 2024-04-20 18:24:08 +03:00
parent fb206aee84
commit ed732cfad2
7 changed files with 152 additions and 37 deletions
--- a/assets/translations/en.json
+++ b/assets/translations/en.json
@@ -22,6 +22,9 @@
    "requiredInBrackets": "(Required)",
    "dropdownNoOptsError": "ERROR: DROPDOWN MUST HAVE AT LEAST ONE OPT",
    "colour": "Colour",
+    "standard": "Standard",
+    "custom": "Custom",
+    "useMaterialYou": "Use Material You",
    "githubStarredRepos": "GitHub Starred Repos",
    "uname": "Username",
    "wrongArgNum": "Wrong number of arguments provided",
--- a/assets/translations/ru.json
+++ b/assets/translations/ru.json
@@ -22,6 +22,9 @@
    "requiredInBrackets": "(обязательно)",
    "dropdownNoOptsError": "Ошибка: в выпадающем списке должна быть выбрана хотя бы одна настройка",
    "colour": "Цвет",
+    "standard": "Стандартный",
+    "custom": "Индивидуальный",
+    "useMaterialYou": "Использовать Material You",
    "githubStarredRepos": "Избранные репозитории GitHub",
    "uname": "Имя пользователя",
    "wrongArgNum": "Неправильное количество предоставленных аргументов",
--- a/lib/main.dart
+++ b/lib/main.dart
@@ -119,8 +119,6 @@ void main() async {
  BackgroundFetch.registerHeadlessTask(backgroundFetchHeadlessTask);
 }

-var defaultThemeColour = Colors.deepPurple;
-
 class Obtainium extends StatefulWidget {
  const Obtainium({super.key});

@@ -214,15 +212,13 @@ class _ObtainiumState extends State<Obtainium> {
      // Decide on a colour/brightness scheme based on OS and user settings
      ColorScheme lightColorScheme;
      ColorScheme darkColorScheme;
-      if (lightDynamic != null &&
-          darkDynamic != null &&
-          settingsProvider.colour == ColourSettings.materialYou) {
+      if (lightDynamic != null && darkDynamic != null && settingsProvider.useMaterialYou) {
        lightColorScheme = lightDynamic.harmonized();
        darkColorScheme = darkDynamic.harmonized();
      } else {
-        lightColorScheme = ColorScheme.fromSeed(seedColor: defaultThemeColour);
+        lightColorScheme = ColorScheme.fromSeed(seedColor: settingsProvider.themeColor);
        darkColorScheme = ColorScheme.fromSeed(
-            seedColor: defaultThemeColour, brightness: Brightness.dark);
+            seedColor: settingsProvider.themeColor, brightness: Brightness.dark);
      }

      // set the background and surface colors to pure black in the amoled theme
--- a/lib/pages/settings.dart
+++ b/lib/pages/settings.dart
@@ -1,6 +1,7 @@
 import 'package:device_info_plus/device_info_plus.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:equations/equations.dart';
+import 'package:flex_color_picker/flex_color_picker.dart';
 import 'package:flutter/material.dart';
 import 'package:obtainium/components/custom_app_bar.dart';
 import 'package:obtainium/components/generated_form.dart';
@@ -30,6 +31,10 @@ class _SettingsPageState extends State<SettingsPage> {
  late SplineInterpolation updateIntervalInterpolator;  // 🤓
  String updateIntervalLabel = tr('neverManualOnly');
  bool showIntervalLabel = true;
+  final Map<ColorSwatch<Object>, String> colorsNameMap =
+  <ColorSwatch<Object>, String> {
+    ColorTools.createPrimarySwatch(obtainiumThemeColor): 'Obtainium'
+  };

  void initUpdateIntervalInterpolator() {
    List<InterpolationNode> nodes = [];
@@ -111,24 +116,105 @@ class _SettingsPageState extends State<SettingsPage> {
        future: DeviceInfoPlugin().androidInfo
    );

-    var colourDropdown = DropdownButtonFormField(
-        decoration: InputDecoration(labelText: tr('colour')),
-        value: settingsProvider.colour,
-        items: const [
-          DropdownMenuItem(
-            value: ColourSettings.basic,
-            child: Text('Obtainium'),
+    Future<bool> colorPickerDialog() async {
+      return ColorPicker(
+        color: settingsProvider.themeColor,
+        onColorChanged: (Color color) =>
+            setState(() =>
+            settingsProvider.themeColor = color
            ),
-          DropdownMenuItem(
-            value: ColourSettings.materialYou,
-            child: Text('Material You'),
-          )
-        ],
-        onChanged: (value) {
-          if (value != null) {
-            settingsProvider.colour = value;
+        actionButtons: const ColorPickerActionButtons(
+          okButton: true,
+          closeButton: true,
+          dialogActionButtons: false,
+        ),
+        pickersEnabled: const <ColorPickerType, bool>{
+          ColorPickerType.both: false,
+          ColorPickerType.primary: false,
+          ColorPickerType.accent: false,
+          ColorPickerType.bw: false,
+          ColorPickerType.custom: true,
+          ColorPickerType.wheel: true,
+        },
+        pickerTypeLabels: <ColorPickerType, String>{
+          ColorPickerType.custom: tr('standard'),
+          ColorPickerType.wheel: tr('custom')
+        },
+        title: Text(tr('selectX', args: [tr('colour')]),
+            style: Theme.of(context).textTheme.titleLarge),
+        wheelDiameter: 192,
+        wheelSquareBorderRadius: 32,
+        width: 48,
+        height: 48,
+        borderRadius: 24,
+        spacing: 8,
+        runSpacing: 8,
+        enableShadesSelection: false,
+        customColorSwatchesAndNames: colorsNameMap,
+        showMaterialName: true,
+        showColorName: true,
+        materialNameTextStyle: Theme.of(context).textTheme.bodySmall,
+        colorNameTextStyle: Theme.of(context).textTheme.bodySmall,
+        copyPasteBehavior: const ColorPickerCopyPasteBehavior(longPressMenu: true),
+      ).showPickerDialog(
+        context,
+        transitionBuilder: (BuildContext context,
+            Animation<double> a1, Animation<double> a2, Widget widget) {
+          final double curvedValue = Curves.easeInCubic.transform(a1.value);
+          return Transform(
+            alignment: Alignment.center,
+            transform: Matrix4.diagonal3Values(curvedValue, curvedValue, 1),
+            child: Opacity(
+                opacity: curvedValue,
+                child: widget
+            ),
+          );
+        },
+        transitionDuration: const Duration(milliseconds: 250),
+      );
    }
+
+    var colorPicker = ListTile(
+      dense: true,
+      contentPadding: EdgeInsets.zero,
+      title: Text(tr('selectX', args: [tr('colour')])),
+      subtitle: Text("${ColorTools.nameThatColor(settingsProvider.themeColor)} "
+          "(${ColorTools.materialNameAndCode(settingsProvider.themeColor,
+              colorSwatchNameMap: colorsNameMap)})"),
+      trailing: ColorIndicator(
+        width: 40,
+        height: 40,
+        borderRadius: 20,
+        color: settingsProvider.themeColor,
+        onSelectFocus: false,
+        onSelect: () async {
+          final Color colorBeforeDialog = settingsProvider.themeColor;
+          if (!(await colorPickerDialog())) {
+            setState(() {
+              settingsProvider.themeColor = colorBeforeDialog;
            });
+          }
+        }
+      )
+    );
+
+    var useMaterialThemeSwitch = FutureBuilder(
+        builder: (ctx, val) {
+          return ((val.data?.version.sdkInt ?? 0) >= 31) ?
+          Row(
+            mainAxisAlignment: MainAxisAlignment.spaceBetween,
+            children: [
+              Flexible(child: Text(tr('useMaterialYou'))),
+              Switch(
+                  value: settingsProvider.useMaterialYou,
+                  onChanged: (value) {
+                    settingsProvider.useMaterialYou = value;
+                  })
+            ],
+          ) : const SizedBox.shrink();
+        },
+        future: DeviceInfoPlugin().androidInfo
+    );

    var sortDropdown = DropdownButtonFormField(
        isExpanded: true,
@@ -510,8 +596,9 @@ class _SettingsPageState extends State<SettingsPage> {
                                    })
                              ],
                            ),
-                            colourDropdown,
                            height16,
+                            useMaterialThemeSwitch,
+                            if (!settingsProvider.useMaterialYou) colorPicker,
                            Row(
                              mainAxisAlignment: MainAxisAlignment.start,
                              crossAxisAlignment: CrossAxisAlignment.start,
--- a/lib/providers/settings_provider.dart
+++ b/lib/providers/settings_provider.dart
@@ -17,11 +17,10 @@ import 'package:shared_storage/shared_storage.dart' as saf;
 String obtainiumTempId = 'imranr98_obtainium_${GitHub().hosts[0]}';
 String obtainiumId = 'dev.imranr.obtainium';
 String obtainiumUrl = 'https://github.com/ImranR98/Obtainium';
+Color obtainiumThemeColor = const Color(0xFF6438B5);

 enum ThemeSettings { light, dark, system }

-enum ColourSettings { basic, materialYou }
-
 enum SortColumnSettings { added, nameAuthor, authorName, releaseDate }

 enum SortOrderSettings { ascending, descending }
@@ -68,13 +67,23 @@ class SettingsProvider with ChangeNotifier {
    notifyListeners();
  }

-  ColourSettings get colour {
-    return ColourSettings
-        .values[prefs?.getInt('colour') ?? ColourSettings.basic.index];
+  Color get themeColor {
+    int? colorCode = prefs?.getInt('themeColor');
+    return (colorCode != null) ?
+        Color(colorCode) : obtainiumThemeColor;
  }

-  set colour(ColourSettings t) {
-    prefs?.setInt('colour', t.index);
+  set themeColor(Color themeColor) {
+    prefs?.setInt('themeColor', themeColor.value);
+    notifyListeners();
+  }
+
+  bool get useMaterialYou {
+    return prefs?.getBool('useMaterialYou') ?? false;
+  }
+
+  set useMaterialYou(bool useMaterialYou) {
+    prefs?.setBool('useMaterialYou', useMaterialYou);
    notifyListeners();
  }

--- a/pubspec.lock
+++ b/pubspec.lock
@@ -283,6 +283,22 @@ packages:
      url: "https://pub.dev"
    source: hosted
    version: "1.1.0"
+  flex_color_picker:
+    dependency: "direct main"
+    description:
+      name: flex_color_picker
+      sha256: "5c846437069fb7afdd7ade6bf37e628a71d2ab0787095ddcb1253bf9345d5f3a"
+      url: "https://pub.dev"
+    source: hosted
+    version: "3.4.1"
+  flex_seed_scheme:
+    dependency: transitive
+    description:
+      name: flex_seed_scheme
+      sha256: "4cee2f1d07259f77e8b36f4ec5f35499d19e74e17c7dce5b819554914082bc01"
+      url: "https://pub.dev"
+    source: hosted
+    version: "1.5.0"
  flutter:
    dependency: "direct main"
    description: flutter
@@ -659,10 +675,10 @@ packages:
    dependency: transitive
    description:
      name: petitparser
-      sha256: c15605cd28af66339f8eb6fbe0e541bfe2d1b72d5825efc6598f3e0a31b9ad27
+      sha256: cb3798bef7fc021ac45b308f4b51208a152792445cce0448c9a4ba5879dd8750
      url: "https://pub.dev"
    source: hosted
-    version: "6.0.2"
+    version: "5.4.0"
  platform:
    dependency: transitive
    description:
@@ -1041,10 +1057,10 @@ packages:
    dependency: transitive
    description:
      name: xml
-      sha256: b015a8ad1c488f66851d762d3090a21c600e479dc75e68328c52774040cf9226
+      sha256: "5bc72e1e45e941d825fd7468b9b4cc3b9327942649aeb6fc5cdbf135f0a86e84"
      url: "https://pub.dev"
    source: hosted
-    version: "6.5.0"
+    version: "6.3.0"
  yaml:
    dependency: transitive
    description:
@@ -1054,5 +1070,5 @@ packages:
    source: hosted
    version: "3.1.2"
 sdks:
-  dart: ">=3.3.0 <4.0.0"
+  dart: ">=3.3.3 <4.0.0"
  flutter: ">=3.19.0"
--- a/pubspec.yaml
+++ b/pubspec.yaml
@@ -69,6 +69,7 @@ dependencies:
  app_links: ^4.0.0
  background_fetch: ^1.2.1
  equations: ^5.0.2
+  flex_color_picker: ^3.4.1
  android_system_font:
    git:
      url: https://github.com/re7gog/android_system_font