Flutter侧边栏

最新推荐文章于 2024-11-06 22:18:43 发布

Yao_YongChao

最新推荐文章于 2024-11-06 22:18:43 发布

阅读量1k

点赞数

CC 4.0 BY-SA版权

分类专栏： Flutter 文章标签： Flutter侧边栏 Flutter抽屉

本文链接：https://blog.youkuaiyun.com/Yyongchao/article/details/95204209

Flutter 专栏收录该内容

7 篇文章

订阅专栏

此博客展示了Flutter中侧边栏与抽屉的代码实现。代码包含用户账户信息展示、头像设置，以及多个列表项，如我的空间、用户中心、设置中心等，还设置了分割线，为Flutter开发侧边栏和抽屉提供了参考。

drawer: Drawer(
        child: Column(
          children: <Widget>[
            Row(
              children: <Widget>[
                Expanded(
                  child: UserAccountsDrawerHeader(
                    accountName: Text('姚勇超'),
                    accountEmail: Text('yaoyongchao3g@163.com'),
                    currentAccountPicture: CircleAvatar(
                      backgroundImage: NetworkImage('https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=745940581,1373683328&fm=26&gp=0.jpg'),
                    ),
                      decoration: BoxDecoration(
//                      color: Colors.yellow,
                        image: DecorationImage(
                          image: NetworkImage('https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=1551457319,4213469126&fm=26&gp=0.jpg'),
                          fit: BoxFit.cover,
                        ),
                      ),
                    otherAccountsPictures: <Widget>[
                      Image.network('https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=359815789,1305508489&fm=26&gp=0.jpg'),
                      Image.network('https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=359815789,1305508489&fm=26&gp=0.jpg')
                    ],
                  ),
                  /*child: DrawerHeader(
                    child: Text('你好Flutter'),
                    decoration: BoxDecoration(
//                      color: Colors.yellow,
                    image: DecorationImage(
                      image: NetworkImage(''),
                      fit: BoxFit.cover,
                    ),
                    ),
                  ),*/
                )
              ],
            ),
            ListTile(
              leading: CircleAvatar(
                child: Icon(Icons.home),
              ),
              title: Text('我的空间'),
            ),
            Divider(),
            ListTile(
              leading: CircleAvatar(
                child: Icon(Icons.people),
              ),
              title: Text('用户中心'),
            ),
            Divider(),
            ListTile(
              leading: CircleAvatar(
                child: Icon(Icons.settings),
              ),
              title: Text('设置中心'),
            ),
            Divider(),
          ],
        ),
      ),