英文:
How to make color long last on Navigation Bar on Flutter?
问题
我想要构建一个底部导航栏，选定的图标项目会显示一个自定义的颜色，而未选定的图标项目会是白色。但是在我为指示项目索引的钩子设置了一个 setState() 函数之后，单击只会使颜色显示一瞬间然后消失。然而，当我使用 `Colors`，也就是预设的系统调色板颜色，例如 `Colors.amber[800]`，它可以正常工作并且颜色会保持不变。相反，当我使用自定义颜色时，它会闪烁。这种情况的可能原因是什么，如何修复？
这是我的代码和问题演示GIF。
英文:
I would like to build a bottom navigation bar, with selected icon item showing a customized color and unselected icon items in white. But after I set up a setState() function for the hook that indicates the item index, the click only makes the color show an instant and disappears. However, when I use Colors, the pre-set system palette colors, for example Colors.amber[800], it works out fine and the color will STAY. Instead when I use my own color, it will FLASH. What is the probable cause for the situation and what is the fix?
Here's my code and issue demo GIF.
class _MyRootPageState extends State<MyRootPage> {
int currentPage = 0;
List<Widget> pages = const [
HomePage(),
SettingsPage(),
SavedPage(),
ShoppingCartPage(),
MessagePage()
];
void setCurrentPage(int index) {
// setState() refreshes the component tree
setState(() {
currentPage = index;
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Pink Blue'),
),
body: pages[currentPage],
bottomNavigationBar:BottomNavigationBar(
showSelectedLabels: false,
showUnselectedLabels: false,
backgroundColor: Colors.white,
items: const [
BottomNavigationBarItem(icon: Icon(Icons.home_outlined), label:"",),
BottomNavigationBarItem(icon: Icon(Icons.search), label:""),
BottomNavigationBarItem(icon: Icon(Icons.list), label:""),
BottomNavigationBarItem(icon: Icon(Icons.account_circle_outlined), label:""),
BottomNavigationBarItem(icon: Icon(Icons.mail), label:""),
],
onTap: setCurrentPage,
currentIndex: currentPage,
selectedItemColor: const Color(0xE10098),
),
);
}
}
答案1
得分: 1
你缺少了前导的FF，它对应于自定义颜色中的不透明度或alpha值：
selectedItemColor: const Color(0xFFE10098)
而不是原来的0xE10098。
英文:
You're missing leading FF which corresponds to opacity or alpha of color in your custom color
selectedItemColor: const Color(0xE10098)
it should be 0xFFE10098 instead
答案2
得分: 0
If you use color hashcode than you need to add before hashcode 0XFF and than add your color code.
Syntax : Color(0XFF<color code>)
You can try this
selectedItemColor: const Color(0XFFE10098),
英文:
If you use color hashcode than you need to add before hashcode 0XFF and than add your color code.
Syntax : Color(0XFF<color code>)
You can try this
selectedItemColor: const Color(0XFFE10098),
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论