0

Hi I'm learning flutter but having this problem. I'm trying change svg icon when user click on menu item but icons not changing. When click on menu item I need change icons.

class BottomNavigation extends StatefulWidget {
  const BottomNavigation({
    Key key,
  }) : super(key: key);

  @override
  _BottomNavigationState createState() => _BottomNavigationState();
}

class _BottomNavigationState extends State<BottomNavigation> {
  @override
  Widget build(BuildContext context) {
    num _currentIndex = 1;
    return Container(
      padding: EdgeInsets.only(
          left: kDefaultPadding * 2,
          right: kDefaultPadding * 2,
          bottom: kDefaultPadding),
      height: 90,
      decoration: BoxDecoration(color: Colors.white, boxShadow: [
        BoxShadow(
            offset: Offset(0, -10),
            blurRadius: 35,
            color: kPrimaryColor.withOpacity(0.1))
      ]),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: <Widget>[
          IconButton(
              icon: _currentIndex == 1
                  ? SvgPicture.asset("assets/svg/bhomeActive.svg")
                  : SvgPicture.asset("assets/svg/bhome.svg"),
              onPressed: () {
                setState(() {
                  _currentIndex = 1;
                });
                print(_currentIndex);
              }),
          IconButton(
              icon: _currentIndex == 5
                  ? SvgPicture.asset("assets/svg/bprofileActive.svg")
                  : SvgPicture.asset("assets/svg/bprofile.svg"),
              onPressed: () {
                setState(() {
                  _currentIndex = 5;
                });
                print(_currentIndex);
              })
        ],
      ),
    );
  }
}

Im doing wrong or flutter can't change svg after render?

tried with default icons also not working after state change not rendering again?

icon: _currentIndex == 1 ? Icon(Icons.work) : Icon(Icons.alarm),

Purevsuren Bathishig
  • 33
  • 7

1 Answers1

0

There seems to be an Issue with SVG images in flutter, there are different packages available too, but I would recommend you to use PNG, instead of SVG, as PNG has size lessor than SVG and it also works flawlessly and effectively, both on the screen and programmatically. OR Use default Material Icons, which are already available. Flutter Material Icons

Yusuf Musaib
  • 9
  • 3