Search code examples
fluttercolorsiconsgradientthemedata

Bottom Navigation Bar gradient icon in theme data

I want to use Linear Gradient icon in my bottom navigation bar for selected icon property can anybody tell me how to do it ! Thank You.

Solution

  • You can add the BottomNavigationBarItem Like as below.

    BottomNavigationBarItem(
            icon: Icon(Icons.home),
            label: 'Home',
            activeIcon: ShaderMask(
              shaderCallback: (Rect bounds) {
                return LinearGradient(
                  colors: <Color>[
                    Colors.red,
                    Colors.blue
                  ],
                  tileMode: TileMode.repeated,
                ).createShader(bounds);
              },
              child: Icon(Icons.home),
            ),
          ),