flutter - showDialog's barrierDismissible ignored in ios? - flutter

Question

in android, when you tap on the "barrier"/outside/background of a (material) modal dialog created using showDialog(), the dialog closes by default.
when you tap on that barrier on an iphone (physical device), the tap to close is ignored and the modal stays open.
i realize there is a "showCupertinoDialog" option, but i am trying to avoid using it (it doesn't tap-barrier-to-close either).
the flutter/dart documentation doesn't indicate any differences in expected behavior of android -vs- ios. i've included some example code that illustrates the issue, i would expect the _showMaterialDialog() dialog to close on iphones, but it does not.
any idea why this is not working? is this a bug or expected behavior? Thanks!
import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';
class dialogtest extends StatefulWidget {
#override
dialogtestState createState() => dialogtestState();
}
class dialogtestState extends State<dialogtest> {
#override
Widget build(BuildContext context) {
return SafeArea(
child: Scaffold(
appBar: AppBar(
title: Text('Dialog Demo'),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
RaisedButton(
onPressed: () {
_showMaterialDialog();
},
child: Text('Show Material Dialog'),
),
SizedBox(
height: 20,
),
RaisedButton(
onPressed: () {
_showCupertinoDialog();
},
child: Text('Show Cupertino Dialog'),
),
],
),
)));
}
void _showMaterialDialog() {
showDialog(
context: context,
barrierDismissible: true, // ********* ignored in ios, defaults to true anyway!!
builder: (context) {
return AlertDialog(
title: Text('Material Dialog'),
content: Text('This is the content of the material dialog'),
actions: <Widget>[
FlatButton(
onPressed: () {
_dismissDialog();
},
child: Text('Close')),
FlatButton(
onPressed: () {
print('HelloWorld!');
_dismissDialog();
},
child: Text('HelloWorld!'),
)
],
);
});
}
_dismissDialog() {
Navigator.pop(context);
}
void _showCupertinoDialog() {
showDialog(
context: context,
builder: (context) {
return CupertinoAlertDialog(
title: Text('Cupertino Dialog'),
content: Text('This is the content of the cupertino dialog'),
actions: <Widget>[
FlatButton(
onPressed: () {
_dismissDialog();
},
child: Text('Close')),
FlatButton(
onPressed: () {
print('HelloWorld!');
_dismissDialog();
},
child: Text('HelloWorld!'),
)
],
);
});
}
}

Answer 1

i figured it out in case anyone runs into this behavior randomly.
i was using flutter 1.7 (and working with android only) when I created the project. in order to support "unfocusing" of a text field when tapping outside of it, i wrapped the whole project in a GestureDetector with the instructions from here:
https://flutter360.dev/dismiss-keyboard-form-lose-focus
Everything worked perfectly. When I moved the app to a mac for iOS testing, i did a new install of flutter which came with v1.9.1+hotfix.6. I guess something in flutter changed from 1.7 -> 1.9.1 which breaks this unsupported implementation. not considering the difference between my windows/android flutter version (where it worked) to my mac/ios version (where it did not work), i assumed it was an iOS thing. Once I upgraded flutter on my PC to 1.9.1 the dialogs were no longer dismissible on my android phone.
I still need/want a way to tap-to-dismiss the keyboard from a text field. I am trying out the Listener solution from here which seems to be working as expected so far:
Flutter. A way for TextField to detect tap outside
I guess this is an exercise in side-effects of creative solutions to functionality not provided out of box by the framework coupled with understanding the impacts of updating the framework.