flutter学习----BottomNavigation底部导航

Flutter BottomNavigation底部导航

BottomNavigationBar 是底部导航条，可以让我们定义底部 Tab 切换，bottomNavigationBar

是 Scaffold 组件的参数。

常见属性

属性名	类型	说明
items	List	底部导航条按钮集合
iconSize	double	图标大小
currentIndex	int	选中第几个
onTap	function(index)	选中变化回调函数
fixedColor	Color	选中的颜色
type	BottomNavigationBarType	BottomNavigationBarType.fixed BottomNavigationBarType.shifting

使用示例

Scaffold( 
    appBar: AppBar( 
        title: Text('Flutter Demo') 
    ),
    body: this._pagesList[this._curentIndex], 
    bottomNavigationBar: BottomNavigationBar( 
        currentIndex: _curentIndex, 
        onTap: _changePage, 
        fixedColor: Colors.black, 
        type: BottomNavigationBarType.fixed, 
        items: [ 
            BottomNavigationBarItem( 
                title:Text("首页"), 
                icon:Icon(Icons.home) 
            ),
            BottomNavigationBarItem( 
                title:Text("分类"), 
                icon:Icon(Icons.category) 
            ),
            BottomNavigationBarItem( 
                title:Text("设置"), 
                icon:Icon(Icons.settings) 
            ), 
        ], 
    ), 
)