在 Flutter 中,可以使用 showDialog 函数来显示一个弹窗

7 min read

在 Flutter 中,可以使用 showDialog 函数来显示一个弹窗。

例如,可以使用 AlertDialog 组件来显示一个带标题、内容和按钮的弹窗:

showDialog(
  context: context,
  builder: (BuildContext context) {
    return AlertDialog(
      title: Text('Title'),
      content: Text('This is a dialog.'),
      actions: <Widget>[
        FlatButton(
          child: Text('OK'),
          onPressed: () {
            Navigator.of(context).pop();
          },
        ),
      ],
    );
  },
);

上面的代码中,showDialog 函数会显示一个 AlertDialog 组件,该组件包含一个标题、一个内容和一个按钮。

如果要显示多个按钮,可以在 actions 属性中添加多个 FlatButton 组件:

showDialog(
  context: context,
  builder: (BuildContext context) {
    return AlertDialog(
      title: Text('Title'),
      content: Text('This is a dialog.'),
      actions: <Widget>[
        FlatButton(
          child: Text('OK'),
          onPressed: () {
            Navigator.of(context).pop();
          },
        ),
        FlatButton(
          child: Text('Cancel'),
          onPressed: () {
            Navigator.of(context).pop();
          },
        ),
      ],
    );
  },
);

此外,Flutter 还提供了多种弹窗组件,比如 SimpleDialogCupertinoAlertDialogBottomSheet 等,可以根据需要选择使用。