flutter中showModalBottomSheet用法

目录

• • showModalBottomSheet用法

showModalBottomSheet用法

常用属性

shape可以设置成自己想要的形状！通常直接设置圆角即可
isScrollControlled：是否时全屏还是半屏
isDismissible：外部是否可以点击，false不可以点击，true可以点击，点击后消失
backgroundColor : 通常可以设置白色和透明，

所有属性 及默认属性

Color backgroundColor, 
double elevation, //高度？？？不知道用处
ShapeBorder shape, //model边框样式
Clip clipBehavior, //shape不生效，设置一下这个clipBehavior: Clip.antiAlias,
Color barrierColor, //设置外部区域的颜色
bool isScrollControlled = false, //是否时全屏还是半屏
bool useRootNavigator = false, //使用路由？？不知道有什么用
bool isDismissible = true, //外部是否可以点击
bool enableDrag = true  //是否可以拖动？？不知道有什么用

应用实列

showModalBottomSheet<void>(
  context: context,
  isDismissible: false,  //外部不可以点击
  shape: RoundedRectangleBorder(
  	//这里是modal的边框样式
    borderRadius: BorderRadius.only(
      topLeft: Radius.circular(20),
      topRight: Radius.circular(20),
    ),
  ),
  builder: (BuildContext context) {
  	//DatePicker 是自定义的StatefulWidget  model的样式，结构在DatePicker处理  
  	//modal的高度在DatePicker中处理
  	//[StatefulWidget  传参样式结构处理](https://blog.csdn.net/weixin_42322441/article/details/109237716)
    return DatePicker(
      onCancel: () {
        Navigator.of(context).pop();
      },
      onSure: (value) async {
        //确认回调
        //处理data或业务逻辑
        setState(() {
          birthday = value;
        });
        Navigator.pop(context);
      },
    );
  },
);

本文地址：https://blog.csdn.net/weixin_42322441/article/details/109236166