Flutter 透明背景色弹窗

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

Future showModalBottomSheet({
  @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上有几个类似的提问,下面是两个最接近的.

  • https://stackoverflow.com/questions/52663445/flutter-show-bottomsheet-transparency
  • https://stackoverflow.com/questions/51204179/how-to-change-the-background-color-of-bottomsheet-in-flutter

但是仍然没有解决.

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

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

LGTM : )

你可能感兴趣的:(Flutter 透明背景色弹窗)