Flutter dialog (2) - showGeneralDialog的使用-CSDN博客

本文链接：https://blog.csdn.net/qq_28478281/article/details/88891095

本文介绍如何使用Flutter的showGeneralDialog方法创建自定义dialog，详细解析了context、barrierLabel、barrierDismissible等属性，并展示了如何实现从其他位置进入和缩放效果，提供了一种实现酷炫效果的方式。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

上篇文章说了 showDialog 方法的使用

但是这个方法有很多东西是固定的

比如背景颜色,转换的时长和样式等等,很多东西你很难去自定义

本篇我使用另一个方法showGeneralDialog来做一些自定义

准备工作

同上一章一样,定义一个通用方法

Widget buildButton(
  String text,
  Function onPressed, {
   
  Color color = Colors.white,
}) {
   
  return FlatButton(
    color: color,
    child: Text(text),
    onPressed: onPressed,
  );
}

简单使用

这里有几个参数,虽然方法签名上只有 2 个@required注解的参数

但事实上,在我当前的版本环境下,如下代码中所有的参数都是必填项,不填会报错
我的运行环境是这样的

flutter --version
Flutter 1.3.14 • channel dev • https://github.com/flutter/flutter.git
Framework • revision 8e7e435706 (6 days ago) • 2019-03-21 15:31:46 -0700
Engine • revision d4d4883216
Tools • Dart 2.2.1 (build 2.2.1-dev.2.0 None)

代码在这里

showGeneralDialog(
    context: context,
    barrierLabel: "你好",
    barrierDismissible: true,
    transitionDuration: Duration(milliseconds: 300),
    pageBuilder: (BuildContext context, Animation animation,
        Animation secondaryAnimation) {
   
      return Center(
        child: Material(
          child: Container(
            color: Colors.black.withOpacity(animation.value),
            child: Text("我是一个可变的"),
          ),
        ),
      );
    },
  );
};

Kapture 2019-03-28 at 15.58.12.gif

这里就是弹出的 dialog 了

这里有一个背景色的选项

showGeneralDialog(
  context: context,
  barrierLabel: "你好",
  barrierDismissible: