美文网首页
Flutter 透明背景色弹窗

Flutter 透明背景色弹窗

作者: ZfRee | 来源:发表于2020-09-11 17:46 被阅读0次

之前用ScaffoldshowModalBottomSheet方法实现了一个半屏幕弹窗.后来需求调整,要改成背景完全透明的.

Future<T> showModalBottomSheet<T>({
  @required BuildContext context,
  @required WidgetBuilder builder,
  Color backgroundColor,
  double elevation,
  ShapeBorder shape,
  Clip clipBehavior,
  bool isScrollControlled = false,
  bool useRootNavigator = false,
  bool isDismissible = true,
})

showModalBottomSheetbackgroundColor参数确实是可以修改整体的背景颜色, 但即使设置为Colors.transparent也是自带半透明的黑,而且不能完全透明.

试了几个方案还是没有解决,例如包裹opacity/用route设置barrier颜色/XXX.


开始搜索吧,百度一下没什么靠谱的答案,在stackoverflow上有几个类似的提问,下面是两个最接近的.

但是仍然没有解决.

感觉自己思维被局限在这一个showModalBottomSheet方法里了.
喝口水冷静冷静,换个思路,换个dialog实现起来很简洁嘛

showGeneralDialog(
  context: context,
  barrierDismissible:true,
  barrierLabel: '',
  transitionDuration: Duration(milliseconds: 200),
  pageBuilder: (BuildContext context, Animation<double> animation,Animation<double> secondaryAnimation) {
    return Scaffold(backgroundColor: Colors.transparent, body:yourWidget);  
})

LGTM : )

相关文章

  • Flutter 透明背景色弹窗

    之前用Scaffold的showModalBottomSheet方法实现了一个半屏幕弹窗.后来需求调整,要改成背景...

  • ios 使用UIwindow自制弹窗

    创建一个简单的弹窗,先定义一个全局的uiwindow。 在使用时创建并覆盖全局大小。设置背景色的透明度,使用户可以...

  • Swift - NavigationBar Tips

    设置导航栏背景色为透明 隐藏导航栏下方的线条 设置导航栏的背景色 设置导航栏背景不为半透明

  • Flutter 弹窗

    1、showDialogshowDialog:半透明背景弹窗 打电话弹窗:AlertDialog:alert内容B...

  • 02.CSS背景

    背景色 1.属性background-color定义元素的背景色;2.背景色默认值为transparent,即透明...

  • flutter弹窗

    一、iOS风格弹窗 风格一: 风格二: 风格三: 风格四:底部 二、GetX的Dialog风格 1、自定义的 2、...

  • flutter弹窗插件 -- oktoast

    flutter 开发中常用的弹窗插件oktoast,使用非常简单插件地址:oktoast | Flutter Pa...

  • 微信小程序自定义弹窗(可通用)

    本文为自定义弹窗,该内容可满足如下需求: 自定义各种布局弹窗、 点击弹窗布局外消失弹窗 弹出弹窗时背景阴影半透明 ...

  • 微信小程序自定义弹窗(可通用)

    本文为自定义弹窗,该内容可满足如下需求:自定义各种布局弹窗、点击弹窗布局外消失弹窗弹出弹窗时背景阴影半透明各方向弹...

  • WPF动画

    //-------------改变按钮的背景色为绿色 //-------------改变窗体透明度 //-----...

网友评论

      本文标题:Flutter 透明背景色弹窗

      本文链接:https://www.haomeiwen.com/subject/najbektx.html