gpt4 book ai didi

dart - 选择时如何更改BottomNavigationBarItem图标, flutter

转载 作者:IT老高 更新时间:2023-10-28 12:38:36 25 4
gpt4 key购买 nike

我是 Flutter 的新手。我有一个包含 4 个项目的 BottomNavigationBar。我想在按下时更改项目的图标。请帮忙。

这是我到目前为止所做的。

bottomNavigationBar : new BottomNavigationBar(
currentIndex: index,
onTap: (int index) {
setState(() {
this.index = index;
}
);
_navigateToScreens(index);
},
type: BottomNavigationBarType.fixed,
items: [
new BottomNavigationBarItem(
backgroundColor: Colors.white,
icon: new Image.asset('images/1.0x/icon1.png'),
title: new Text("Route1", style: new TextStyle(
color: const Color(0xFF06244e), fontSize: 14.0))),
new BottomNavigationBarItem(
icon: new Image.asset('images/1.0x/icon2.png'),
title: new Text("Route2", style: new TextStyle(
color: const Color(0xFF06244e), fontSize: 14.0))),
new BottomNavigationBarItem(
icon: new Image.asset('images/1.0x/icon3.png'),
title: new Text("Route3", style: new TextStyle(
color: const Color(0xFF06244e), fontSize: 14.0),)),
new BottomNavigationBarItem(
icon: new Image.asset('images/1.0x/icon4.png'),
title: new Text("Route4", style: new TextStyle(
color: const Color(0xFF06244e), fontSize: 14.0),))
]);

最佳答案

BottomNavigationBarItem 中 Flutter 中添加了新功能,即 事件图标。我们可以用它来判断标签处于事件状态时应该是什么图标

bottomNavigationBar : new BottomNavigationBar(
currentIndex: index,
onTap: (int index) {
setState(() {
this.index = index;
}
);
_navigateToScreens(index);
},
type: BottomNavigationBarType.fixed,
items: [
new BottomNavigationBarItem(
backgroundColor: Colors.white,
icon: new Image.asset('images/1.0x/icon1.png'),
activeIcon:new Image.asset('images/1.0x/newIcon.png'),
title: new Text("Route1", style: new TextStyle(
color: const Color(0xFF06244e), fontSize: 14.0))),
new BottomNavigationBarItem(
icon: new Image.asset('images/1.0x/icon2.png'),
activeIcon:new Image.asset('images/1.0x/newIcon.png'),
title: new Text("Route2", style: new TextStyle(
color: const Color(0xFF06244e), fontSize: 14.0))),
new BottomNavigationBarItem(
icon: new Image.asset('images/1.0x/icon3.png'),
activeIcon: new Image.asset('images/1.0x/newIcon.png'),
title: new Text("Route3", style: new TextStyle(
color: const Color(0xFF06244e), fontSize: 14.0),)),
new BottomNavigationBarItem(
icon: new Image.asset('images/1.0x/icon4.png'),
activeIcon: new Image.asset('images/1.0x/newIcon.png'),
title: new Text("Route4", style: new TextStyle(
color: const Color(0xFF06244e), fontSize: 14.0),))
]),

希望有人会觉得这很有用。

关于dart - 选择时如何更改BottomNavigationBarItem图标, flutter ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49029966/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com