Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Tapping a modal bottom sheet should not dismiss it by default #32528

Merged
merged 2 commits into from
May 15, 2019

Conversation

darrenaustin
Copy link
Contributor

Description

As pointed out in #20720, our current implementation of the modal bottom sheets aren't following the Material spec, as tapping on a bottom sheet itself will dismiss the sheet. From the Material Guidelines, it should be dismissed by:

  • Tapping a menu item or action within the bottom sheet
  • Tapping the scrim
  • Swiping the sheet down
  • Using a close affordance within the bottom sheet’s top app bar, if available

The app would be responsible for the first and last as it would be providing the controls in the sheet. The other two are already handled by the bottom sheet implementation, however we also dismiss on a tap.

This PR removes the GestureDetector responsible for dismissing the sheet when the user taps on it. While this doesn't technically break the API, it does change the behavior of modal bottom sheets to bring it in line with the spec.

In the unlikely event that an application actually wanted this behavior they could wrap their bottom sheet content in a GestureDetector to replicate the previous behavior:

GestureDetector(
   onTap: () => Navigator.pop(context),
   behavior: HitTestBehavior.opaque,
   child: <bottom sheet contents>,
);

Related Issues

Fixes: #20720

Tests

Modified the test to check to see if a tap doesn't dismiss the sheet.

Checklist

Before you create this PR confirm that it meets all requirements listed below by checking the relevant checkboxes ([x]). This will ensure a smooth and quick review process.

  • I read the Contributor Guide and followed the process outlined there for submitting PRs.
  • I signed the CLA.
  • I read and followed the Flutter Style Guide, including Features we expect every widget to implement.
  • I updated/added relevant documentation (doc comments with ///).
  • All existing and new tests are passing.
  • The analyzer (flutter analyze --flutter-repo) does not report any problems on my PR.
  • I am willing to follow-up on review comments in a timely manner.

Breaking Change

Does your PR require Flutter developers to manually update their apps to accommodate your change?

- Removed the GestureDetector from the modal bottom sheet that dismissed it on tap.
- Updated the test for this case.
- Updated the demo example to remove tapping to dismiss from the message.
- Renamed modal_bottom_sheet_test -> bottom_sheet_test as it included tests for both persistent and modal bottom sheets.
@darrenaustin darrenaustin added framework flutter/packages/flutter repository. See also f: labels. f: material design flutter/packages/flutter/material repository. labels May 10, 2019
@darrenaustin darrenaustin requested a review from HansMuller May 10, 2019 23:54
…tom sheet as tapping in the body no longer does that.
Copy link
Contributor

@HansMuller HansMuller left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@darrenaustin darrenaustin merged commit 3d93f24 into flutter:master May 15, 2019
@darrenaustin darrenaustin deleted the modal_bottom_sheet_dimiss branch May 15, 2019 22:50
@github-actions github-actions bot locked as resolved and limited conversation to collaborators Aug 6, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
f: material design flutter/packages/flutter/material repository. framework flutter/packages/flutter repository. See also f: labels.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Modal bottom sheets should not dismiss on tapping the sheet body
3 participants