在 Flutter 中堆叠条件导航器按钮

Question

我正在尝试为滑动菜单创建条件菜单列表。到目前为止，就为不同类型的用户显示不同的菜单项而言，我已经获得了可用的功能。但我现在唯一的问题是，在菜单中，这两个项目“消息”和“设置”并排显示。我试图将第二个图标行移到行括号之外等等。我只是想不通。对我来说，这些括号已经很混乱了。有人可以看看这个并帮助我在“消息”下设置“设置”图标吗？

我包含了完整的方法片段，这样每个人都可以了解我正在尝试做什么。这是我知道如何做的唯一方法，我可以使我的菜单有条件。

customSlideMenu() {
    Function onTap;
    bool ownProfile = currentOnlineUserId == widget.userProfileId;
    if(ownProfile) {
      return Padding(
        padding: const EdgeInsets.fromLTRB(15.0, 0, 8.0, 0),
        child: InkWell(
          splashColor: Colors.blue,
          onTap: onTap,
          child: Container(
            height: 40,
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: <Widget>[
                Row(
                  children: <Widget>[
                    Icon(Icons.mail),
                    Padding(
                      padding: const EdgeInsets.all(8.0),
                      child: Text(
                        "Messages",
                        style: TextStyle(fontSize: 16.0),
                      ),
                    ),
                    Icon(Icons.settings),
                    Padding(
                      padding: const EdgeInsets.all(8.0),
                      child: Text(
                        "Settings",
                        style: TextStyle(fontSize: 16.0),
                      ),
                    ),
                  ],
                ),
              ],
            ),
          ),
        ),
      );
    } else {
      return Padding(
        padding: const EdgeInsets.fromLTRB(15.0, 0, 8.0, 0),
        child: InkWell(
          splashColor: Colors.blue,
          onTap: onTap,
          child: Container(
            height: 40,
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: <Widget>[
                Row(
                  children: <Widget>[
                    Icon(Icons.mail),
                    Padding(
                      padding: const EdgeInsets.all(8.0),
                      child: Text(
                        "Message",
                        style: TextStyle(fontSize: 16.0),
                      ),
                    ),
                    Icon(Icons.block),
                    Padding(
                      padding: const EdgeInsets.all(8.0),
                      child: Text(
                        "Block",
                        style: TextStyle(fontSize: 16.0),
                      ),
                    ),
                  ],
                ),
              ],
            ),
          ),
        ),
      );
    }
  }

Answer 1

Row 小部件将其子项紧挨着对齐。尝试使用 Column 小部件实现将两个子级堆叠在一起

        Column(
          children: <Widget>[
            Row(
              children: <Widget>[
                Icon(Icons.mail),
                Padding(
                  padding: const EdgeInsets.all(8.0),
                  child: Text(
                    "Messages",
                    style: TextStyle(fontSize: 16.0),
                  ),
                ),
              ],
            ),
            Row(
              children: <Widget>[
                Icon(Icons.settings),
                Padding(
                  padding: const EdgeInsets.all(8.0),
                  child: Text(
                    "Settings",
                    style: TextStyle(fontSize: 16.0),
                  ),
                ),
              ],
            )
          ],
        ),

在 Flutter 中堆叠条件导航器按钮

Stacking conditional navigator buttons in Flutter

navigation

flutter

flutter-layout

flutter-navigation