Flutter：PageView保持停留在上一个屏幕

Question

我在我的屏幕中使用 PageView 导航到另一个屏幕。我有 3 个屏幕 Home、History 和 History Detail。

一切都很好，我可以移动到history 屏幕。直到我从 History 屏幕重定向到 History Detail 并返回 Navigator.of(context).pop ，我重定向到 Home 屏幕。我想从History Detail 回来后我一直呆在History 屏幕上。

我已经将 initialPage 初始化为 0 ，并用 onPageChanged 更改了 initialPage 但没有任何反应，我仍然重定向到 Home 屏幕。

我该怎么办？

这是我的源代码。

  PageController _pageController;
  int currentPage = 0;
  @override
  void initState() {
    _pageController = PageController(initialPage: currentPage);
    super.initState();
  }

 Widget build(BuildContext context) {
    final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();
    double mqHeight = MediaQuery.of(context).size.height;
    return Scaffold(
      key: _scaffoldKey,
      body: FutureBuilder(
        future: Hive.openBox("debt_box"),
        builder: (ctx, snapshot) {
          if (snapshot.connectionState == ConnectionState.done) {
            if (snapshot.hasError)
              return Text(snapshot.error.toString());
            else
              return Scaffold(
                body: PageView(
                  scrollDirection: Axis.vertical,
                  onPageChanged: (index) {
                    currentPage = index;
                    print(currentPage);
                  },
                  physics: NeverScrollableScrollPhysics(),
                  controller: _pageController,
                  children: <Widget>[
                    CustomScrollView(
                      slivers: <Widget>[
                        SliverAppBarHome(),
                        SliverListHome(_scaffoldKey),
                      ],
                    ),
                    HistoryDebt(),
                  ],
                ),
              );
          } else {
            return Center(child: CircularProgressIndicator());
          }
        },
      ),
      bottomNavigationBar: BottomAppBar(
        shape: CircularNotchedRectangle(),
        child: Container(
          height: mqHeight * 0.08,
          child: Row(
            mainAxisSize: MainAxisSize.max,
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: <Widget>[
              IconButton(
                icon: Icon(Icons.home),
                onPressed: () =>
                    functionHelper.previousButtonPageView(_pageController),
              ),
              IconButton(
                icon: Icon(Icons.insert_chart),
                onPressed: () =>
                    functionHelper.nextButtonPageView(_pageController),
              ),
            ],
          ),
        ),
      ),
  }

Answer 1

我发现了问题。

当您按下返回按钮时，它会重新构建您的主小部件。在build 方法中，您有FutureBuilder，它也会被重建。

所以它会显示CircularProgressIndicator。由于Hive.openBox("debt_box") 会立即给出结果，因此您无法看到它。

在显示CircularProgressIndicator 时，您的PageView 被停用（从小部件树中删除）。所以_pageController 失去了它的客户。

在CircularProgressIndicator 之后，会创建一个新的PageView。

这就是它显示Home页面的原因

解决方案：

根据document，我们不应在构建期间直接分配future: Hive.openBox("debt_box")。而是创建一个Future 变量并在initState 中对其进行初始化，然后将该变量传递给FutureBuilder 的future 属性

PageController _pageController;
int currentPage = 0;
Future _openBox;

@override
void initState() {
  _pageController = PageController(initialPage: currentPage);
  _openBox = Hive.openBox("debt_box");  //initialize here
  super.initState();
}

Widget build(BuildContext context) {
  final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();
  double mqHeight = MediaQuery.of(context).size.height;
  return Scaffold(
    key: _scaffoldKey,
    body: FutureBuilder(
      future: _openBox, //pass the future variable here
      builder: (ctx, snapshot) {
      ...

Answer 2

在您的历史记录页面上尝试/路由

 Navigator.push(context,
    MaterialPageRoute(builder: (context) => YourDestination()));