如何在 Flutter 中使用路由制作持久抽屉？

Posted 2023-03-07

【中文标题】如何在 Flutter 中使用路由制作持久抽屉？

【英文标题】：How can I make a persistent drawer with routes in Flutter?

【发布时间】：2019-09-15 13:47:53

【问题描述】：

现在我的抽屉有一个类，所有页面的脚手架都使用它。当我推送一条新路线时，抽屉会重置状态。有什么办法可以对抗这个吗？我正在尝试制作一个根据路线更改所选项目背景的抽屉，但是当我单击自定义列表图块时，它只会突出显示抽屉中的第一个项目，这不是所需的结果。

在状态类的顶部：

    int selectedIndex = 0;

以下是部分代码：

      ListView.builder(
        padding: EdgeInsets.zero,
        shrinkWrap: true,
        itemCount: _drawerItems.length,
        // primary: true,
        itemBuilder: (context, index) 
          DrawerItem currentItem = _drawerItems[index];
          return Container(
            decoration: BoxDecoration(
                color: selectedIndex == index ? Colors.blue[100] : Colors.white,
                borderRadius: BorderRadius.only(
                    topRight: Radius.circular(50),
                    bottomRight: Radius.circular(50))),
            child: ListTile(
              title: Text(
                currentItem.title,
                style: TextStyle(
                  fontSize: 15.0,
                  fontFamily: "Muli",
                  letterSpacing: .3,
                  fontWeight: FontWeight.w600,
                ),
              ),
              leading: Icon(currentItem.icon, color: Colors.black),
              onTap: () 
                setState(() 
                  selectedIndex = index;
                );
                Navigator.of(context).popAndPushNamed(routes[index]);
              ,
            ),
          );
        ,
      )

【参考方案1】：

当你推送一个新路由时，它会创建一个新的抽屉并且当前的抽屉被释放。所以setState 什么都不做。

您应该尝试将 selectedIndex 声明为静态 [或全局] 变量并将您的 onTap 更改为：

              onTap: () 
                selectedIndex = index;
                Navigator.of(context).popAndPushNamed(routes[index]);
              ,