下面的一段flutter代碼中,會發現底部tabbar不顯示
image.png
bottomNavigationBar: BottomNavigationBar(
items: [
BottomNavigationBarItem(icon: Icon(Icons.home), label: '首頁'),
BottomNavigationBarItem(icon: Icon(Icons.book), label: '樹'),
BottomNavigationBarItem(
icon: Icon(Icons.addchart_sharp),
label: '漫畫',
),
BottomNavigationBarItem(icon: Icon(Icons.home), label: 'home'),
],
),
原因
BottomNavigationBar有個type屬性,默認值是fixed,意思是所有圖標均勻顯示在屏幕上
但是一旦BottomNavigationBarItem的數量 >=4時,這個type值自動切換成 shifting
所以需要手動給這個type賦值指定fixed
bottomNavigationBar: BottomNavigationBar(
type: BottomNavigationBarType.fixed,
items: [
BottomNavigationBarItem(icon: Icon(Icons.home), label: '首頁'),
BottomNavigationBarItem(icon: Icon(Icons.book), label: '樹'),
BottomNavigationBarItem(
icon: Icon(Icons.addchart_sharp),
label: '漫畫',
),
BottomNavigationBarItem(icon: Icon(Icons.home), label: 'home'),
],
),
這樣就有了
image.png