一 Tab 底部页面切换的时候 保持页面状态
Step1 在Tab 页面创建页面控制器,
//创建页面控制器
var _pageController;
@override void initState(){
//页面控制器初始化
_pageController = new PageController(initialPage : _currentIndex);
super.initState();
}
Step 2 加载PageView
body: PageView(
controller: this._pageController,
children: [HomePage(), CategoryPage(), CartPage(), UserPage()],
),Step3 tabbar底部按钮切换的时候
bottomNavigationBar: BottomNavigationBar(
type: BottomNavigationBarType.fixed,
currentIndex: _selectedIdx,
// 切换按钮
onTap: (idx) {
setState(() {
_selectedIdx = idx;
this._pageController!.jumpToPage(idx);
});
},Step4 在其他类继承AutomaticKeepAliveClientMixin
@override
// TODO: implement wantKeepAlive
bool get wantKeepAlive => true;
该文章介绍了如何在Flutter应用中实现Tab底部页面切换时保持页面状态。通过创建PageController初始化页面,使用PageView展示子页面,并在BottomNavigationBar的onTap事件中更新页面。此外,为了保持页面状态,文章提到了在子页面类中继承AutomaticKeepAliveClientMixin并重写wantKeepAlive方法。
1115

被折叠的 条评论
为什么被折叠?



