如標(biāo)題所示,使用這倆widget 結(jié)合的話可以實(shí)現(xiàn) 安卓中的 BottomNavigationBar實(shí)現(xiàn)的 TAB 切換效果
先看下 PageView 的構(gòu)造方法:
??PageView.builder({
????Key key,
????this.scrollDirection = Axis.horizontal,
????this.reverse = false,
????PageController controller,
????this.physics,
????this.pageSnapping = true,
????this.onPageChanged,
????@required IndexedWidgetBuilder itemBuilder,
????int itemCount,
??})
scrollDirection:默認(rèn)滑動(dòng)方向是橫向的(Axis.horizontal),當(dāng)然你也可以設(shè)置為垂直方向的滑動(dòng),便于實(shí)現(xiàn)垂直滑動(dòng)效果
PageController:滑動(dòng)控制器
physics:控制物理滑動(dòng)?
對(duì)應(yīng)的子類有這些,NeverScrollableScrollPhysics()可以實(shí)現(xiàn)安卓中的 NoScrollViewPager 的效果(你懂得~)

onPageChanged:切換回調(diào)方法
itemCount:child widget 的數(shù)量
要實(shí)現(xiàn) tab 切換,我用集合存儲(chǔ)每一個(gè)頁面,并在initState()中進(jìn)行了初始化+添加(原諒我的命名1234-_-…).
List<Widget> pages = List<Widget>();
@override
void initState() {
??super.initState();
??pages.add(new HomeScreen());
??pages.add(new HomeScreen2());
??pages.add(new HomeScreen3());
??pages.add(new HomeScreen4());
}
接下來就是主頁面的 UI 繪制,導(dǎo)航欄用默認(rèn)的“腳手架”來搭建,內(nèi)嵌 AppBar 實(shí)現(xiàn)導(dǎo)航欄。

切換的方法:
void _pageChange(int index) {
??setState(() {
????if (_currentIndex != index) {
??????_currentIndex = index;
????}
??});
}
BottomNavigationBar 的點(diǎn)擊事件處理:
??????onTap: (int index) {
//??????????_pageController.animateToPage(index, duration: new Duration(seconds: 2),curve:new ElasticOutCurve(0.8));
??????????_pageChange(index);
????????}
搞定。
詳細(xì)代碼請(qǐng)參看:https://github.com/yanftch/flutter_demo/blob/develop/lib/wanandroid/HomePage.dart