feat: add handdrawn stars (#317)

* feat: add handdrawn stars * chore: new assets * chore: ignores --------- Co-authored-by: Ollie Pugh <[email protected]>
alestiago · Mar 11, 2024 · e5c60b3 · e5c60b3
1 parent ec02e4f
commit e5c60b3
Show file tree

Hide file tree

Showing 7 changed files with 50 additions and 21 deletions.
diff --git a/packages/trashy_road/assets/images/display/star_empty_1.png b/packages/trashy_road/assets/images/display/star_empty_1.png
diff --git a/packages/trashy_road/assets/images/display/star_empty_2.png b/packages/trashy_road/assets/images/display/star_empty_2.png
diff --git a/packages/trashy_road/assets/images/display/star_filled_golden_1.png b/packages/trashy_road/assets/images/display/star_filled_golden_1.png
diff --git a/packages/trashy_road/assets/images/display/star_filled_golden_2.png b/packages/trashy_road/assets/images/display/star_filled_golden_2.png
diff --git a/packages/trashy_road/lib/gen/assets.gen.dart b/packages/trashy_road/lib/gen/assets.gen.dart
diff --git a/packages/trashy_road/lib/src/maps/widgets/game_map_tile.dart b/packages/trashy_road/lib/src/maps/widgets/game_map_tile.dart
@@ -96,11 +96,21 @@ class _Stars extends StatelessWidget {
 
   final int value;
 
+  static final _random = Random();
+  static final _filledIimages = [
+    Assets.images.display.starFilledGolden1,
+    Assets.images.display.starFilledGolden2,
+  ];
+  static final _emptyIimages = [
+    Assets.images.display.starEmpty1,
+    Assets.images.display.starEmpty2,
+  ];
+
   @override
   Widget build(BuildContext context) {
-    SvgGenImage star({required bool filled}) => filled
-        ? Assets.images.display.starFilled
-        : Assets.images.display.starEmpty;
+    AssetGenImage star({required bool filled}) => filled
+        ? _filledIimages[_random.nextInt(_filledIimages.length)]
+        : _emptyIimages[_random.nextInt(_emptyIimages.length)];
 
     return LayoutBuilder(
       builder: (context, constraints) {
@@ -110,12 +120,12 @@ class _Stars extends StatelessWidget {
         return Row(
           mainAxisAlignment: MainAxisAlignment.center,
           children: [
-            star(filled: value >= 1).svg(width: starWidth),
+            star(filled: value >= 1).image(width: starWidth),
             Padding(
               padding: const EdgeInsets.symmetric(horizontal: 5),
-              child: star(filled: value >= 2).svg(width: starWidth),
+              child: star(filled: value >= 2).image(width: starWidth),
             ),
-            star(filled: value >= 3).svg(width: starWidth),
+            star(filled: value >= 3).image(width: starWidth),
           ],
         );
       },

diff --git a/packages/trashy_road/web/index.html b/packages/trashy_road/web/index.html
@@ -1,5 +1,6 @@
 <!DOCTYPE html>
 <html>
+
 <head>
   <!--
     If you are serving your web app in a path other than the root, change the
@@ -27,7 +28,7 @@
   <link rel="apple-touch-icon" href="icons/Icon-192.png">
 
   <!-- Favicon -->
-  <link rel="icon" type="image/png" href="favicon.png"/>
+  <link rel="icon" type="image/png" href="favicon.png" />
 
   <title>trashy_road</title>
   <link rel="manifest" href="manifest.json">
@@ -39,21 +40,23 @@
   <!-- This script adds the flutter initialization JS code -->
   <script src="flutter.js" defer></script>
 </head>
+
 <body>
   <script>
-    window.addEventListener('load', function(ev) {
+    window.addEventListener('load', function (ev) {
       // Download main.dart.js
       _flutter.loader.loadEntrypoint({
         serviceWorker: {
           serviceWorkerVersion: serviceWorkerVersion,
         },
-        onEntrypointLoaded: function(engineInitializer) {
-          engineInitializer.initializeEngine().then(function(appRunner) {
+        onEntrypointLoaded: function (engineInitializer) {
+          engineInitializer.initializeEngine().then(function (appRunner) {
             appRunner.runApp();
           });
         }
       });
     });
   </script>
 </body>
-</html>
+
+</html>