flutter - 在底部抽屉导航 flutter 中注销

标签 flutter dart navigation-drawer flutter-layout

我想在抽屉导航底部进行注销和设置,但我尝试了很多建议但根本不起作用 有什么建议吗?

这是我的抽屉导航

Drawer(
      child: ListView(
        padding: EdgeInsets.zero,
        children: <Widget>[
          _createHeader(),
          _createDrawerItem(icon: Icons.event, text: 'Event', onTap: () => Navigator.pushReplacementNamed(context, Routes.event)
          ),
          Column(
            crossAxisAlignment: CrossAxisAlignment.center,
            mainAxisSize: MainAxisSize.max,
            mainAxisAlignment: MainAxisAlignment.end,
            children: <Widget>[
              _createFooterItem(icon: Icons.event, text: 'Settings', onTap: () => Navigator.pushReplacementNamed(context, Routes.event)),
              _createFooterItem(icon: Icons.event, text: 'Logout', onTap: () => Navigator.pushReplacementNamed(context, Routes.event))
            ],
          ),
        ],
      ),
    );

这是我的标题小部件

Widget _createHeader() {
    return DrawerHeader(
        margin: EdgeInsets.zero,
        padding: EdgeInsets.zero,
        decoration: BoxDecoration(
            image: DecorationImage(
                fit: BoxFit.fill,
                image: AssetImage('res/images/drawer_header_background.png'))),
        child: Stack(children: <Widget>[
          Positioned(
              bottom: 12.0,
              left: 16.0,
              child: Text("Flutter Step-by-Step",
                  style: TextStyle(
                      color: Colors.white,
                      fontSize: 20.0,
                      fontWeight: FontWeight.w500))),
        ]));
  }

这是我的页脚小部件

Widget _createFooterItem({IconData icon, String text, GestureTapCallback onTap}){
    return ListTile(
      title: Row(
        children: <Widget>[
          Icon(icon),
          Padding(
            padding: EdgeInsets.only(left: 8.0),
            child: Text(text),
          )
        ],
      ),
      onTap: onTap,
    );
  }

最佳答案

您可以更改 ListViewColumn然后添加 Expanded带 child 的小部件 Container

Drawer(
        child: Column( // Changed this to a Column from a ListView
          children: <Widget>[
            _createHeader(),
            ListTile(title: Text('First item')),
            Expanded(child: Container()), // Add this to force the bottom items to the lowest point
            Column(
              children: <Widget>[
                _createFooterItem(
                    icon: Icons.event,
                    text: 'Settings',
                    onTap: () => Navigator.pushReplacementNamed(context, '/')),
                _createFooterItem(
                    icon: Icons.event,
                    text: 'Logout',
                    onTap: () => Navigator.pushReplacementNamed(context, '/'))
              ],
            ),
          ],
        ),
      );

关于flutter - 在底部抽屉导航 flutter 中注销,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60634246/

相关文章:

dart json.encode(data) 不能接受其他语言

flutter - 在Flutter和Dart中如何测试数据是否成功写入json?

dependencies - dart pub 依赖项指向本地计算机上的库

android - CollapsingToolbarLayout 标题消失

android - 如何使用抽屉导航正确替换 fragment

android - 如何解决flutter中 'Object of type XXXXX is not registered inside GetIt'的问题?

flutter - 如何在 Isolate 上实例化本地通知?

dart - 讨论问题:为什么dart不允许在类中声明枚举?

flutter - 必须将非空字符串提供给文本小部件-Flutter Android

java - Android 汉堡/箭头图标动态改变颜色