如何更改导航抽屉的工具栏颜色

时间:2020-06-24 14:35:56

标签: flutter dart flutter-layout flutter-drawer

如何更改导航抽屉的工具栏颜色。

1 个答案:

答案 0 :(得分:1)

只需在padding: EdgeInsets.all(0.0),小部件内的listview小部件中添加Drawer

尝试一下

class HomePage extends StatefulWidget {
  @override
  _HomePageScreen createState() => _HomePageScreen();
}

class _HomePageScreen extends State<HomePage> {
  @override
  Widget build(BuildContext context) {
    return  Scaffold(
      appBar:  AppBar(
        title:  Text("Home"),
      ),
      drawer: Drawer(
        child:  ListView(
          padding:  EdgeInsets.all(0.0),
          children: <Widget>[
             UserAccountsDrawerHeader(
              accountName:  Text("Nilesh Rathod"),
              accountEmail:  Text("nilesh@gmail.com"),
              currentAccountPicture:  CircleAvatar(
                backgroundColor: Colors.white,
                child:  Text("Nilu"),
              ),
            ),
             ListTile(
              title:  Text("Home"),
              trailing:  Icon(Icons.new_releases),
            ),
             Divider(),
             ListTile(
              title:  Text("Profile"),
              trailing:  Icon(Icons.person),
              onTap: () => {},
            ),
             Divider(),
             ListTile(
              title:  Text("Tab Layout"),
              trailing:  Icon(Icons.person),
              onTap: () => {},
            ),
             Divider(),
             ListTile(
              title:  Text("Comman View Demo"),
              trailing:  Icon(Icons.person),
              onTap: () => {},
            ),
             Divider(),
             ListTile(
              title:  Text("Close"),
              trailing:  Icon(Icons.close),
              onTap: () => Navigator.of(context).pop(),
            ),
          ],
        ),
      ),
      body:  CachedNetworkImage(
          imageUrl: 'https://i.stack.imgur.com/K8FFo.jpg?s=328&g=1',
          placeholder: (context, url) => CircularProgressIndicator(), //<= ends here
          errorWidget: (context, url, error) => Icon(Icons.error)),
    );
  }
}

输出

使用padding: EdgeInsets.all(0.0),

enter image description here

没有padding: EdgeInsets.all(0.0),

enter image description here

相关问题