feat: Use the Slivers mechanism with the Gallery view (#4913)

* Use the Slivers mechanism with the Gallery view * Remove the print from the demo * Also remove keep alives * Ok, here is your format thing * Remove Provider
openfoodfacts · Dec 16, 2023 · f81ba98 · f81ba98
1 parent fe7e1f8
commit f81ba98
Show file tree

Hide file tree

Showing 6 changed files with 268 additions and 228 deletions.
diff --git a/packages/smooth_app/lib/generic_lib/widgets/images/smooth_image.dart b/packages/smooth_app/lib/generic_lib/widgets/images/smooth_image.dart
@@ -16,6 +16,7 @@ class SmoothImage extends StatelessWidget {
     this.color,
     this.decoration,
     this.fit,
+    this.rounded,
     this.heroTag,
   });
 
@@ -26,6 +27,7 @@ class SmoothImage extends StatelessWidget {
   final Decoration? decoration;
   final BoxFit? fit;
   final String? heroTag;
+  final bool? rounded;
 
   @override
   Widget build(BuildContext context) {
@@ -42,16 +44,21 @@ class SmoothImage extends StatelessWidget {
       child = Hero(tag: heroTag!, child: child);
     }
 
-    return ClipRRect(
-      borderRadius: ROUNDED_BORDER_RADIUS,
-      child: Container(
+    child = Container(
         decoration: decoration,
         width: width,
         height: height,
         color: color,
+        child: child);
+
+    if (rounded ?? true) {
+      child = ClipRRect(
+        borderRadius: ROUNDED_BORDER_RADIUS,
         child: child,
-      ),
-    );
+      );
+    }
+
+    return child;
   }
 
   Widget _loadingBuilder(

diff --git a/packages/smooth_app/lib/pages/image/product_image_gallery_other_view.dart b/packages/smooth_app/lib/pages/image/product_image_gallery_other_view.dart
@@ -44,16 +44,20 @@ class _ProductImageGalleryOtherViewState
         final AsyncSnapshot<List<int>> snapshot,
       ) {
         if (snapshot.connectionState != ConnectionState.done) {
-          return SizedBox(
-            width: squareSize,
-            height: squareSize,
-            child: const CircularProgressIndicator.adaptive(),
+          return SliverToBoxAdapter(
+            child: SizedBox(
+              width: squareSize,
+              height: squareSize,
+              child: const CircularProgressIndicator.adaptive(),
+            ),
           );
         }
         if (snapshot.data == null) {
-          return Text(
-            snapshot.error?.toString() ??
-                appLocalizations.loading_dialog_default_error_message,
+          return SliverToBoxAdapter(
+            child: Text(
+              snapshot.error?.toString() ??
+                  appLocalizations.loading_dialog_default_error_message,
+            ),
           );
         }
         final List<int> ids = snapshot.data!;
@@ -63,39 +67,40 @@ class _ProductImageGalleryOtherViewState
             appLocalizations.edit_photo_select_existing_downloaded_none,
           );
         }
-        return SizedBox(
-          height: (ids.length / _columns).ceil() * squareSize,
-          child: GridView.builder(
-            physics: const NeverScrollableScrollPhysics(),
-            gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
-              crossAxisCount: _columns,
-            ),
-            itemBuilder: (final BuildContext context, final int index) =>
-                InkWell(
-              onTap: () async => Navigator.push<void>(
-                context,
-                MaterialPageRoute<bool>(
-                  builder: (BuildContext context) => ProductImageOtherPage(
-                    widget.product,
-                    ids[index],
+        return SliverGrid(
+          gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
+            crossAxisCount: _columns,
+          ),
+          delegate: SliverChildBuilderDelegate(
+            (final BuildContext context, final int index) {
+              return InkWell(
+                onTap: () async => Navigator.push<void>(
+                  context,
+                  MaterialPageRoute<bool>(
+                    builder: (BuildContext context) => ProductImageOtherPage(
+                      widget.product,
+                      ids[index],
+                    ),
                   ),
                 ),
-              ),
-              child: SmoothImage(
-                width: squareSize,
-                height: squareSize,
-                imageProvider: NetworkImage(
-                  ImageHelper.getUploadedImageUrl(
-                    widget.product.barcode!,
-                    ids[index],
-                    ImageSize.DISPLAY,
+                child: SmoothImage(
+                  width: squareSize,
+                  height: squareSize,
+                  imageProvider: NetworkImage(
+                    ImageHelper.getUploadedImageUrl(
+                      widget.product.barcode!,
+                      ids[index],
+                      ImageSize.DISPLAY,
+                    ),
                   ),
                 ),
-              ),
-            ),
-            itemCount: ids.length,
-            //scrollDirection: Axis.vertical,
+              );
+            },
+            addAutomaticKeepAlives: false,
+            childCount: ids.length,
           ),
+
+          //scrollDirection: Axis.vertical,
         );
       },
     );