Improve background previews and fix colors

Author: CodeDoctorDE

api/lib/src/models/colors.dart

@@ -1,8 +1,8 @@
 import 'package:dart_leap/dart_leap.dart';
 
 class BasicColors {
-  static const light = SRGBColor(0xFFD9D9D9);
-  static const dark = SRGBColor(0xFF1A1A1A);
+  static const light = SRGBColor(0xFF9E9E9E);
+  static const dark = SRGBColor(0xFF3A3A3A);
   static const red = SRGBColor(0xFFF44336);
   static const blue = SRGBColor(0xFF2196F3);
   static const whiteTransparent = SRGBColor(0x00FFFFFF);

api/lib/src/models/texture.dart

@@ -14,8 +14,12 @@ enum PatternTemplate {
   plainDark,
   ruled,
   ruledDark,
+  ruledSimple,
+  ruledSimpleDark,
   quad,
   quadDark,
+  quadSimple,
+  quadSimpleDark,
   music,
   musicDark,
   dotted,
@@ -30,77 +34,111 @@ extension PatternTemplateExtension on PatternTemplate {
   PatternBackground get background => switch (this) {
     PatternTemplate.plain ||
     PatternTemplate.ruled ||
+    PatternTemplate.ruledSimple ||
     PatternTemplate.quad ||
+    PatternTemplate.quadSimple ||
     PatternTemplate.music ||
     PatternTemplate.dotted => PatternBackground.light,
     PatternTemplate.plainDark ||
     PatternTemplate.ruledDark ||
+    PatternTemplate.ruledSimpleDark ||
     PatternTemplate.quadDark ||
+    PatternTemplate.quadSimpleDark ||
     PatternTemplate.musicDark ||
     PatternTemplate.dottedDark => PatternBackground.dark,
   };
 
   PatternTexture create() {
     switch (this) {
       case PatternTemplate.plain:
-        return const PatternTexture(boxColor: BasicColors.light);
+        return const PatternTexture(boxColor: SRGBColor.white);
       case PatternTemplate.ruled:
-        return const PatternTexture(boxColor: BasicColors.light, boxHeight: 40);
+        return const PatternTexture(boxColor: SRGBColor.white, boxHeight: 40);
+      case PatternTemplate.ruledSimple:
+        return const PatternTexture(
+          boxColor: SRGBColor.white,
+          boxHeight: 40,
+          boxXColor: BasicColors.dark,
+          boxYColor: BasicColors.dark,
+        );
       case PatternTemplate.quad:
         return const PatternTexture(
-          boxColor: BasicColors.light,
+          boxColor: SRGBColor.white,
           boxHeight: 40,
           boxWidth: 40,
         );
+      case PatternTemplate.quadSimple:
+        return const PatternTexture(
+          boxColor: SRGBColor.white,
+          boxHeight: 40,
+          boxWidth: 40,
+          boxXColor: BasicColors.dark,
+          boxYColor: BasicColors.dark,
+        );
       case PatternTemplate.music:
         return const PatternTexture(
-          boxColor: BasicColors.light,
+          boxColor: SRGBColor.white,
           boxHeight: 40,
           boxYColor: SRGBColor.black,
           boxYSpace: 80,
           boxYCount: 5,
         );
       case PatternTemplate.dotted:
         return const PatternTexture(
-          boxColor: BasicColors.light,
+          boxColor: SRGBColor.white,
           boxWidth: 40,
           boxHeight: 40,
           boxXCount: 1,
           boxYCount: 2,
           boxXStroke: 5,
           boxYStroke: 35,
-          boxXColor: SRGBColor.black,
-          boxYColor: BasicColors.light,
+          boxXColor: BasicColors.light,
+          boxYColor: SRGBColor.white,
         );
       case PatternTemplate.plainDark:
-        return const PatternTexture(boxColor: BasicColors.dark);
+        return const PatternTexture(boxColor: SRGBColor.black);
       case PatternTemplate.ruledDark:
-        return const PatternTexture(boxColor: BasicColors.dark, boxHeight: 40);
+        return const PatternTexture(boxColor: SRGBColor.black, boxHeight: 40);
+      case PatternTemplate.ruledSimpleDark:
+        return const PatternTexture(
+          boxColor: SRGBColor.black,
+          boxHeight: 40,
+          boxXColor: BasicColors.dark,
+          boxYColor: BasicColors.dark,
+        );
       case PatternTemplate.quadDark:
         return const PatternTexture(
-          boxColor: BasicColors.dark,
+          boxColor: SRGBColor.black,
+          boxWidth: 40,
+          boxHeight: 40,
+        );
+      case PatternTemplate.quadSimpleDark:
+        return const PatternTexture(
+          boxColor: SRGBColor.black,
           boxWidth: 40,
           boxHeight: 40,
+          boxXColor: BasicColors.dark,
+          boxYColor: BasicColors.dark,
         );
       case PatternTemplate.musicDark:
         return const PatternTexture(
-          boxColor: BasicColors.dark,
+          boxColor: SRGBColor.black,
           boxYColor: SRGBColor.white,
           boxHeight: 40,
           boxYSpace: 80,
           boxYCount: 5,
         );
       case PatternTemplate.dottedDark:
         return const PatternTexture(
-          boxColor: BasicColors.dark,
+          boxColor: SRGBColor.black,
           boxWidth: 40,
           boxHeight: 40,
           boxXCount: 1,
           boxYCount: 2,
           boxXStroke: 5,
           boxYStroke: 35,
-          boxXColor: SRGBColor.white,
-          boxYColor: BasicColors.dark,
+          boxXColor: BasicColors.dark,
+          boxYColor: SRGBColor.black,
         );
     }
   }

app/lib/l10n/app_en.arb

@@ -1268,5 +1268,9 @@
   "customizeShortcuts": "Customize shortcuts",
   "clickToSave": "Click to save",
   "toolbars": "Toolbars",
-  "logs": "Logs"
+  "logs": "Logs",
+  "ruledSimple": "Ruled simple",
+  "ruledSimpleDark": "Ruled simple dark",
+  "quadSimple": "Quad simple",
+  "quadSimpleDark": "Quad simple dark"
 }

app/lib/visualizer/preset.dart

@@ -11,11 +11,19 @@ extension PatternTemplateHelper on PatternTemplate {
     PatternTemplate.quad => AppLocalizations.of(context).quad,
     PatternTemplate.music => AppLocalizations.of(context).music,
     PatternTemplate.dotted => AppLocalizations.of(context).dotted,
+    PatternTemplate.ruledSimple => AppLocalizations.of(context).ruledSimple,
+    PatternTemplate.quadSimple => AppLocalizations.of(context).quadSimple,
     PatternTemplate.plainDark => AppLocalizations.of(context).plainDark,
     PatternTemplate.ruledDark => AppLocalizations.of(context).ruledDark,
     PatternTemplate.quadDark => AppLocalizations.of(context).quadDark,
     PatternTemplate.musicDark => AppLocalizations.of(context).musicDark,
     PatternTemplate.dottedDark => AppLocalizations.of(context).dottedDark,
+    PatternTemplate.ruledSimpleDark => AppLocalizations.of(
+      context,
+    ).ruledSimpleDark,
+    PatternTemplate.quadSimpleDark => AppLocalizations.of(
+      context,
+    ).quadSimpleDark,
   };
 }