#551 collection: item size in list layout

CHANGELOG.md

@@ -7,6 +7,7 @@ All notable changes to this project will be documented in this file.
 ### Added
 
 - Collection: preview button when selecting items
+- Collection: item size in list layout
 - Vaults: custom pattern lock
 - Video: picture-in-picture
 - Video: handle skip next/previous media buttons

lib/widgets/collection/grid/list_details.dart

@@ -4,6 +4,7 @@ import 'package:aves/model/settings/settings.dart';
 import 'package:aves/theme/format.dart';
 import 'package:aves/theme/icons.dart';
 import 'package:aves/utils/constants.dart';
+import 'package:aves/utils/file_utils.dart';
 import 'package:aves/widgets/collection/grid/list_details_theme.dart';
 import 'package:aves/widgets/common/extensions/build_context.dart';
 import 'package:aves/widgets/common/fx/borders.dart';
@@ -50,46 +51,57 @@ class EntryListDetails extends StatelessWidget {
     );
   }
 
+  Widget _buildRow(List<InlineSpan> spans, TextStyle style) {
+    return Text.rich(
+      TextSpan(
+        children: spans,
+      ),
+      style: style,
+      strutStyle: Constants.overflowStrutStyle,
+      softWrap: false,
+      overflow: TextOverflow.fade,
+    );
+  }
+
+  WidgetSpan _buildIconSpan(IconData icon, {EdgeInsetsDirectional padding = EdgeInsetsDirectional.zero}) {
+    return WidgetSpan(
+      alignment: PlaceholderAlignment.middle,
+      child: Padding(
+        padding: const EdgeInsetsDirectional.only(end: 8, bottom: 1) + padding,
+        child: Icon(icon),
+      ),
+    );
+  }
+
   Widget _buildDateRow(BuildContext context, TextStyle style) {
     final locale = context.l10n.localeName;
     final use24hour = context.select<MediaQueryData, bool>((v) => v.alwaysUse24HourFormat);
     final date = entry.bestDate;
     final dateText = date != null ? formatDateTime(date, locale, use24hour) : Constants.overlayUnknown;
 
-    return Row(
+    final size = entry.sizeBytes;
-      children: [
+    final sizeText = size != null ? formatFileSize(locale, size) : Constants.overlayUnknown;
-        const Icon(AIcons.date),
+
-        const SizedBox(width: 8),
+    return _buildRow(
-        Expanded(
+      [
-          child: Text(
+        _buildIconSpan(AIcons.date),
-            dateText,
+        TextSpan(text: dateText),
-            style: style,
+        _buildIconSpan(AIcons.size, padding: const EdgeInsetsDirectional.only(start: 8)),
-            strutStyle: Constants.overflowStrutStyle,
+        TextSpan(text: sizeText),
-            softWrap: false,
-            overflow: TextOverflow.fade,
-          ),
-        ),
       ],
+      style,
     );
   }
 
   Widget _buildLocationRow(BuildContext context, TextStyle style) {
     final location = entry.hasAddress ? entry.shortAddress : settings.coordinateFormat.format(context.l10n, entry.latLng!);
 
-    return Row(
+    return _buildRow(
-      children: [
+      [
-        const Icon(AIcons.location),
+        _buildIconSpan(AIcons.location),
-        const SizedBox(width: 8),
+        TextSpan(text: location),
-        Expanded(
-          child: Text(
-            location,
-            style: style,
-            strutStyle: Constants.overflowStrutStyle,
-            softWrap: false,
-            overflow: TextOverflow.fade,
-          ),
-        ),
       ],
+      style,
     );
   }
 }