CODEWITHSUNDEEP
flutter
Arslan Iqbal
Arslan Iqbal

Reputation: 11

I want to change bottom navigation bar Items in row wise, like Icon and label are in row pattern in flutter

As is it described in the title I want to change bottom navigation bar Items in row wise, like Icon and label are in row pattern in flutter.

My code:

bottomNavigationBar: BottomNavigationBar(
          type: BottomNavigationBarType.fixed,
          selectedIconTheme: ,
          showSelectedLabels: true,
          showUnselectedLabels: false,
          items: [
            BottomNavigationBarItem(
                icon: SvgPicture.asset("images/Icons/home_icon.svg"),
                label: 'home'),
            BottomNavigationBarItem(
                icon: SvgPicture.asset('images/Icons/trending_icon.svg'),
                label: 'trending'),
            BottomNavigationBarItem(
                icon: SvgPicture.asset('images/Icons/collections_icon.svg'),
                label: 'collections'),
          ],

Upvotes: 0

Views: 310

Answers (1)

dm_tr
dm_tr

Reputation: 4783

selectedIconTheme was specified but not defined. Also, to make sure Svg Icons size do not overflow their parents width and height were necessary. Try this

bottomNavigationBar: BottomNavigationBar(
  type: BottomNavigationBarType.fixed,
  selectedIconTheme: IconThemeData(
    color: Theme.of(context).primaryColor,
    size: 27.0,
  ), 
  showSelectedLabels: true, 
  showUnselectedLabels: false, 
  items: [ 
    BottomNavigationBarItem( 
      icon: SvgPicture.asset("images/Icons/home_icon.svg", width: 25.0, height: 25.0,), 
      label: 'home',
    ), 
    BottomNavigationBarItem( 
      icon: SvgPicture.asset('images/Icons/trending_icon.svg', width: 25.0, height: 25.0,),
      label: 'trending',
    ),
    BottomNavigationBarItem( 
      icon: SvgPicture.asset('images/Icons/collections_icon.svg', width: 25.0, height: 25.0,),
      label: 'collections',
    ),
  ],
)

Upvotes: 0

Related Questions