防止 Flutter 中的外部触摸对话框关闭

问题描述 投票:0回答:9

在 Flutter 中,我在异步任务期间为加载器编写了一个简单的对话框。当我触摸外部对话框已关闭时,我怎样才能停止这种行为?

代码

  showDialog(
    context: context,
    builder: (_) => new Dialog(
          child: new Container(
            alignment: FractionalOffset.center,
            height: 80.0,
            padding: const EdgeInsets.all(20.0),
            child: new Row(
              mainAxisSize: MainAxisSize.min,
              children: [
                new CircularProgressIndicator(),
                new Padding(
                  padding: new EdgeInsets.only(left: 10.0),
                  child: new Text("Loading"),
                ),
              ],
            ),
          ),
        ));
android ios dialog dart flutter
9个回答
307
投票

有一个名为

barrierDismissible
的属性,您可以将其传递给
showDialog
;这使得对话框在外部单击时可关闭或不关闭

showDialog(
  barrierDismissible: false,
  builder: ...
)

56
投票

如果您想防止按下后退按钮时关闭对话框,请参阅下面的代码。您必须将 AlertDialog 包装在 WillPopScope 小部件中,并使用返回 Future.value(false) 的函数设置 onWillPop 属性值。

showDialog(
      barrierDismissible: false,
      context: context,
      builder: (BuildContext context) {
        return WillPopScope(
            onWillPop: () => Future.value(false),
            child:AlertDialog(
            title: new Text("Alert Title"),
            content: new SingleChildScrollView(
              child: Container(),),
            actions: <Widget>[
              new FlatButton(
                child: new Text("Close"),
                onPressed: () {
                },
              ),
            ],
          )
        )
      },
    );

19
投票

只需添加此行

barrierDismissible: false,

就像

       showDialog(
        barrierDismissible: false,
        context: context,
        builder: (BuildContext context) {
          return AlertDialog(
            title: Text(
              "Classes",
              style: TextStyle(
                  fontSize: 24, color: Colors.black, fontFamily: 'intel'),
            ),
            content: setupAlertDialoadClassList(
                context, listClasses, Icons.class__outlined, 0),
          );
        });

7
投票

barrierDismissible: false,

按照我下面的描述使用这个。 显示对话框( 屏障可关闭:假, 构建器 // 代码 //


5
投票

这将禁用设备导航

showDialog(
      barrierDismissible: false,
      context: context,
      builder: (BuildContext context) {
        return WillPopScope(
            onWillPop: () async => false,
            child:AlertDialog(
            title: new Text("Alert Title"),
            content: new SingleChildScrollView(
              child: Container(),),
            actions: <Widget>[
              new FlatButton(
                child: new Text("Close"),
                onPressed: () {
                },
              ),
            ],
          )
        )
      },
    );

2
投票

始终使用顶级 flutter 包,例如 get

Get.generalDialog(pageBuilder: (BuildContext context, Animation<double> animation, Animation<double> secondaryAnimation,) {
      return SimpleDialog(
        ...
      );
    }, barrierDismissible: false /* its default value */);

1
投票

只需在 showDialog 中添加此属性 barrierDismissible: false 即可防止其因外部触摸而关闭。

showDialog(
   barrierDismissible: false,
   ...
)

1
投票
  1. 电话导航栏操作已禁用
  2. 在 AlertDialog 中禁用外部触摸

使用此代码

void alert() {
        showDialog(
          context: context,
          barrierDismissible: false, // <-- Set this to false.
          builder: (_) => PopScope(
            canPop: false, // <-- Prevents dialog dismiss on press of back button.
            child: AlertDialog(),
          ),
        );
      }

0
投票

如果您没有使用 showDialog,否则您使用的是 GestureDetectore,我刚刚做了一个简单的方法,只需将 GestureDetector 放入另一个 GestureDetector 中,然后设置 onTap 操作(如果这两个 GestureDetector 都是您的情况),区别在于在一个中您要执行操作,在另一个中您可以将其留空,就像这样。

GestureDetector(
    onTap: () { //The Gesture you dont want to afect the rest
      Navigator.pop(context);
    },
    child: Container(
      color: Colors.transparent,
      child:GestureDetector(
            onTap: () {}, //This way is not going to afect the inside widget
            child: Container() //your widget
            )
          )
        )
© www.soinside.com 2019 - 2024. All rights reserved.