Question

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

我已经尝试过：

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

和：

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

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

main.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？

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

0 个答案: