如何在颤动中维护页面的状态答案

【问题标题】：How to maintain state of a page in flutter如何在颤动中维护页面的状态
【发布时间】：2021-10-17 18:29:21
【问题描述】：

我的应用程序有一个抽屉，在其中，我根据整数更改页面（以跟踪索引），而不是通过从一个页面导航到另一个页面。我尝试使用 AuthomaticKeepAlive，但它确实在那里工作。有没有其他办法？

【问题讨论】：

添加一些代码和更多细节总是更好。见How do I ask a good question

【解决方案1】：

您可以使用有状态小部件轻松实现此目的

import 'package:flutter/material.dart';

class SimpleDrawerPage extends StatefulWidget {
  const SimpleDrawerPage({Key? key}) : super(key: key);

  @override
  _SimpleDrawerPageState createState() => _SimpleDrawerPageState();
}

class _SimpleDrawerPageState extends State<SimpleDrawerPage> {
  final pagesMenu = ["Home", "Settings"];
  int pageIndex = 0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: Builder(builder: (context) {
        switch (pageIndex) {
          case 1:
            return SettingsPage();
          // case 2:
          //   return SecondPage();
          // case 3:
          //   return ThirdPage();
          default:
            // here we use [default] for [index 0] ;
            return HomePage();
        }
      }),
      drawer: Drawer(
          child: ListView.builder(
              itemCount: pagesMenu.length,
              itemBuilder: (context, index) => ListTile(
                    title: Text(pagesMenu.elementAt(index)),
                    tileColor: index == pageIndex ? Colors.teal : null,
                    onTap: () {
                      setState(() {
                        pageIndex = index;
                      });
                    },
                  ))),
    );
  }
}

class HomePage extends StatelessWidget {
  const HomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(child: Center(child: Text('HomePage')));
  }
}

class SettingsPage extends StatelessWidget {
  const SettingsPage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(child: Center(child: Text('SettingsPage')));
  }
}

【讨论】：

不，我的意思是第一次渲染的屏幕的实际状态。我不希望它在第一次加载时调用初始化状态。

【解决方案2】：

我从另一个问题得到了答案

有两种方法可以做到这一点 第一种方法 第一种方法是在子页面顶部使用页面浏览小部件并使用 pageview 控制器更改页面索引。显然你必须使用 AutomaticKeepAliveStateMixin 来维护页面的状态以保持状态 第二种方法 另一种简单方便的方法是使用 indexedStack 小部件并为其提供一组子（页面）和当前页面索引。它只是将其所有子项保存在堆栈中，并且不会丢失其状态。

【讨论】：