将Flutter bottomNavigationBar设置为非活动状态

Question

我有一个底部导航栏的应用程序：

BottomNavigationBar(
type: BottomNavigationBarType.fixed,
items: [
BottomNavigationBarItem(
icon: Image.asset('assets/icons/inactive/sth.png'),
activeIcon: Image.asset('assets/icons/active/sth.png'),
title: Text('Sth')
),
BottomNavigationBarItem(
icon: Image.asset('assets/icons/inactive/sth.png'),
activeIcon: Image.asset('assets/icons/active/sth.png'),
title: Text('Sth')
),
],
onTap: (int index) {
_currentIndex = index;
},
currentIndex: _currentIndex
)

现在我有一些用例，其中我想要显示底部导航栏，但它的任何项都不应该是活动的。

当将currentIndex设置为不存在的索引时，我得到了一个预期的错误。

有什么办法可以实现我的目标吗？

提前谢谢。

Answer 1

您可以尝试类似的东西

bool isInactive;
BottomNavigationBar(
type: BottomNavigationBarType.fixed,
items: [
BottomNavigationBarItem(
icon: Image.asset('assets/icons/inactive/sth.png'),
activeIcon: isInactive ? Image.asset('assets/icons/active/sth.png') : Image.asset('assets/icons/inactive/sth.png'),
title: Text('Sth')
),
...

Answer 2

// set default unselected
int _selectedIndex = -1;
BottomNavigationBar(
type: BottomNavigationBarType.fixed,
items: [
BottomNavigationBarItem(
icon: Image.asset('assets/icons/inactive/sth.png'),
activeIcon: Image.asset('assets/icons/active/sth.png'),
title: Text('Sth')
),
BottomNavigationBarItem(
icon: Image.asset('assets/icons/inactive/sth.png'),
activeIcon: Image.asset('assets/icons/active/sth.png'),
title: Text('Sth')
),
],
onTap: (int index) {
setState(() {
_selectedIndex = index;
});
},
// if unselected change select index to 0, else you will get error
currentIndex: (_selectedIndex != -1) ? _selectedIndex : 0,
// add unselected color
unselectedItemColor: Colors.grey,
// if unselected change color to unselectedItemColor
selectedItemColor: (_selectedIndex != -1) ? Colors.blueGrey : Colors.grey,
)