如何在flutter中将小部件定位到导航栏底部?

问题描述 投票:0回答:2

我需要将高度为 5.0 且宽度无限大的容器放置在底部导航栏项目中的底部。但当前位置与底部导航栏之间存在间隙。我可以知道如何解决这个问题吗?

BottomNavigationBarItem(
            activeIcon: Column(
              children: <Widget>[
                Text(
                  'HOME',
                  style: TextStyle(
                    color: '#FFFFFF'.toColor(),
                  ),
                ),
                Container(
                    color: '#D86300'.toColor(),
                    height: 5.0,
                    width: double.infinity),
              ],
            ),
            icon: Column(children: <Widget>[
              Text(
                'HOME',
                style: TextStyle(
                  color: '#FFFFFF'.toColor(),
                ),
              ),
              Container(),
            ]),
            label: 'HOME',
          ),
flutter position bottomnavigationview
2个回答
0
投票

您可以为此使用填充并根据需要设置填充


0
投票

您需要将BottomNavigationBar放入容器中,并将BottomNavigationBar的背景颜色、标高全部设置为空,样式设置为空。 并将所有样式应用到容器中。
Container 中的 Alignment 属性将帮助您控制 BottomNavigationBar 的位置。 在 BottomNavigationBarItem 中不要直接使用任何标题或图标,而是通过需要“小部件”的“图标”创建文本小部件。这将使您能够自主决定其样式。
出现此问题的原因是 Flutter OOTB 没有提供样式的完全自主权。现在通过 Container 和 Item Widget 您可以控制样式、定位。

© www.soinside.com 2019 - 2024. All rights reserved.