Flutter 对话框组件

Flutter 对话框组件(CupertinoAlertDialog)，CupertinoAlertDialog和Material Design风格里的AlertDialog对话框相似，只是样式不同。二者的共同点是不仅仅有提示内容，还有一些操作按钮，如确定和取消等。内容部分可以用SingleChildScrollView进行包裹。对于操作按钮，建议用CupertinoDialogAction组件，这样显示更协调。

CupertinoAlertDialog组件的属性及描述如下所示：

编写一个iOS风格的删除确认的示例，完整的示例代码如下：

import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'CupertinoAlertDialog组件示例',
      home: Scaffold(
        appBar: AppBar(
          title: Text('CupertinoAlertDialog组件示例'),
        ),
        body: Center(
          // 添加对话框
          child: CupertinoAlertDialog(
              title: Text('提示'), //对话框标题
              content: SingleChildScrollView(
                // 对话框内容部分
                child: ListBody(
                  children: <Widget>[
                    Text('是否要删除?'),
                    Text('一旦删除数据不可恢复！'),
                  ],
                ),
              ),
              // 对话框动作按钮
              actions: <Widget>[
                CupertinoDialogAction(
                  child: Text('确定'),
                  onPressed: () {},
                ),
                CupertinoDialogAction(
                  child: Text('取消'),
                  onPressed: () {},
                ),
              ],
          ),
        ),
      ),
    );
  }
}

上述示例代码的视图展现大致如图所示：

酷客教程相关文章：

• Flutter 加载指示器组件
• Flutter 卡片组件
• Flutter 文本框组件
• Flutter 轻量提示组件