Prevent dialog from closing on outside touch in Flutter
Interview Questions practice on Codemia
Over 8,000 real interview questions from top companies, searchable by company and role.
Introduction
Some dialogs should close on outside tap, but critical dialogs should not dismiss until the user chooses an explicit action. Flutter supports this behavior directly, but production-ready dialog flows also need back-button handling and async safety. A robust implementation prevents accidental dismissals and duplicate actions.
Disable Outside-Tap Dismissal
Set barrierDismissible to false in showDialog.
Use dialogContext from the builder when popping the dialog route.
Handle System Back Navigation
Outside-touch dismissal and back-button dismissal are separate. If back should also be blocked, wrap dialog content in PopScope.
Use strict back blocking only for truly mandatory flows.
Protect Async Confirm Actions
Dialogs often trigger network requests. Without guards, users can tap confirm repeatedly.
Disable buttons during submission to prevent duplicate API calls.
UX Recommendations
Non-dismissible dialogs should still provide clear escape paths unless workflow is legally or technically mandatory.
Good practices:
- clear title and consequence message
- explicit cancel and confirm actions
- loading state for async operations
- accessible focus order for keyboard and screen reader users
This keeps strict dialog behavior understandable instead of frustrating.
Test Dialog Behavior
Widget tests should verify outside taps and back behavior.
Automated checks protect behavior through framework upgrades.
Nested Navigator Considerations
If your app uses nested navigators, pass the correct context to showDialog and Navigator.pop so only the dialog route closes. Mismatched navigator contexts can dismiss unexpected routes.
Common Pitfalls
- Setting
barrierDismissiblecorrectly but forgetting back-button behavior. - Using wrong context for
Navigator.popand closing parent route. - Allowing repeated confirm taps during async requests.
- Creating mandatory dialogs without clear user actions.
- Skipping widget tests for dismissal rules.
Summary
- Use
barrierDismissible: falseto block outside-tap dismissal. - Decide back-button behavior separately with
PopScope. - Guard async confirm flows with loading states.
- Keep strict dialogs clear and accessible.
- Add widget tests to ensure dismissal behavior stays correct.
Related reading
- Prevent screen capture in an iOS app
- Prevent screen rotation on Android
- Prevent segue in prepareForSegue method?
- Prevent the keyboard from displaying on activity start
- Prevent the keyboard from displaying on activity start
- Print Entry, CFBundleIdentifier, Does Not Exist
- Print the size megabytes of Data in Swift
- print without newline in swift
.png&w=3840&q=75)
Tackling System Design Interview Problems
A short course that equips you with the skills to approach system design interviews methodically.
Start the free courseTrack what you have practised
A free account saves your progress, solutions and study plan across every problem on Codemia.
Interview Questions practice on Codemia
Over 8,000 real interview questions from top companies, searchable by company and role.