使用底部导航栏导航回页面时，Flutter 通过底部导航栏选择的索引

Question

我有一个包含带有三个按钮的底部导航栏的应用程序。如果我要导航到导航栏的第二页，我会看到一个包含更多导航按钮的列表。这些按钮导航到的页面不包含底部导航栏。在这些页面上，我有一个后退按钮，我想导航回底部导航页面 2。

我试过:

() => Navigator.of(context).pushAndRemoveUntil(new MaterialPageRoute(builder: (BuildContext context) => new MyApp()), (Route route) => route == null),),

和:

() => Navigator.of(context).pop(),

当我使用第一段代码时，它会返回到导航栏的第一页，而当我使用第二段代码时，我得到的只是黑屏。

ma​​in.dart

import 'package:flutter/material.dart';
import './pages/page1.dart';
import './pages/page2.dart';
import './pages/page3.dart';

void main() => runApp(MyApp());

class MyApp extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return MyAppState();
  }
}

class MyAppState extends State<MyApp> {
  int _selectedPage = 0;
  final _pageOptions = [
    Page1(),
    Page2(),
    Page3(),
  ];

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'title',
      theme: ThemeData(
        brightness: Brightness.light,
        primaryColor: Colors.blue,
        accentColor: Colors.blueAccent,
        backgroundColor: Colors.black12,
        textTheme: TextTheme(
          title: TextStyle(fontSize: 24.0, height: 1.0, color: Theme.of(context).primaryColor),
          subtitle: TextStyle(fontSize: 18.0,height: 1.0, color: Theme.of(context).primaryColor),
          body1: TextStyle(fontSize: 12.0, height: 1.1),
        ),
      ),
      home: Scaffold(
        appBar: AppBar(title: Center(child: Text("title", textAlign: TextAlign.center))),
        body: _pageOptions[_selectedPage],
        bottomNavigationBar: BottomNavigationBar(
          currentIndex: _selectedPage,
          onTap: (int index) {
            setState(() {
             _selectedPage = index; 
            });
          },
          items:[
            BottomNavigationBarItem(
            icon: Icon(Icons.home), 
            title: Text('Page 1'),
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.info), 
            title: Text('Page 2'),
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.settings), 
            title: Text('Page 3'),
          ),
          ]
        ),
      ),
    );
  }
}

现在从第 2 页，我可以导航到第 A 页。当我在第 A 页时，我想导航回第 2 页。但是我只能导航回第 1 页。

页面 A:

import 'package:flutter/material.dart';

import '../../main.dart';

class PageA extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    double width = MediaQuery.of(context).size.width;
    double height = MediaQuery.of(context).size.height;
    double ratio = height/width;

    return Scaffold(
        appBar: AppBar(
          leading: Builder(
          builder: (BuildContext context) {
            return IconButton(
              icon: const Icon(Icons.chevron_left),
              iconSize: (0.06 * ratio) * width,
              splashColor: Colors.transparent,  
              highlightColor: Colors.transparent,
              onPressed: () => Navigator.of(context).pop(),
            );
          },
        ),
          title: Text("Page A"),
        ),
        body: Container(
          decoration: BoxDecoration(color: Theme.of(context).accentColor),
        ));
  }
}

返回上一页时如何传入_selectedPage/index？

Answer 1

我使用 shared_preferences跟踪我的应用程序上显示的当前页面。这也有助于在页面刷新时跟踪当前在网络上显示的页面，因为网络将页面刷新视为应用程序重启。