改变颤振抽屉背景颜色

Ale*_*exL 13 drawer navigation-drawer flutter

如何更改颤动导航抽屉的背景颜色?似乎没有颜色或背景颜色属性.

azi*_*iza 29

当你构建你ListViewchild属性时Drawer,你可以包含你Drawer内部的不同部分Container并使用该color属性Container.

在此输入图像描述

drawer: new Drawer(
        child: new ListView(
          children: <Widget>[
            new Container(child: new DrawerHeader(child: new CircleAvatar()),color: Colors.tealAccent,),
            new Container (
              color: Colors.blueAccent,
              child: new Column(
                children: new List.generate(4, (int index){
                  return new ListTile(
                    leading: new Icon(Icons.info),
                  );
                }),
              ),
            )
          ],
        ),
      ),
Run Code Online (Sandbox Code Playgroud)

如果你已经有了一致的着色设计,那么更好的选择是定义你ThemeData的应用程序根目录的主题属性,DrawerHeader并且正文将跟随你canvasColor,所以你需要覆盖其中一个的值到改变颜色:

在此输入图像描述

return new MaterialApp(
....
theme: new ThemeData(
       canvasColor: Colors.redAccent,

       ....),
)
Run Code Online (Sandbox Code Playgroud)


Jon*_*asH 15

最简单的方法可能是将ListViewa包裹在里面Container并指定其颜色,如下所示:

drawer: Drawer(
  child: Container(color: Colors.red,
    child: new ListView(
      ...
    )
  )
)
Run Code Online (Sandbox Code Playgroud)


小智 8

更改抽屉头颜色使用吹码


UserAccountsDrawerHeader(
  accountName: Text("Ashish Rawat"),
  accountEmail: Text("ashishrawat2911@gmail.com"),
  decoration: BoxDecoration(
    color: const Color(0xFF00897b),
  ),
  currentAccountPicture: CircleAvatar(
    backgroundColor: Theme.of(ctxt).platform == TargetPlatform.iOS
        ? const Color(0xFF00897b)
        : Colors.white,
    child: Text(
      "A",
      style: TextStyle(fontSize: 40.0),
    ),
  ),
),
Run Code Online (Sandbox Code Playgroud)


Raj*_*dav 7

包装最好的办法DrawerTheme

例如:

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        //other scaffold items
        drawer: Theme(
           data: Theme.of(context).copyWith(
                 canvasColor: Colors.blue, //This will change the drawer background to blue.
                 //other styles
              ),
              child: Drawer(
                 child: Column(
                    children: <Widget>[
                       //drawer stuffs
                    ],
                 ),
             ),
        );
  }
Run Code Online (Sandbox Code Playgroud)


小智 5

您可以使用此代码;

drawer: Drawer(
        child: Container(
          //child: Your widget,
          color: Colors.red,
          width: double.infinity,
          height: double.infinity,
        ),
      )
Run Code Online (Sandbox Code Playgroud)