Repository: flutter/flutter
Pull request #166911: Add barrierColor property to showCupertinoDialog
Author: login: masal9pse
Labels: name: framework
description: flutter/packages/flutter repository. See also f: labels.
name: f: cupertino
description: flutter/packages/flutter/cupertino repository
name: f: routes
description: Navigator, Router, and related APIs.
Created: 2025-04-10T15:03:18Z | Merged: 2025-04-30T19:39:38Z

implimented https://github.com/flutter/flutter/issues/166910


https://github.com/user-attachments/assets/fe9aa2ce-b8a5-4458-b04a-781763959169

## How to Verify
- Set enableDrag: false in CupertinoSheetRoute or showCupertinoSheet.

```diff

showCupertinoDialog<void>(
      context: context,
+      barrierColor: CupertinoColors.activeOrange.withValues(alpha: 0.5),
      builder:
          (BuildContext context) => CupertinoAlertDialog(
            title: const Text('Alert'),
            content: const Text('Proceed with destructive action?'),
            actions: <CupertinoDialogAction>[
              CupertinoDialogAction(
                /// This parameter indicates this action is the default,
                /// and turns the action's text to bold text.
                isDefaultAction: true,
                onPressed: () {
                  Navigator.pop(context);
                },
                child: const Text('No'),
              ),
              CupertinoDialogAction(
                /// This parameter indicates the action would perform
                /// a destructive action such as deletion, and turns
                /// the action's text color to red.
                isDestructiveAction: true,
                onPressed: () {
                  Navigator.pop(context);
                },
                child: const Text('Yes'),
              ),
            ],
          ),
    );

```

- The following is a screenshot of `examples/api/lib/cupertino/dialog/cupertino_alert_dialog.0.dart` after adding `barrierColor: CupertinoColors.activeOrange.withValues(alpha: 0.5),`.

## Pre-launch Checklist

- [x] I read the [Contributor Guide] and followed the process outlined there for submitting PRs.
- [x] I read the [Tree Hygiene] wiki page, which explains my responsibilities.
- [x] I read and followed the [Flutter Style Guide], including [Features we expect every widget to implement].
- [x] I signed the [CLA].
- [x] I listed at least one issue that this PR fixes in the description above.
- [ ] I updated/added relevant documentation (doc comments with `///`).
- [x] I added new tests to check the change I am making, or this PR is [test-exempt].
- [x] I followed the [breaking change policy] and added [Data Driven Fixes] where supported.
- [x] All existing and new tests are passing.

If you need help, consider asking for advice on the #hackers-new channel on [Discord].

<!-- Links -->
[Contributor Guide]: https://github.com/flutter/flutter/blob/main/docs/contributing/Tree-hygiene.md#overview
[Tree Hygiene]: https://github.com/flutter/flutter/blob/main/docs/contributing/Tree-hygiene.md
[test-exempt]: https://github.com/flutter/flutter/blob/main/docs/contributing/Tree-hygiene.md#tests
[Flutter Style Guide]: https://github.com/flutter/flutter/blob/main/docs/contributing/Style-guide-for-Flutter-repo.md
[Features we expect every widget to implement]: https://github.com/flutter/flutter/blob/main/docs/contributing/Style-guide-for-Flutter-repo.md#features-we-expect-every-widget-to-implement
[CLA]: https://cla.developers.google.com/
[flutter/tests]: https://github.com/flutter/tests
[breaking change policy]: https://github.com/flutter/flutter/blob/main/docs/contributing/Tree-hygiene.md#handling-breaking-changes
[Discord]: https://github.com/flutter/flutter/blob/main/docs/contributing/Chat.md
[Data Driven Fixes]: https://github.com/flutter/flutter/blob/main/docs/contributing/Data-driven-Fixes.md



Diff:
diff --git a/packages/flutter/lib/src/cupertino/route.dart b/packages/flutter/lib/src/cupertino/route.dart
index fdfe92b074200..436acb25bf0bf 100644
--- a/packages/flutter/lib/src/cupertino/route.dart
+++ b/packages/flutter/lib/src/cupertino/route.dart
@@ -1410,6 +1410,7 @@ Future<T?> showCupertinoDialog<T>({
   required BuildContext context,
   required WidgetBuilder builder,
   String? barrierLabel,
+  Color? barrierColor,
   bool useRootNavigator = true,
   bool barrierDismissible = false,
   RouteSettings? routeSettings,
@@ -1422,7 +1423,7 @@ Future<T?> showCupertinoDialog<T>({
       context: context,
       barrierDismissible: barrierDismissible,
       barrierLabel: barrierLabel,
-      barrierColor: CupertinoDynamicColor.resolve(kCupertinoModalBarrierColor, context),
+      barrierColor: barrierColor,
       settings: routeSettings,
       anchorPoint: anchorPoint,
       requestFocus: requestFocus,
diff --git a/packages/flutter/test/cupertino/dialog_test.dart b/packages/flutter/test/cupertino/dialog_test.dart
index d3971ca8b13f8..b578c5f1f1aa6 100644
--- a/packages/flutter/test/cupertino/dialog_test.dart
+++ b/packages/flutter/test/cupertino/dialog_test.dart
@@ -1737,6 +1737,60 @@ void main() {
     semantics.dispose();
   });
 
+  testWidgets('showCupertinoDialog - custom barrierColor', (WidgetTester tester) async {
+    await tester.pumpWidget(
+      CupertinoApp(
+        home: Builder(
+          builder: (BuildContext context) {
+            return Center(
+              child: Column(
+                children: <Widget>[
+                  CupertinoButton(
+                    child: const Text('Custom BarrierColor'),
+                    onPressed: () {
+                      showCupertinoDialog<void>(
+                        context: context,
+                        barrierColor: Colors.red,
+                        builder: (BuildContext context) {
+                          return CupertinoAlertDialog(
+                            title: const Text('Title'),
+                            content: const Text('Content'),
+                            actions: <Widget>[
+                              const CupertinoDialogAction(child: Text('Yes')),
+                              CupertinoDialogAction(
+                                child: const Text('No'),
+                                onPressed: () {
+                                  Navigator.pop(context);
+                                },
+                              ),
+                            ],
+                          );
+                        },
+                      );
+                    },
+                  ),
+                ],
+              ),
+            );
+          },
+        ),
+      ),
+    );
+
+    await tester.tap(find.text('Custom BarrierColor'));
+    await tester.pumpAndSettle();
+    expect(tester.widget<ModalBarrier>(find.byType(ModalBarrier).last).color, equals(Colors.red));
+
+    await tester.tap(find.text('No'));
+    await tester.pumpAndSettle();
+    expect(
+      find.byWidgetPredicate(
+        (Widget widget) => widget is ModalBarrier && widget.color == Colors.red,
+      ),
+      findsNothing,
+    );
+  });
+
   testWidgets('CupertinoDialogRoute is state restorable', (WidgetTester tester) async {
     await tester.pumpWidget(
       const CupertinoApp(restorationScopeId: 'app', home: _RestorableDialogTestWidget()),


Reviews:
user: login: dkwingsmt
body: LGTM, thank you!
state: APPROVED
author_association: CONTRIBUTOR
submitted_at: 2025-04-24T18:04:25Z
user: login: chunhtai
body: LGTM
state: APPROVED
author_association: CONTRIBUTOR
submitted_at: 2025-04-24T18:04:56Z
user: login: Renzo-Olivares
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-04-24T18:05:35Z
user: login: dkwingsmt
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-04-24T18:08:48Z
user: login: masal9pse
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-04-24T18:44:39Z

Review comments:
diff_hunk: @@ -1422,7 +1423,7 @@ Future<T?> showCupertinoDialog<T>({
       context: context,
       barrierDismissible: barrierDismissible,
       barrierLabel: barrierLabel,
-      barrierColor: CupertinoDynamicColor.resolve(kCupertinoModalBarrierColor, context),
path: packages/flutter/lib/src/cupertino/route.dart
user: login: Renzo-Olivares
body: maybe this should be `barrierColor ?? CupertinoDynamicColor.resolve(kCupertinoModalBarrierColor, context)`?
created_at: 2025-04-24T18:05:35Z
author_association: CONTRIBUTOR
diff_hunk: @@ -1422,7 +1423,7 @@ Future<T?> showCupertinoDialog<T>({
       context: context,
       barrierDismissible: barrierDismissible,
       barrierLabel: barrierLabel,
-      barrierColor: CupertinoDynamicColor.resolve(kCupertinoModalBarrierColor, context),
path: packages/flutter/lib/src/cupertino/route.dart
user: login: dkwingsmt
body: It should be because `CupertinoDialogRoute`'s `barrierColor` defaults to the same value.
created_at: 2025-04-24T18:08:41Z
author_association: CONTRIBUTOR
diff_hunk: @@ -1422,7 +1423,7 @@ Future<T?> showCupertinoDialog<T>({
       context: context,
       barrierDismissible: barrierDismissible,
       barrierLabel: barrierLabel,
-      barrierColor: CupertinoDynamicColor.resolve(kCupertinoModalBarrierColor, context),
path: packages/flutter/lib/src/cupertino/route.dart
user: login: masal9pse
body: > It should be because CupertinoDialogRoute's barrierColor defaults to the same value.

Yes, that’s the reason it was removed.
created_at: 2025-04-24T18:44:32Z
author_association: CONTRIBUTOR

PR comments:
user: login: flutter-dashboard[bot]
created_at: 2025-04-10T15:03:22Z
body: It looks like this pull request may not have tests. Please make sure to add tests or get an explicit test exemption before merging.

If you are not sure if you need tests, consider this rule of thumb: the purpose of a test is to make sure someone doesn't accidentally revert the fix. Ask yourself, **is there anything in your PR that you feel it is important we not accidentally revert back to how it was before your fix?**

__Reviewers__: Read the [Tree Hygiene page](https://github.com/flutter/flutter/blob/master/docs/contributing/Tree-hygiene.md#how-to-review-code) and make sure this patch meets those guidelines before LGTMing.If you believe this PR qualifies for a test exemption, contact "@test-exemption-reviewer" in the #hackers channel in [Discord](https://github.com/flutter/flutter/blob/master/docs/contributing/Chat.md) (don't just cc them here, they won't see it!). The test exemption team is a small volunteer group, so _all_ reviewers should feel empowered to ask for tests, without delegating that responsibility entirely to the test exemption group.
author_association: NONE
user: login: dkwingsmt
created_at: 2025-04-23T18:09:08Z
body: Hi, thanks for you contribution! Can you add a unit test?
author_association: CONTRIBUTOR
user: login: auto-submit[bot]
created_at: 2025-04-24T18:05:32Z
body: autosubmit label was removed for flutter/flutter/166911, because - The status or check suite [Linux analyze](https://cr-buildbucket.appspot.com/build/8716696492847398097) has failed. Please fix the issues identified (or deflake) before re-applying this label.

author_association: CONTRIBUTOR
user: login: dkwingsmt
created_at: 2025-04-24T18:06:12Z
body: The analyzer is failing due to format errors, which can be fixed by running `dart fix .` under `packages/flutter`.
author_association: CONTRIBUTOR
user: login: auto-submit[bot]
created_at: 2025-04-24T22:04:11Z
body: autosubmit label was removed for flutter/flutter/166911, because - The status or check suite [Google testing](http://frob/#/flutter/presubmit?pr=166911) has failed. Please fix the issues identified (or deflake) before re-applying this label.

author_association: CONTRIBUTOR