#245 thumbnail overlay tag icon

lib/l10n/app_en.arb

@@ -622,6 +622,7 @@
   "settingsThumbnailOverlayTile": "Overlay",
   "settingsThumbnailOverlayTitle": "Overlay",
   "settingsThumbnailShowFavouriteIcon": "Show favorite icon",
+  "settingsThumbnailShowTagIcon": "Show tag icon",
   "settingsThumbnailShowLocationIcon": "Show location icon",
   "settingsThumbnailShowMotionPhotoIcon": "Show motion photo icon",
   "settingsThumbnailShowRating": "Show rating",

lib/model/settings/defaults.dart

@@ -54,6 +54,7 @@ class SettingsDefaults {
     EntrySetAction.delete,
   ];
   static const showThumbnailFavourite = true;
+  static const showThumbnailTag = false;
   static const showThumbnailLocation = true;
   static const showThumbnailMotionPhoto = true;
   static const showThumbnailRating = true;

lib/model/settings/settings.dart

@@ -71,6 +71,7 @@ class Settings extends ChangeNotifier {
   static const collectionBrowsingQuickActionsKey = 'collection_browsing_quick_actions';
   static const collectionSelectionQuickActionsKey = 'collection_selection_quick_actions';
   static const showThumbnailFavouriteKey = 'show_thumbnail_favourite';
+  static const showThumbnailTagKey = 'show_thumbnail_tag';
   static const showThumbnailLocationKey = 'show_thumbnail_location';
   static const showThumbnailMotionPhotoKey = 'show_thumbnail_motion_photo';
   static const showThumbnailRatingKey = 'show_thumbnail_rating';
@@ -354,6 +355,10 @@ class Settings extends ChangeNotifier {
 
   set showThumbnailFavourite(bool newValue) => setAndNotify(showThumbnailFavouriteKey, newValue);
 
+  bool get showThumbnailTag => getBoolOrDefault(showThumbnailTagKey, SettingsDefaults.showThumbnailTag);
+
+  set showThumbnailTag(bool newValue) => setAndNotify(showThumbnailTagKey, newValue);
+
   bool get showThumbnailLocation => getBoolOrDefault(showThumbnailLocationKey, SettingsDefaults.showThumbnailLocation);
 
   set showThumbnailLocation(bool newValue) => setAndNotify(showThumbnailLocationKey, newValue);
@@ -694,6 +699,7 @@ class Settings extends ChangeNotifier {
             case confirmMoveUndatedItemsKey:
             case setMetadataDateBeforeFileOpKey:
             case showThumbnailFavouriteKey:
+            case showThumbnailTagKey:
             case showThumbnailLocationKey:
             case showThumbnailMotionPhotoKey:
             case showThumbnailRatingKey:

lib/widgets/common/grid/theme.dart

@@ -34,6 +34,7 @@ class GridTheme extends StatelessWidget {
           showMotionPhoto: settings.showThumbnailMotionPhoto,
           showRating: settings.showThumbnailRating,
           showRaw: settings.showThumbnailRaw,
+          showTag: settings.showThumbnailTag,
           showTrash: showTrash ?? true,
           showVideoDuration: settings.showThumbnailVideoDuration,
         );
@@ -45,7 +46,7 @@ class GridTheme extends StatelessWidget {
 
 class GridThemeData {
   final double iconSize, fontSize, highlightBorderWidth;
-  final bool showFavourite, showLocation, showMotionPhoto, showRating, showRaw, showTrash, showVideoDuration;
+  final bool showFavourite, showLocation, showMotionPhoto, showRating, showRaw, showTag, showTrash, showVideoDuration;
 
   const GridThemeData({
     required this.iconSize,
@@ -56,6 +57,7 @@ class GridThemeData {
     required this.showMotionPhoto,
     required this.showRating,
     required this.showRaw,
+    required this.showTag,
     required this.showTrash,
     required this.showVideoDuration,
   });

lib/widgets/common/identity/aves_icons.dart

@@ -87,6 +87,21 @@ class FavouriteIcon extends StatelessWidget {
   }
 }
 
+class TagIcon extends StatelessWidget {
+  const TagIcon({Key? key}) : super(key: key);
+
+  static const scale = .9;
+
+  @override
+  Widget build(BuildContext context) {
+    return const OverlayIcon(
+      icon: AIcons.tag,
+      iconScale: scale,
+      relativeOffset: Offset(.05, .05),
+    );
+  }
+}
+
 class GpsIcon extends StatelessWidget {
   const GpsIcon({Key? key}) : super(key: key);
 
@@ -204,7 +219,8 @@ class OverlayIcon extends StatelessWidget {
   final IconData icon;
   final String? text;
   final double iconScale;
-  final EdgeInsets margin;
+  final EdgeInsetsGeometry margin;
+  final Offset? relativeOffset;
 
   const OverlayIcon({
     Key? key,
@@ -213,25 +229,36 @@ class OverlayIcon extends StatelessWidget {
     this.text,
     // default margin for multiple icons in a `Column`
     this.margin = const EdgeInsets.only(left: 1, right: 1, bottom: 1),
+    this.relativeOffset,
   }) : super(key: key);
 
   @override
   Widget build(BuildContext context) {
     final size = context.select<GridThemeData, double>((t) => t.iconSize);
-    final iconChild = Icon(
+    Widget iconChild = Icon(
       icon,
       size: size,
     );
-    final iconBox = SizedBox(
-      width: size,
-      height: size,
+
+    if (relativeOffset != null) {
+      iconChild = FractionalTranslation(
+        translation: relativeOffset!,
+        child: iconChild,
+      );
+    }
+
+    if (iconScale != 1) {
       // using a transform is better than modifying the icon size to properly center the scaled icon
-      child: iconScale != 1
-          ? Transform.scale(
+      iconChild = Transform.scale(
         scale: iconScale,
         child: iconChild,
-            )
-          : iconChild,
+      );
+    }
+
+    iconChild = SizedBox(
+      width: size,
+      height: size,
+      child: iconChild,
     );
 
     return Container(
@@ -242,12 +269,12 @@ class OverlayIcon extends StatelessWidget {
         borderRadius: BorderRadius.all(Radius.circular(size)),
       ),
       child: text == null
-          ? iconBox
+          ? iconChild
           : Row(
               mainAxisSize: MainAxisSize.min,
               crossAxisAlignment: CrossAxisAlignment.center,
               children: [
-                iconBox,
+                iconChild,
                 const SizedBox(width: 2),
                 Text(
                   text!,

lib/widgets/common/thumbnail/overlay.dart

@@ -20,6 +20,7 @@ class ThumbnailEntryOverlay extends StatelessWidget {
   Widget build(BuildContext context) {
     final children = [
       if (entry.isFavourite && context.select<GridThemeData, bool>((t) => t.showFavourite)) const FavouriteIcon(),
+      if (entry.tags.isNotEmpty && context.select<GridThemeData, bool>((t) => t.showTag)) const TagIcon(),
       if (entry.hasGps && context.select<GridThemeData, bool>((t) => t.showLocation)) const GpsIcon(),
       if (entry.rating != 0 && context.select<GridThemeData, bool>((t) => t.showRating)) RatingIcon(entry: entry),
       if (entry.isVideo)

lib/widgets/settings/thumbnails/overlay.dart

@@ -37,6 +37,19 @@ class ThumbnailOverlayPage extends StatelessWidget {
                 ),
               ),
             ),
+            SettingsSwitchListTile(
+              selector: (context, s) => s.showThumbnailTag,
+              onChanged: (v) => settings.showThumbnailTag = v,
+              title: context.l10n.settingsThumbnailShowTagIcon,
+              trailing: Padding(
+                padding: EdgeInsets.symmetric(horizontal: iconSize * (1 - TagIcon.scale) / 2),
+                child: Icon(
+                  AIcons.tag,
+                  size: iconSize * TagIcon.scale,
+                  color: iconColor,
+                ),
+              ),
+            ),
             SettingsSwitchListTile(
               selector: (context, s) => s.showThumbnailLocation,
               onChanged: (v) => settings.showThumbnailLocation = v,

test_driver/driver_screenshots.dart

@@ -27,6 +27,7 @@ Future<void> configureAndLaunch() async {
     ..collectionSortFactor = EntrySortFactor.date
     ..collectionBrowsingQuickActions = SettingsDefaults.collectionBrowsingQuickActions
     ..showThumbnailFavourite = false
+    ..showThumbnailTag = false
     ..showThumbnailLocation = false
     ..hiddenFilters = {}
     // viewer

untranslated.json

@@ -2,7 +2,8 @@
   "de": [
     "settingsSearchFieldLabel",
     "settingsSearchEmpty",
-    "settingsShowBottomNavigationBar"
+    "settingsShowBottomNavigationBar",
+    "settingsThumbnailShowTagIcon"
   ],
 
   "es": [
@@ -18,25 +19,29 @@
     "appPickDialogNone",
     "settingsSearchFieldLabel",
     "settingsSearchEmpty",
-    "settingsShowBottomNavigationBar"
+    "settingsShowBottomNavigationBar",
+    "settingsThumbnailShowTagIcon"
   ],
 
   "fr": [
     "settingsSearchFieldLabel",
     "settingsSearchEmpty",
-    "settingsShowBottomNavigationBar"
+    "settingsShowBottomNavigationBar",
+    "settingsThumbnailShowTagIcon"
   ],
 
   "id": [
     "settingsSearchFieldLabel",
     "settingsSearchEmpty",
-    "settingsShowBottomNavigationBar"
+    "settingsShowBottomNavigationBar",
+    "settingsThumbnailShowTagIcon"
   ],
 
   "it": [
     "settingsSearchFieldLabel",
     "settingsSearchEmpty",
-    "settingsShowBottomNavigationBar"
+    "settingsShowBottomNavigationBar",
+    "settingsThumbnailShowTagIcon"
   ],
 
   "ja": [
@@ -52,30 +57,35 @@
     "appPickDialogNone",
     "settingsSearchFieldLabel",
     "settingsSearchEmpty",
-    "settingsShowBottomNavigationBar"
+    "settingsShowBottomNavigationBar",
+    "settingsThumbnailShowTagIcon"
   ],
 
   "ko": [
     "settingsSearchFieldLabel",
     "settingsSearchEmpty",
-    "settingsShowBottomNavigationBar"
+    "settingsShowBottomNavigationBar",
+    "settingsThumbnailShowTagIcon"
   ],
 
   "pt": [
     "settingsSearchFieldLabel",
     "settingsSearchEmpty",
-    "settingsShowBottomNavigationBar"
+    "settingsShowBottomNavigationBar",
+    "settingsThumbnailShowTagIcon"
   ],
 
   "ru": [
     "settingsSearchFieldLabel",
     "settingsSearchEmpty",
-    "settingsShowBottomNavigationBar"
+    "settingsShowBottomNavigationBar",
+    "settingsThumbnailShowTagIcon"
   ],
 
   "zh": [
     "settingsSearchFieldLabel",
     "settingsSearchEmpty",
-    "settingsShowBottomNavigationBar"
+    "settingsShowBottomNavigationBar",
+    "settingsThumbnailShowTagIcon"
   ]
 }