style(mobile): update video indicator (immich-app#4443)

mp075496706 · Oct 11, 2023 · 18fcca2 · 18fcca2
1 parent 8222327
commit 18fcca2
Showing 1 changed file with 34 additions and 20 deletions.
diff --git a/mobile/lib/modules/home/ui/asset_grid/thumbnail_image.dart b/mobile/lib/modules/home/ui/asset_grid/thumbnail_image.dart
@@ -60,6 +60,39 @@ class ThumbnailImage extends StatelessWidget {
       }
     }
 
+    Widget buildVideoIcon() {
+      final minutes = asset.duration.inMinutes;
+      final durationString = asset.duration.toString();
+      return Positioned(
+        top: 5,
+        right: 5,
+        child: Row(
+          children: [
+            Text(
+              minutes > 59
+                  ? durationString.substring(0, 7) // h:mm:ss
+                  : minutes > 0
+                      ? durationString.substring(2, 7) // mm:ss
+                      : durationString.substring(3, 7), // m:ss
+              style: const TextStyle(
+                color: Colors.white,
+                fontSize: 10,
+                fontWeight: FontWeight.bold,
+              ),
+            ),
+            const SizedBox(
+              width: 3,
+            ),
+            const Icon(
+              Icons.play_circle_fill_rounded,
+              color: Colors.white,
+              size: 18,
+            ),
+          ],
+        ),
+      );
+    }
+
     Widget buildImage() {
       final image = SizedBox(
         width: 300,
@@ -162,26 +195,7 @@ class ThumbnailImage extends StatelessWidget {
                 size: 18,
               ),
             ),
-          if (!asset.isImage)
-            Positioned(
-              top: 5,
-              right: 5,
-              child: Row(
-                children: [
-                  Text(
-                    asset.duration.toString().substring(0, 7),
-                    style: const TextStyle(
-                      color: Colors.white,
-                      fontSize: 10,
-                    ),
-                  ),
-                  const Icon(
-                    Icons.play_circle_outline_rounded,
-                    color: Colors.white,
-                  ),
-                ],
-              ),
-            ),
+          if (!asset.isImage) buildVideoIcon(),
         ],
       ),
     );