Flutter Dialog、BottomSheet

属性 说明
title 标题
content 内容
actions 按钮
applicationName 说明文字
applicationVersion 版本
applicationLegalese 版本

基本使用

dart 复制代码
class MyState extends State {
  AlertDialog delDialog(BuildContext context) {
    AlertDialog alertDialog = AlertDialog(
      title: Text("提示"),
      content: Text("确定要删除吗?"),
      actions: [
        TextButton(onPressed: () => Navigator.pop(context), child: Text("取消")),
        TextButton(onPressed: () => Navigator.pop(context), child: Text("确定")),
      ],
    );

    return alertDialog;
  }


  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text(""), centerTitle: true),
      body: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          OutlinedButton(
            onPressed: () {
              showDialog(
                context: context,
                builder: (context) {
                  return delDialog(context);
                },
              );
            },
            child: Text("弹窗"),
          ),
        ],
      ),
    );
  }
}

SimpleDialog

提供多个选项供用户选择

dart 复制代码
  SimpleDialog dialog2() {
    SimpleDialog simpleDialog = SimpleDialog(
      title: Text("选择颜色"),
      children: [
        SimpleDialogOption(
          onPressed: () => Navigator.pop(context, "Red"),
          child: Text("红色"),
        ),
        SimpleDialogOption(
          onPressed: () => Navigator.pop(context, "Blue"),
          child: Text("蓝色"),
        ),
      ],
    );
    return simpleDialog;
  }

AboutDialog

dart 复制代码
  AboutDialog dialog3() {
    AboutDialog aboutDialog = AboutDialog(
      applicationName: "关于",
      applicationVersion: "1.0.0",
      applicationLegalese: "© 2023 Flutter",
    );
    return aboutDialog;
  }

底部弹窗BottomSheet

dart 复制代码
class MyState extends State {
  
  @override
  Widget build(BuildContext context) {
    Widget widget = Column(
      children: [
        ListTile(title: Text("橘子"), onTap: () {}),
        ListTile(title: Text("西瓜"), onTap: () {}),
        ListTile(title: Text("苹果"), onTap: () {}),
        ListTile(title: Text("香蕉"), onTap: () {}),
      ],
    );

    return Scaffold(
      appBar: AppBar(title: Text(""), centerTitle: true),
      body: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          OutlinedButton(
            onPressed: () {
              showModalBottomSheet(
                context: context,
                builder: (context) {
                  return widget;
                },
              );
            },
            child: Text("弹窗"),
          ),
        ],
      ),
    );
  }
}