Fix the system UI overlay style in the `CupertinoModalBottomSheetRout…

…e` (#434) * Fix the system UI overlay style in the `CupertinoModalBottomSheetRoute` * Fix background color * Reduce rebuilds --------- Co-authored-by: Jonas Wanke <[email protected]>
jamesblasco · Nov 18, 2024 · 55a97bc · 55a97bc
1 parent e44458d
commit 55a97bc
Show file tree

Hide file tree

Showing 2 changed files with 54 additions and 47 deletions.
diff --git a/modal_bottom_sheet/lib/src/bottom_sheets/cupertino_bottom_sheet.dart b/modal_bottom_sheet/lib/src/bottom_sheets/cupertino_bottom_sheet.dart
@@ -269,47 +269,53 @@ class _CupertinoModalTransition extends StatelessWidget {
       curve: animationCurve ?? Curves.easeOut,
     );
 
-    return AnimatedBuilder(
-      animation: curvedAnimation,
-      child: body,
-      builder: (context, child) {
-        final progress = curvedAnimation.value;
-        final yOffset = progress * paddingTop;
-        final scale = 1 - progress / 10;
-        final radius = progress == 0
-            ? 0.0
-            : (1 - progress) * startRoundCorner + progress * topRadius.x;
-        return Stack(
-          children: <Widget>[
-            Container(color: backgroundColor),
-            Transform.translate(
-              offset: Offset(0, yOffset),
-              child: Transform.scale(
-                scale: scale,
-                alignment: Alignment.topCenter,
-                child: ClipRRect(
-                  borderRadius: BorderRadius.circular(radius),
-                  child: CupertinoUserInterfaceLevel(
-                    data: CupertinoUserInterfaceLevelData.elevated,
-                    child: Builder(
-                      builder: (context) => CupertinoTheme(
-                        data: createPreviousRouteTheme(
-                          context,
-                          curvedAnimation,
-                        ),
-                        child: CupertinoUserInterfaceLevel(
-                          data: CupertinoUserInterfaceLevelData.base,
+    return AnnotatedRegion(
+      // Make sure to match the system UI overlay style to the background color
+      // we insert below. Since all other content is pushed down, the background
+      // color will always be the one visible behind the status bar.
+      value: overlayStyleFromColor(backgroundColor),
+      child: Stack(
+        children: [
+          Positioned.fill(child: ColoredBox(color: backgroundColor)),
+          AnimatedBuilder(
+            animation: curvedAnimation,
+            child: CupertinoUserInterfaceLevel(
+              data: CupertinoUserInterfaceLevelData.base,
+              child: body,
+            ),
+            builder: (context, child) {
+              final progress = curvedAnimation.value;
+              final yOffset = progress * paddingTop;
+              final scale = 1 - progress / 10;
+              final radius = progress == 0
+                  ? 0.0
+                  : (1 - progress) * startRoundCorner + progress * topRadius.x;
+              return Transform.translate(
+                offset: Offset(0, yOffset),
+                child: Transform.scale(
+                  scale: scale,
+                  alignment: Alignment.topCenter,
+                  child: ClipRRect(
+                    borderRadius: BorderRadius.circular(radius),
+                    child: CupertinoUserInterfaceLevel(
+                      data: CupertinoUserInterfaceLevelData.elevated,
+                      child: Builder(
+                        builder: (context) => CupertinoTheme(
+                          data: createPreviousRouteTheme(
+                            context,
+                            curvedAnimation,
+                          ),
                           child: child!,
                         ),
                       ),
                     ),
                   ),
                 ),
-              ),
-            ),
-          ],
-        );
-      },
+              );
+            },
+          ),
+        ],
+      ),
     );
   }
 

diff --git a/modal_bottom_sheet/pubspec.lock b/modal_bottom_sheet/pubspec.lock
@@ -63,26 +63,26 @@ packages:
     dependency: transitive
     description:
       name: leak_tracker
-      sha256: "78eb209deea09858f5269f5a5b02be4049535f568c07b275096836f01ea323fa"
+      sha256: "7f0df31977cb2c0b88585095d168e689669a2cc9b97c309665e3386f3e9d341a"
       url: "https://pub.dev"
     source: hosted
-    version: "10.0.0"
+    version: "10.0.4"
   leak_tracker_flutter_testing:
     dependency: transitive
     description:
       name: leak_tracker_flutter_testing
-      sha256: b46c5e37c19120a8a01918cfaf293547f47269f7cb4b0058f21531c2465d6ef0
+      sha256: "06e98f569d004c1315b991ded39924b21af84cf14cc94791b8aea337d25b57f8"
       url: "https://pub.dev"
     source: hosted
-    version: "2.0.1"
+    version: "3.0.3"
   leak_tracker_testing:
     dependency: transitive
     description:
       name: leak_tracker_testing
-      sha256: a597f72a664dbd293f3bfc51f9ba69816f84dcd403cdac7066cb3f6003f3ab47
+      sha256: "6ba465d5d76e67ddf503e1161d1f4a6bc42306f9d66ca1e8f079a47290fb06d3"
       url: "https://pub.dev"
     source: hosted
-    version: "2.0.1"
+    version: "3.0.1"
   lints:
     dependency: "direct dev"
     description:
@@ -111,10 +111,10 @@ packages:
     dependency: transitive
     description:
       name: meta
-      sha256: d584fa6707a52763a52446f02cc621b077888fb63b93bbcb1143a7be5a0c0c04
+      sha256: "7687075e408b093f36e6bbf6c91878cc0d4cd10f409506f7bc996f68220b9136"
       url: "https://pub.dev"
     source: hosted
-    version: "1.11.0"
+    version: "1.12.0"
   path:
     dependency: transitive
     description:
@@ -172,10 +172,10 @@ packages:
     dependency: transitive
     description:
       name: test_api
-      sha256: "5c2f730018264d276c20e4f1503fd1308dfbbae39ec8ee63c5236311ac06954b"
+      sha256: "9955ae474176f7ac8ee4e989dadfb411a58c30415bcfb648fa04b2b8a03afa7f"
       url: "https://pub.dev"
     source: hosted
-    version: "0.6.1"
+    version: "0.7.0"
   vector_math:
     dependency: transitive
     description:
@@ -188,9 +188,10 @@ packages:
     dependency: transitive
     description:
       name: vm_service
-      sha256: b3d56ff4341b8f182b96aceb2fa20e3dcb336b9f867bc0eafc0de10f1048e957
+      sha256: "3923c89304b715fb1eb6423f017651664a03bf5f4b29983627c4da791f74a4ec"
       url: "https://pub.dev"
     source: hosted
-    version: "13.0.0"
+    version: "14.2.1"
 sdks:
   dart: ">=3.3.0 <4.0.0"
+  flutter: ">=3.18.0-18.0.pre.54"