在使用showModalBottomSheet这个控件时,想要设置圆角,在内容widget设置不管用,然后直接看这个控件的实现原理,一看有个shape属性,感觉有戏!果然设置完毕后,成功了。

注意:一定不要设置builder中的背景颜色,否则会覆盖导致不能显示出圆角!

showModalBottomSheet

  • shape可以设置成自己想要的形状!通常直接设置圆角即可
  • isScrollControlled:是否时全屏还是半屏
  • isDismissible:外部是否可以点击,false不可以点击,true可以点击,点击后消失
  • backgroundColor : 通常可以设置白色和透明,
  • barrierColor:设置遮挡底部的半透明颜色,默认是black54,可以设置成透明的;
  • enableDrag: 是否可以向下拖动关闭,默认是true打开的;

以下代码:

  showModalBottomSheet(
      context: context,
       isScrollControlled:false,
      backgroundColor: Colors.white,
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(10))),
      builder: (BuildContext context) {
        return Container(
        	height:50,//对话框高度就是此高度
          child: Center(child: Text("居中文字")),

        );
      });
Logo

开源鸿蒙跨平台开发社区汇聚开发者与厂商,共建“一次开发,多端部署”的开源生态,致力于降低跨端开发门槛,推动万物智联创新。

更多推荐