BottomNavigationBar常用的属性：
| 属性名 | 说明 |
| items | List<BottomNavigationBarItem> 底部导航条按钮集合 |
| iconSize | icon |
currentIndex | 默认选中第几个 |
onTap | 选中变化回调函数 |
fixedColor | 选中的颜色 |
type | BottomNavigationBarType.fixed BottomNavigationBarType.shifting |
import 'package:flutter/material.dart';
void main() {
runApp(MaterialApp(
title: "BottomNavigationBarWidget",
home: MyApp(),
));
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text("底部导航栏")),
body: Tabs(),
);
}
}
class Tabs extends StatefulWidget {
@override
_TabsState createState() => _TabsState();
}
class _TabsState extends State<Tabs> {
int _currentIndex = 0;
List _pageList = [Page("首页页面"), Page("分类页面"), Page("设置页面")];
@override
Widget build(BuildContext context) {
return Scaffold(
body:_pageList[_currentIndex],
bottomNavigationBar: BottomNavigationBar(
currentIndex: _currentIndex,
type: BottomNavigationBarType.fixed,
onTap: (int index) {
setState(() {
this._currentIndex = index;
});
},
items: [
BottomNavigationBarItem(
icon: Icon(Icons.home),
title: Text("首页")
),
BottomNavigationBarItem(
icon: Icon(Icons.category),
title: Text("分类")
),
BottomNavigationBarItem(
icon: Icon(Icons.settings),
title: Text("分类")
),
],
),
);
}
}
class Page extends StatelessWidget {
String text;
Page(this.text);
@override
Widget build(BuildContext context) {
return Center(
child: Text(text),
);
}
}