微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

在Flutter中使用PageTransitionSwitcher时如何保持每个页面的状态?

如何解决在Flutter中使用PageTransitionSwitcher时如何保持每个页面的状态?

我正在尝试将animation添加到我的项目中,但是遇到了问题。 以前的代码是这样的

  Widget _buildScaffold(BuildContext context) {
return Scaffold(
  body: PageView.builder(itemBuilder: (context,index)=>_Pagelist[index]),extendBody: true,bottomNavigationBar: Opacity(
    opacity: 0.98,child: BottomNavigationBar(
        type: BottomNavigationBarType.fixed,selectedItemColor: Theme.of(context).accentColor,currentIndex: index,onTap: (index) {
          setState(() {
            this.index = index;
          });
          // _pageController.jumpToPage(index);
        },items: _bottomList),),);

} 根据示例,当我将PageView.builder更改为PageTransitionSwitcher时,child的值为_Pagelist[index],动画可用,并且在切换页面时状态丢失。当我尝试将PageView用作孩子时,可以设置KeepAlive的状态,但是动画消失了(因为它被认为是相同的小部件)

  Widget _buildScaffold(BuildContext context) {
return Scaffold(
  body: PageTransitionSwitcher(
    transitionBuilder: (
      Widget child,Animation<double> primaryAnimation,Animation<double> secondaryAnimation,) {
      return FadeThroughTransition(
        animation: primaryAnimation,secondaryAnimation: secondaryAnimation,child: child,);
    },child: PageView.builder(itemBuilder: (_,items: [
          BottomNavigationBarItem(
              icon: Icon(Icons.home),title: Text(I18n.of(context).home)),BottomNavigationBarItem(
              icon: Icon(
                CustomIcons.leaderboard,title: Text(I18n.of(context).rank)),BottomNavigationBarItem(
              icon: Icon(Icons.favorite),title: Text(I18n.of(context).quick_view)),BottomNavigationBarItem(
              icon: Icon(Icons.search),title: Text(I18n.of(context).search)),BottomNavigationBarItem(
              icon: Icon(Icons.settings),title: Text(I18n.of(context).setting)),]),);

}

那么,有没有办法同时保留动画和页面状态?

解决方法

这就是我所做的。

在有状态窗口小部件中,如果要在页面中显示项目列表,则可以在要保留的列表前面添加静态变量,以便在切换页面时不会获取该变量。

如果您当前使用的是FutureBuilder,我认为您必须改为使用FutureBuilder,因为您需要引用静态列表。

  static List<YourObject> yourList = new List();


  @override
  void initState() {
    super.initState();
    //some async task to fetch data and populate yourList
    fetchData();
  }



  @override
  Widget build(BuildContext context) {
    if(yourList.length == 0){
      return CircularProgressIndicator();
    }else{
      return ListView.builder(){
        itemCount: yourList.length,itemBuilder: (BuildContext context,int index){
          ...yourcodehere
        }
      }
    }
  }

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。