Repository navigation
Support for sheet presentation style #42560
Description
Use case
Sheet
The sheet presentation style appears as a card that partially covers the underlying content and dims all uncovered areas to prevent interaction with them. The top edge of the parent view or a previous card is visible behind the current card to help people remember the task they suspended when they opened the card. People dismiss a card by:
- Swiping down from the top of the screen
- Swiping down from anywhere on the screen when card content is scrolled to the top
- Tapping a button
- Use a sheet for nonimmersive modal content that doesn’t enable a complex task.
https://developer.apple.com/design/human-interface-guidelines/ios/app-architecture/modality/#sheet
Proposal
Add sheet to CupertinoPageRoute class.
Activity
HansMuller commentedon Oct 14, 2019
CC @justinmc @LongCatIsLooong
justinmc commentedon Oct 14, 2019
This is being tracked as a part of #35026, but I'll keep this issue open for specifics.
I'm going to work on implementing this soon! It's good to see that there is a need for it.
justinmc commentedon Oct 17, 2019
This was brought up in #42894 under the name Modal Presentation. Also note that this is an iOS 13 feature.
yurikots commentedon Feb 2, 2020
@justinmc
Hi. Do you know when this feature will be available?
justinmc commentedon Feb 11, 2020
I wanted to get this out, but unfortunately I can't work on this in the foreseeable future due to other priorities. If anyone else wants to take a crack at it I'd be happy to help out with advice and review. I know this is important for iOS apps.
jamesdixon commentedon Feb 12, 2020
@justinmc had you started this at all?
FYI, there's also this, which appears to implement the presentation sheet style although I haven't tried it myself: https://pub.dev/packages/cupertino_stackview/
justinmc commentedon Feb 19, 2020
That's good to hear that there is a pub package, hopefully that will help a lot of people out. I looked into implementing it by modifying
CupertinoPageRoute, but I never got beyond the exploration phase in my code.xster commentedon Apr 30, 2020
Updated issue #43041
jamesblasco commentedon Jun 10, 2020
In case someone needs this, I've implemented a solution that works similar to the current Flutter modals.
https://github.com/jamesblasco/modal_bottom_sheet.
showCupertinoModalBottomSheetwill display a new sheet-presentation-style modal.You will also have to change the previous route with a new
MaterialWithModalsPageRoute, asunfortunately,
MaterialPageRoutecan only translate to aMaterialPageRouteorCupertinoPageRoute.Happy to help implementing this inside Flutter. Related issue #33798
tomasdev commentedon Aug 30, 2020
Can we make @jamesblasco pkg an official thing?
justinmc commentedon Sep 3, 2020
The package looks great. We might want to de-duplicate some code around the styling of the menu items here and in CupertinoContextMenu (see the gifs in #37778).
CC @xster for opinions on bringing this into Flutter
40 remaining items
MitchellGoodwin commentedon May 24, 2024
We've made a design doc and a proof of concept PR focused on the route blockers. The design doc is at flutter.dev/go/cupertino-bottom-sheet-routes. It's still in the early phases of getting feedback, but a side product of this work is it will be easier to mix together having multiple different route transitions in one app.
CupertinoSheetRoute (#157568)
CupertinoSheetRoute (flutter#157568)
github-actions commentedon Jan 25, 2025
This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of
flutter doctor -vand a minimal reproduction of the issue.