Flutter BottomNavigationBar: why selected item shifts other icons? - flutter

Question

I'm new to flutter and I created a BottomNavigationBar and add into it some BottomNavigationBarItem that contains flutter icons.
The problem is that, when I select one item of my BottomNavigationBar, this item shifts other icons.
this is a screenshot of my app:
is there a way to block this shift ?
my code:
import 'package:flutter/material.dart';
class Navbar extends StatefulWidget {
const Navbar({ Key key }) : super(key: key);
#override
_NavbarState createState() => _NavbarState();
}
class _NavbarState extends State<Navbar> {
int index = 0;
#override
Widget build(BuildContext context) {
return BottomNavigationBar(
iconSize: 30,
showSelectedLabels: false,
showUnselectedLabels: false,
selectedItemColor: Colors.blueGrey,
unselectedItemColor: Colors.black,
currentIndex: index,
onTap: (int selectedIndex) {
setState(() {
index = selectedIndex;
});
},
items: [
BottomNavigationBarItem(
icon: new Icon(
Icons.home,
),
title: new Text('Home'),
),
BottomNavigationBarItem(
icon: new Icon(
Icons.search,
),
title: new Text('Search'),
),
BottomNavigationBarItem(
icon: Icon(
Icons.add,
),
title: Text('Add')
),
BottomNavigationBarItem(
icon: Icon(
Icons.favorite,
),
title: Text('Add')
),
BottomNavigationBarItem(
icon: Icon(
Icons.account_circle,
),
title: Text('Account')
)
],
);
}
}

Answer 1

You can change this behavior of the BottomNavigationBar by setting its type parameter to BottomNavigationBarType.fixed when constructing it.
BottomNavigationBar(
...
type: BottomNavigationBarType.fixed,
...
}
According to the documentation the default type is fixed if there are four or less items and shifting if there are more.