Curved navigation bar in flutter


Currently, I have a library in flutter and already implemented it in my project, but the problem is that when you navigating on item, icon color of selected item doesn’t change. Is it possible to dynamically change icon color of selected item?

This is what by default:

enter image description here

And this is what I need:

enter image description here



I think this should work.

class HomeBottomNavigationBar extends StatefulWidget {

_HomeBottomNavigationBarState createState() =>_HomeBottomNavigationBarState();

class _HomeBottomNavigationBarState extends State<HomeBottomNavigationBar> 

int pressedButtonNo = 0;

 Widget build(BuildContext context) {
   return CurvedNavigationBar(
   items: <Widget>[
    Icon(Icons.add, size: 30, color: (pressedButtonNo = 0)? Colors.Green : Colors.Black,),
    Icon(Icons.list, size: 30, color: (pressedButtonNo = 1)? Colors.Green : Colors.Black,),
    Icon(Icons.compare_arrows, size: 30, color: (pressedButtonNo = 2)? Colors.Green : Colors.Black,),
  onTap: (index) {
    setState () {
     pressedButtonNo = index;

I have not tested it. Hope it works!
Happy Coding:)

Answered By – Bensal

Answer Checked By – Candace Johnson (FlutterFixes Volunteer)

Leave a Reply

Your email address will not be published. Required fields are marked *