Android studio 如何使我的颤振应用程序的导航抽屉透明?

Android studio 如何使我的颤振应用程序的导航抽屉透明?,android-studio,dart,flutter,Android Studio,Dart,Flutter,我已经构建了一个本地Android应用程序,它有一个透明的导航抽屉。我被要求使用Flutter构建相同的应用程序,我已经到了想要实现一个透明导航抽屉的地步。我如何使我的颤振应用程序的导航抽屉透明,因为我一直在为此奋斗?我已经试过了 drawer: Drawer( child: Container( color: Colors.transparent,)), 导航抽屉只是保持白色。我一直在寻找解决办法,但找不到。任何帮助都将不胜感激。 我附上了带有透明

我已经构建了一个本地Android应用程序,它有一个透明的导航抽屉。我被要求使用Flutter构建相同的应用程序,我已经到了想要实现一个透明导航抽屉的地步。我如何使我的颤振应用程序的导航抽屉透明,因为我一直在为此奋斗?我已经试过了

drawer: Drawer(
          child: Container(
            color: Colors.transparent,)),
导航抽屉只是保持白色。我一直在寻找解决办法,但找不到。任何帮助都将不胜感激。 我附上了带有透明抽屉的本机应用程序和带有白色导航抽屉的Flitter版本的图片


经过多次修补,我终于找到了解决办法。 我编辑了主题数据并添加了画布颜色,如下所述

theme: new ThemeData(
   canvasColor: Colors.transparent
 ),
这不是最好的方法,它更像是一种变通方法


我认为有一种更好的方法可以做到这一点,而不会弄乱应用程序上的整个画布。既然您希望它专门用于抽屉,请尝试这种方法

Scaffold(
   drawer: Theme(
      data: Theme.of(context).copyWith(
       // Set the transparency here
       canvasColor: Colors.transparent, //or any other color you want. e.g Colors.blue.withOpacity(0.5)
      ),
      child: Drawer(
          // All other codes goes here. 
       )
    )
 );

使用透明的颜色,就像你目前正在做的一样,但在抽屉小部件中也要使用堆栈,并在其中使第一个小部件成为一个backdropfilter,你将需要导入dart:ui。这里有一个例子

//import this library to use the gaussian blur background
import 'dart:ui';


Scaffold(
    appBar: AppBar(
        title: Text('Title'),
    ),
    drawer: Theme(
        data: Theme.of(context).copyWith(canvasColor: Colors.transparent),
        child: sideNav()),
        body: Text('Hello Body'),
),


Drawer sideNav(){
    return Drawer(
        child: Stack(
            children: <Widget> [
                //first child be the blur background
                BackdropFilter(
                    filter: ImageFilter.blur(sigmaX: 5.0, sigmaY: 5.0), //this is dependent on the import statment above
                    child: Container(
                        decoration: BoxDecoration(color: Color.grey.withOpacity(0.5))
                    )
                ),
                ListView(
                    padding: EdgeInsets.zero,
                    children: <Widget>[
                        DrawerHeader(
                            child: Text('Hello Drawer Title')
                        ),
                        ListTitle(
                            leading: Icon(Icons.dashboard, color: Colors.white)
                            title: "Dashboard"
                            onTap: (){

                            }
                        )
                    ]
                )
            ]
        )
    );
}
//导入此库以使用高斯模糊背景
导入“dart:ui”;
脚手架(
appBar:appBar(
标题:文本(“标题”),
),
抽屉:主题(
数据:Theme.of(context).copyWith(canvasColor:Colors.transparent),
子项:sideNav()),
body:Text('Hello body'),
),
抽屉侧导航(){
回程抽屉(
子:堆栈(
儿童:[
//第一个孩子是模糊的背景
背投滤波器(
filter:ImageFilter.blur(sigmaX:5.0,sigmaY:5.0),//这取决于上面的导入状态
子:容器(
装饰:盒子装饰(颜色:彩色。灰色。不透明度(0.5))
)
),
列表视图(
填充:EdgeInsets.zero,
儿童:[
抽屉阅读器(
子:文本('你好抽屉标题')
),
列表标题(
前导:图标(Icons.dashboard,颜色:Colors.white)
标题:“仪表板”
onTap:(){
}
)
]
)
]
)
);
}