Question

我想禁用选定项目的底部导航栏动画，以使未选定项目具有相同的文本/图标大小。

那是我的代码：

 class BottomNavigationBarHome extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return BottomNavigationBar(
        unselectedItemColor: Colors.black38,
        backgroundColor: Colors.white,
        items: [
          BottomNavigationBarItem(
              icon: Icon(BalanceIcon.scale_balance, size: 15.0),
              title: Text('Item 1', style: TextStyle(

              ),)
          ),
          BottomNavigationBarItem(
              icon: Icon(BalanceIcon.scale_balance),
              title: Text('Item 2')
          ),
          BottomNavigationBarItem(
              icon: Icon(BalanceIcon.scale_balance),
              title: Text('Item 3')
          ),
        ]
    );
  }
}

我已经尝试设置相同的字体大小，动画仍然在这里

Answer 1

在BottomNavigationBar中添加selectedFontSize和unselectedFontSize并设置相同的字体大小

BottomNavigationBar(
        selectedFontSize: 15.0,
        unselectedFontSize: 15.0,

Answer 2

您可以尝试将类型添加到BottomNavigationBar

BottomNavigationBar(
    type: BottomNavigationBarType.fixed,
    ...
)

Answer 3

前面的答案是正确的，但您需要结合固定类型和定义的字体大小：

BottomNavigationBar(
    type: BottomNavigationBarType.fixed,
    selectedFontSize: 12.0,
    unselectedFontSize: 12.0,
    ...
)

BottomNavigationBarType.fixed 阻止项目水平移动并使未选择项目的标签可见。

selectedFontSize: 12.0, unselectedFontSize: 12.0 可防止在选择项目时字体大小发生变化，即使类型是固定的。

要重新添加使用此配置消失的图标和标签之间的间隙，您可以为 BottomNavigationBarItem 中的图标添加底部填充：

BottomNavigationBarItem(
  icon: Padding(
    padding: EdgeInsets.only(bottom: 2.5),
    child: <your icon>,
  ),
  label: <your title>,
),

Flutter-禁用底部导航栏动画（不断增长的文本）

3 个答案: