Add `clipRSuperellipse`, and use them for dialogs #161111

dkwingsmt · 2025-01-03T22:37:09Z

This PR makes Flutter support clipRSuperellipse, and apply it to CupertinoAlertDialog.

Hit tests related to RSuperellipse are performed based on its bounding box, since the computation is too complicated and pixel perfect hit test is not needed practically.

Native:

Native vs before: (The two screenshots are stacked and offset by (1, 1) pixels. See the bottom right corner for comparison.)

Native vs after:

After only:

Pre-launch Checklist

I read the Contributor Guide and followed the process outlined there for submitting PRs.
I read the Tree Hygiene wiki page, which explains my responsibilities.
I read and followed the Flutter Style Guide, including Features we expect every widget to implement.
I signed the CLA.
I listed at least one issue that this PR fixes in the description above.
I updated/added relevant documentation (doc comments with ///).
I added new tests to check the change I am making, or this PR is test-exempt.
I followed the breaking change policy and added Data Driven Fixes where supported.
All existing and new tests are passing.

If you need help, consider asking for advice on the #hackers-new channel on Discord.

flutter-dashboard · 2025-03-03T22:52:19Z

This pull request has been changed to a draft. The currently pending flutter-gold status will not be able to resolve until a new commit is pushed or the change is marked ready for review again.

For more guidance, visit Writing a golden file test for package:flutter.

Reviewers: Read the Tree Hygiene page and make sure this patch meets those guidelines before LGTMing.

MitchellGoodwin

None dialog code LGTM. Left one question about the cancel button on action sheets.

Looks like tests are failing due to trying to find a ClpRRect in a dialog, and being unable to. I don't believe that is a common way to test dialogs outside of our use cases, but should we call this out as a breaking change? I don't think we should not make this change because of that at least.

MitchellGoodwin · 2025-03-04T21:49:00Z

packages/flutter/lib/src/cupertino/dialog.dart

    final List<Widget> children = <Widget>[
      Flexible(
-        child: ClipRRect(
+        child: ClipRSuperellipse(


Should we apply this to _buildCancelButton as well? It may look odd if it's not using the same shape.

…utter#161111)

flutter/flutter@2578d97...321fbc0 2025-03-06 engine-flutter-autoroll@skia.org Roll Skia from fefecd49e03a to ccd8cc23aa94 (1 revision) (flutter/flutter#164712) 2025-03-06 mdebbar@google.com [web] Detect scrollable semantics nodes more reliably (flutter/flutter#164491) 2025-03-06 matt.kosarek@canonical.com [windows] wire the focus request and the focus events through the Windows platform (flutter/flutter#164296) 2025-03-06 engine-flutter-autoroll@skia.org Roll Skia from 02897747c7d5 to fefecd49e03a (1 revision) (flutter/flutter#164701) 2025-03-06 engine-flutter-autoroll@skia.org Roll Skia from e315b0ab7c84 to 02897747c7d5 (1 revision) (flutter/flutter#164677) 2025-03-06 engine-flutter-autoroll@skia.org Roll Skia from 0c3880f94970 to e315b0ab7c84 (1 revision) (flutter/flutter#164669) 2025-03-06 jonahwilliams@google.com [Impeller] use device private on non-iOS devices. (flutter/flutter#164601) 2025-03-05 engine-flutter-autoroll@skia.org Roll Skia from 43294a662fd0 to 0c3880f94970 (1 revision) (flutter/flutter#164661) 2025-03-05 codefu@google.com Add a workflow (only triggered from rest events) for hasing experiment (flutter/flutter#164657) 2025-03-05 engine-flutter-autoroll@skia.org Roll Skia from 4cf9f0b77d41 to 43294a662fd0 (4 revisions) (flutter/flutter#164649) 2025-03-05 50643541+Mairramer@users.noreply.github.com Adds animateToItem to the CarouselController (flutter/flutter#162694) 2025-03-05 30870216+gaaclarke@users.noreply.github.com Cleanup content context (flutter/flutter#164229) 2025-03-05 34465683+rkishan516@users.noreply.github.com Fix: Update CupertinoSheetRoute transition rounded corner (flutter/flutter#163700) 2025-03-05 jonahwilliams@google.com [Impeller] fix macOS managed memory. (flutter/flutter#164635) 2025-03-05 jacksongardner@google.com [skwasm] Clear font collection cache when font is loaded manually. (flutter/flutter#164588) 2025-03-05 victorsanniay@gmail.com Fix race condition causing crash when interacting with an animating scrollable (flutter/flutter#164392) 2025-03-05 58529443+srujzs@users.noreply.github.com Use dwds 24.3.6 and pass uri for the reload scripts path to FrontendServerDdcLibraryBundleProvider (flutter/flutter#164582) 2025-03-05 engine-flutter-autoroll@skia.org Roll Packages from 9e4684e to abba683 (8 revisions) (flutter/flutter#164630) 2025-03-05 engine-flutter-autoroll@skia.org Roll Skia from 7e4323f72c9d to 4cf9f0b77d41 (1 revision) (flutter/flutter#164622) 2025-03-05 harri.kirik@lab.mobi Fix to Linux_pixel_7pro integration_ui_keyboard_resize test flakiness (flutter/flutter#162308) 2025-03-05 engine-flutter-autoroll@skia.org Roll Skia from 03a3f653d64e to 7e4323f72c9d (1 revision) (flutter/flutter#164599) 2025-03-05 34871572+gmackall@users.noreply.github.com Implement `clipPath` Mutator for hcpp (flutter/flutter#164525) 2025-03-05 98614782+auto-submit[bot]@users.noreply.github.com Reverts "[Impeller] use DeviceLocal textures for gifs on non-iOS devices. (#164573)" (flutter/flutter#164600) 2025-03-05 jonahwilliams@google.com [macos] prefer integrated GPU. (flutter/flutter#164569) 2025-03-05 muhatashim@google.com Enforce minSdk constraint for Android Flutter (flutter/flutter#164251) 2025-03-05 dkwingsmt@users.noreply.github.com Add `clipRSuperellipse`, and use them for dialogs (flutter/flutter#161111) 2025-03-05 engine-flutter-autoroll@skia.org Roll Skia from 46705a22edc3 to 03a3f653d64e (1 revision) (flutter/flutter#164590) 2025-03-05 psturm@esri.com when resetting FlutterPlatformViewsController, clear out some additional internal state to prevent it from carrying over across a Hot Restart (flutter/flutter#164456) 2025-03-05 engine-flutter-autoroll@skia.org Roll Fuchsia Linux SDK from Rt6pxGFLVAJHduM0V... to fhm5z889sA5T1AQao... (flutter/flutter#164583) If this roll has caused a breakage, revert this CL and stop the roller using the controls here: https://autoroll.skia.org/r/flutter-packages Please CC stuartmorgan@google.com,tarrinneal@google.com on the revert to ensure that a human is aware of the problem. To file a bug in Packages: https://github.com/flutter/flutter/issues/new/choose To report a problem with the AutoRoller itself, please file a bug: https://issues.skia.org/issues/new?component=1389291&template=1850622 Documentation for the AutoRoller is here: https://skia.googlesource.com/buildbot/+doc/main/autoroll/README.md

rydmike · 2025-04-08T13:11:21Z

Awesome @dkwingsmt much much appreciated! 🥳

I tweeted about it here: https://x.com/RydMike/status/1909592718696644961

And it is now included in my Squircle study repo here: https://github.com/rydmike/squircle_study

I noticed there is no WEB support for this shape, does not break the build, but seems to fall back to just using RoundedRectangleBorder, https://rydmike.com/squircle/latest/

Are there plans to add support for WEB builds?

dkwingsmt · 2025-04-08T16:40:20Z

@rydmike Thank you so much! I'm also super excited about this. It has been such a long journey! Your continuous support (as well as from everyone) has been my motivation.

I definitely want to add support to Web, but I'd like to test its performance before actually landing it. The Web needs to use the Bezier paths. On the one hand, figma_squircle, which uses paths, was known to have poor performance. On the other hand, my algorithm is different, and the Web browser might be super efficient rendering Bezier paths. So there might still be a chance.

…utter#161111)

flutter/flutter@2578d97...321fbc0 2025-03-06 engine-flutter-autoroll@skia.org Roll Skia from fefecd49e03a to ccd8cc23aa94 (1 revision) (flutter/flutter#164712) 2025-03-06 mdebbar@google.com [web] Detect scrollable semantics nodes more reliably (flutter/flutter#164491) 2025-03-06 matt.kosarek@canonical.com [windows] wire the focus request and the focus events through the Windows platform (flutter/flutter#164296) 2025-03-06 engine-flutter-autoroll@skia.org Roll Skia from 02897747c7d5 to fefecd49e03a (1 revision) (flutter/flutter#164701) 2025-03-06 engine-flutter-autoroll@skia.org Roll Skia from e315b0ab7c84 to 02897747c7d5 (1 revision) (flutter/flutter#164677) 2025-03-06 engine-flutter-autoroll@skia.org Roll Skia from 0c3880f94970 to e315b0ab7c84 (1 revision) (flutter/flutter#164669) 2025-03-06 jonahwilliams@google.com [Impeller] use device private on non-iOS devices. (flutter/flutter#164601) 2025-03-05 engine-flutter-autoroll@skia.org Roll Skia from 43294a662fd0 to 0c3880f94970 (1 revision) (flutter/flutter#164661) 2025-03-05 codefu@google.com Add a workflow (only triggered from rest events) for hasing experiment (flutter/flutter#164657) 2025-03-05 engine-flutter-autoroll@skia.org Roll Skia from 4cf9f0b77d41 to 43294a662fd0 (4 revisions) (flutter/flutter#164649) 2025-03-05 50643541+Mairramer@users.noreply.github.com Adds animateToItem to the CarouselController (flutter/flutter#162694) 2025-03-05 30870216+gaaclarke@users.noreply.github.com Cleanup content context (flutter/flutter#164229) 2025-03-05 34465683+rkishan516@users.noreply.github.com Fix: Update CupertinoSheetRoute transition rounded corner (flutter/flutter#163700) 2025-03-05 jonahwilliams@google.com [Impeller] fix macOS managed memory. (flutter/flutter#164635) 2025-03-05 jacksongardner@google.com [skwasm] Clear font collection cache when font is loaded manually. (flutter/flutter#164588) 2025-03-05 victorsanniay@gmail.com Fix race condition causing crash when interacting with an animating scrollable (flutter/flutter#164392) 2025-03-05 58529443+srujzs@users.noreply.github.com Use dwds 24.3.6 and pass uri for the reload scripts path to FrontendServerDdcLibraryBundleProvider (flutter/flutter#164582) 2025-03-05 engine-flutter-autoroll@skia.org Roll Packages from 9e4684e to abba683 (8 revisions) (flutter/flutter#164630) 2025-03-05 engine-flutter-autoroll@skia.org Roll Skia from 7e4323f72c9d to 4cf9f0b77d41 (1 revision) (flutter/flutter#164622) 2025-03-05 harri.kirik@lab.mobi Fix to Linux_pixel_7pro integration_ui_keyboard_resize test flakiness (flutter/flutter#162308) 2025-03-05 engine-flutter-autoroll@skia.org Roll Skia from 03a3f653d64e to 7e4323f72c9d (1 revision) (flutter/flutter#164599) 2025-03-05 34871572+gmackall@users.noreply.github.com Implement `clipPath` Mutator for hcpp (flutter/flutter#164525) 2025-03-05 98614782+auto-submit[bot]@users.noreply.github.com Reverts "[Impeller] use DeviceLocal textures for gifs on non-iOS devices. (#164573)" (flutter/flutter#164600) 2025-03-05 jonahwilliams@google.com [macos] prefer integrated GPU. (flutter/flutter#164569) 2025-03-05 muhatashim@google.com Enforce minSdk constraint for Android Flutter (flutter/flutter#164251) 2025-03-05 dkwingsmt@users.noreply.github.com Add `clipRSuperellipse`, and use them for dialogs (flutter/flutter#161111) 2025-03-05 engine-flutter-autoroll@skia.org Roll Skia from 46705a22edc3 to 03a3f653d64e (1 revision) (flutter/flutter#164590) 2025-03-05 psturm@esri.com when resetting FlutterPlatformViewsController, clear out some additional internal state to prevent it from carrying over across a Hot Restart (flutter/flutter#164456) 2025-03-05 engine-flutter-autoroll@skia.org Roll Fuchsia Linux SDK from Rt6pxGFLVAJHduM0V... to fhm5z889sA5T1AQao... (flutter/flutter#164583) If this roll has caused a breakage, revert this CL and stop the roller using the controls here: https://autoroll.skia.org/r/flutter-packages Please CC stuartmorgan@google.com,tarrinneal@google.com on the revert to ensure that a human is aware of the problem. To file a bug in Packages: https://github.com/flutter/flutter/issues/new/choose To report a problem with the AutoRoller itself, please file a bug: https://issues.skia.org/issues/new?component=1389291&template=1850622 Documentation for the AutoRoller is here: https://skia.googlesource.com/buildbot/+doc/main/autoroll/README.md

github-actions bot added framework flutter/packages/flutter repository. See also f: labels. f: cupertino flutter/packages/flutter/cupertino repository labels Jan 3, 2025

dkwingsmt force-pushed the rse-cupertino branch from 5233cdf to 1c69325 Compare February 21, 2025 18:57

dkwingsmt changed the title ~~[Cupertino] Use rounded superellipse for dialogs and action sheets~~ [Cupertino] Use rounded superellipse for dialogs Feb 28, 2025

dkwingsmt marked this pull request as ready for review March 3, 2025 22:23

dkwingsmt marked this pull request as draft March 3, 2025 22:49

Impl

e19285a

dkwingsmt force-pushed the rse-cupertino branch from 08a0416 to e19285a Compare March 3, 2025 23:10

github-actions bot removed engine flutter/engine related. See also e: labels. platform-web Web applications specifically e: impeller Impeller rendering backend issues and features requests labels Mar 3, 2025

dkwingsmt added 2 commits March 3, 2025 15:20

Fix doc

e836e9d

Tests

826cc8c

dkwingsmt marked this pull request as ready for review March 3, 2025 23:29

Fix compile

ad1d770

dkwingsmt changed the title ~~[Cupertino] Use rounded superellipse for dialogs~~ Add clipRSuperellipse, and use them for dialogs Mar 3, 2025

dkwingsmt requested a review from MitchellGoodwin March 3, 2025 23:42

Format

64b0dcb

MitchellGoodwin reviewed Mar 4, 2025

View reviewed changes

Fix test

5182c32

engine-flutter-autoroll mentioned this pull request Mar 5, 2025

Roll Flutter from 04d39343a691 to 296c54f7a001 (42 revisions) flutter/packages#8797

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 5, 2025

0357b45 Add clipRSuperellipse, and use them for dialogs (flutter/fl…

d938bfc

…utter#161111)

engine-flutter-autoroll mentioned this pull request Mar 5, 2025

Roll Flutter from 04d39343a691 to 5ca20d8d0e78 (43 revisions) flutter/packages#8798

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 5, 2025

0357b45 Add clipRSuperellipse, and use them for dialogs (flutter/fl…

11c100b

…utter#161111)

engine-flutter-autoroll mentioned this pull request Mar 5, 2025

Roll Flutter from 04d39343a691 to 86e4c12a068a (44 revisions) flutter/packages#8799

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 5, 2025

0357b45 Add clipRSuperellipse, and use them for dialogs (flutter/fl…

ef4926a

…utter#161111)

engine-flutter-autoroll mentioned this pull request Mar 5, 2025

Manual roll Flutter from 04d39343a691 to 57cddce92438 (45 revisions) flutter/packages#8800

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 5, 2025

0357b45 Add clipRSuperellipse, and use them for dialogs (flutter/fl…

3752e6f

…utter#161111)

engine-flutter-autoroll mentioned this pull request Mar 5, 2025

Roll Flutter from 04d39343a691 to 57cddce92438 (45 revisions) flutter/packages#8801

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 5, 2025

0357b45 Add clipRSuperellipse, and use them for dialogs (flutter/fl…

c9da7ad

…utter#161111)

engine-flutter-autoroll mentioned this pull request Mar 5, 2025

Roll Flutter from 04d39343a691 to 1e9676fc9527 (46 revisions) flutter/packages#8802

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 5, 2025

0357b45 Add clipRSuperellipse, and use them for dialogs (flutter/fl…

9c76a7d

…utter#161111)

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 6, 2025

0357b45 Add clipRSuperellipse, and use them for dialogs (flutter/fl…

f9a3f7d

…utter#161111)

engine-flutter-autoroll mentioned this pull request Mar 6, 2025

Roll Flutter from 2578d97f32c8 to 099e6d39fe38 (27 revisions) flutter/packages#8806

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 6, 2025

0357b45 Add clipRSuperellipse, and use them for dialogs (flutter/fl…

08183ee

…utter#161111)

engine-flutter-autoroll mentioned this pull request Mar 6, 2025

Roll Flutter from 2578d97f32c8 to d778ed25a485 (28 revisions) flutter/packages#8807

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 6, 2025

0357b45 Add clipRSuperellipse, and use them for dialogs (flutter/fl…

1ec5a1f

…utter#161111)

engine-flutter-autoroll mentioned this pull request Mar 6, 2025

Roll Flutter from 2578d97f32c8 to 321fbc0e7e81 (29 revisions) flutter/packages#8808

Merged

dkwingsmt mentioned this pull request Mar 7, 2025

RoundSuperellipse algorithm v3: Ultrawideband heuristic formula #164755

Merged

9 tasks

Piinks mentioned this pull request Mar 7, 2025

Flutter Notable Commits - 2025 #161460

Open

yakagami mentioned this pull request Mar 11, 2025

☂️ Move the material and cupertino packages outside of Flutter #101479

Open

dkwingsmt deleted the rse-cupertino branch April 8, 2025 16:37

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request May 20, 2025

0357b45 Add clipRSuperellipse, and use them for dialogs (flutter/fl…

9e9e02d

…utter#161111)

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request May 20, 2025

0357b45 Add clipRSuperellipse, and use them for dialogs (flutter/fl…

a012214

…utter#161111)

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request May 21, 2025

0357b45 Add clipRSuperellipse, and use them for dialogs (flutter/fl…

4943cf2

…utter#161111)

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Add `clipRSuperellipse`, and use them for dialogs #161111

Add `clipRSuperellipse`, and use them for dialogs #161111

Uh oh!

dkwingsmt commented Jan 3, 2025 •

edited

Loading

Uh oh!

flutter-dashboard bot commented Mar 3, 2025

Uh oh!

MitchellGoodwin left a comment

Uh oh!

MitchellGoodwin Mar 4, 2025

Uh oh!

rydmike commented Apr 8, 2025

Uh oh!

dkwingsmt commented Apr 8, 2025 •

edited

Loading

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Add clipRSuperellipse, and use them for dialogs #161111

Add clipRSuperellipse, and use them for dialogs #161111

Uh oh!

Conversation

dkwingsmt commented Jan 3, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Pre-launch Checklist

Uh oh!

flutter-dashboard bot commented Mar 3, 2025

Uh oh!

MitchellGoodwin left a comment

Choose a reason for hiding this comment

Uh oh!

MitchellGoodwin Mar 4, 2025

Choose a reason for hiding this comment

Uh oh!

rydmike commented Apr 8, 2025

Uh oh!

dkwingsmt commented Apr 8, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Add `clipRSuperellipse`, and use them for dialogs #161111

Add `clipRSuperellipse`, and use them for dialogs #161111

dkwingsmt commented Jan 3, 2025 •

edited

Loading

dkwingsmt commented Apr 8, 2025 •

edited

Loading