From 63ff6cc86725f346c11a7539192d61bf92f1fe05 Mon Sep 17 00:00:00 2001
From: Vadim <44135514+vodemn@users.noreply.github.com>
Date: Mon, 23 Sep 2024 16:08:30 +0200
Subject: [PATCH] ML-189 Auto-downsize exposure pairs items for big display
 sizes (#190)

* added autosize text

* added more room for exposure pairs list

* downsize text only for long values
---
 .../widget_container_camera.dart              | 39 +++++-----
 .../widget_item_list_exposure_pairs.dart      | 76 +++++++++++++++----
 pubspec.yaml                                  |  1 +
 3 files changed, 83 insertions(+), 33 deletions(-)

diff --git a/lib/screens/metering/components/camera_container/widget_container_camera.dart b/lib/screens/metering/components/camera_container/widget_container_camera.dart
index 4d83b0e..e5477f8 100644
--- a/lib/screens/metering/components/camera_container/widget_container_camera.dart
+++ b/lib/screens/metering/components/camera_container/widget_container_camera.dart
@@ -76,28 +76,31 @@ class CameraContainer extends StatelessWidget {
                 height: min(meteringContainerHeight, cameraPreviewHeight) + Dimens.paddingM * 2,
               ),
               Expanded(
-                child: Padding(
-                  padding: const EdgeInsets.symmetric(horizontal: Dimens.paddingM),
-                  child: Row(
-                    children: [
-                      Expanded(
-                        child: Padding(
-                          padding: EdgeInsets.only(top: topBarOverflow >= 0 ? topBarOverflow : 0),
-                          child: ExposurePairsList(
-                            exposurePairs,
-                            onExposurePairTap: onExposurePairTap,
-                          ),
+                child: Row(
+                  children: [
+                    Expanded(
+                      child: Padding(
+                        padding: EdgeInsets.only(
+                          left: Dimens.paddingM - Dimens.grid8,
+                          top: topBarOverflow >= 0 ? topBarOverflow : 0,
+                        ),
+                        child: ExposurePairsList(
+                          exposurePairs,
+                          onExposurePairTap: onExposurePairTap,
                         ),
                       ),
-                      const SizedBox(width: Dimens.grid8),
-                      Expanded(
-                        child: Padding(
-                          padding: EdgeInsets.only(top: topBarOverflow <= 0 ? -topBarOverflow : 0),
-                          child: const _CameraControlsBuilder(),
+                    ),
+                    SizedBox(
+                      width: MediaQuery.sizeOf(context).width / 2 - Dimens.grid4,
+                      child: Padding(
+                        padding: EdgeInsets.only(
+                          top: topBarOverflow <= 0 ? -topBarOverflow : 0,
+                          right: Dimens.paddingM,
                         ),
+                        child: const _CameraControlsBuilder(),
                       ),
-                    ],
-                  ),
+                    ),
+                  ],
                 ),
               ),
             ],
diff --git a/lib/screens/metering/components/shared/exposure_pairs_list/components/exposure_pairs_list_item/widget_item_list_exposure_pairs.dart b/lib/screens/metering/components/shared/exposure_pairs_list/components/exposure_pairs_list_item/widget_item_list_exposure_pairs.dart
index 9aeb108..d4209ba 100644
--- a/lib/screens/metering/components/shared/exposure_pairs_list/components/exposure_pairs_list_item/widget_item_list_exposure_pairs.dart
+++ b/lib/screens/metering/components/shared/exposure_pairs_list/components/exposure_pairs_list_item/widget_item_list_exposure_pairs.dart
@@ -1,3 +1,4 @@
+import 'package:auto_size_text/auto_size_text.dart';
 import 'package:flutter/material.dart';
 import 'package:lightmeter/res/dimens.dart';
 import 'package:m3_lightmeter_resources/m3_lightmeter_resources.dart';
@@ -15,22 +16,9 @@ class ExposurePairsListItem<T extends PhotographyStopValue> extends StatelessWid
   @override
   Widget build(BuildContext context) {
     final List<Widget> rowChildren = [
-      Flexible(
-        child: Text(
-          value.toString(),
-          style: labelTextStyle(context).copyWith(color: Theme.of(context).colorScheme.onBackground),
-          softWrap: false,
-          overflow: TextOverflow.fade,
-        ),
-      ),
+      _Title(value),
       const SizedBox(width: Dimens.grid8),
-      ColoredBox(
-        color: Theme.of(context).colorScheme.onBackground,
-        child: SizedBox(
-          height: 1,
-          width: tickLength(),
-        ),
-      ),
+      if (value.stopType == StopType.full) const _Tick.full() else const _Tick.short(),
       if (value.stopType != StopType.full) const SizedBox(width: Dimens.grid4),
     ];
     return Row(
@@ -59,3 +47,61 @@ class ExposurePairsListItem<T extends PhotographyStopValue> extends StatelessWid
     }
   }
 }
+
+class _Title<T extends PhotographyStopValue> extends StatelessWidget {
+  final T value;
+  late final String _title = value.toString();
+
+  _Title(this.value, {super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return Flexible(
+      child: _title.length > 5 // downsize text only for long values like 1/4000
+          ? AutoSizeText(
+              value.toString(),
+              stepGranularity: 0.5,
+              minFontSize: 10,
+              style: labelTextStyle(context).copyWith(color: Theme.of(context).colorScheme.onBackground),
+              softWrap: false,
+              overflow: TextOverflow.fade,
+              maxLines: 1,
+            )
+          : Text(
+              value.toString(),
+              style: labelTextStyle(context).copyWith(color: Theme.of(context).colorScheme.onBackground),
+              softWrap: false,
+              overflow: TextOverflow.fade,
+              maxLines: 1,
+            ),
+    );
+  }
+
+  TextStyle labelTextStyle(BuildContext context) {
+    switch (value.stopType) {
+      case StopType.full:
+        return Theme.of(context).textTheme.bodyLarge!;
+      case StopType.half:
+      case StopType.third:
+        return Theme.of(context).textTheme.bodyMedium!;
+    }
+  }
+}
+
+class _Tick extends StatelessWidget {
+  final double _length;
+
+  const _Tick.full() : _length = Dimens.grid16;
+  const _Tick.short() : _length = Dimens.grid8;
+
+  @override
+  Widget build(BuildContext context) {
+    return ColoredBox(
+      color: Theme.of(context).colorScheme.onBackground,
+      child: SizedBox(
+        height: 1,
+        width: _length,
+      ),
+    );
+  }
+}
diff --git a/pubspec.yaml b/pubspec.yaml
index 286e213..4549a88 100644
--- a/pubspec.yaml
+++ b/pubspec.yaml
@@ -8,6 +8,7 @@ environment:
 
 dependencies:
   app_settings: 4.2.0
+  auto_size_text: 3.0.0
   bloc_concurrency: 0.2.2
   camera: 0.10.5+2
   camera_android_camerax: 0.6.1+1