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)
),
],
),
)