浏览MaterialPageRoute

Question

我有4个屏幕。 X，A，B，C导航模式应如下

这是代码

X屏幕

class X extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Center(
      child: FlatButton(
        child: Text('Navigate to A'),
        onPressed: () {
          A.show(context);
        },
      ),
    );
  }
}

一个屏幕

class A extends StatelessWidget {
  static Future<void> show(BuildContext context) async {
    await Navigator.of(context).push(
      MaterialPageRoute(builder: (context) => A(), fullscreenDialog: false),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: Center(
        child: FlatButton(
          child: Text('Navigate to B'),
          onPressed: () {
            B.show(context);
          },
        ),
      ),
    );
  }
}

B级

class B extends StatelessWidget {
  static Future<void> show(BuildContext context) async {
    await Navigator.of(context).push(
      MaterialPageRoute(builder: (context) => B(), fullscreenDialog: false),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: Center(
        child: FlatButton(
          child: Text('Navigate to C'),
          onPressed: () {
            C.show(context);
          },
        ),
      ),
    );
  }
}

C级

class C extends StatelessWidget {
  static Future<void> show(BuildContext context) async {
    await Navigator.of(context).push(
      MaterialPageRoute(builder: (context) => C(), fullscreenDialog: false),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: Center(
        child: FlatButton(
          child: Text('Navigate back to A'),
          onPressed: () {
            A.show(context); //<=== here is problem
          },
        ),
      ),
    );
  }
}

我遇到的问题是，当我从屏幕C导航回到屏幕A，然后按应用栏上的后退按钮，然后又回到屏幕C。我需要能够从C导航回到B，从B导航到A，然后从A到X，但是一旦我从C导航到AI，则需要在按下按钮时导航回到X或再次导航到B

更新

我想我是用尝试失败技术来解决这个问题的，老实说，我不明白为什么它会按照我的意愿工作。如果您知道为什么这样做并有解释，请提供答案。这是我所做的

我在屏幕A中添加了新的静态功能

  static Future<void> back(BuildContext context) async {
    await Navigator.of(context).pushAndRemoveUntil(
        MaterialPageRoute(
            builder: (context) => A(),
            fullscreenDialog: false),
        ModalRoute.withName('/'));
  }

并在我的按钮的屏幕C中调用它

A.back(context)

Answer 1

更改代码

1. 为A页面路线命名
2. 在C页面上弹出按钮，直到弹出

class A extends StatelessWidget {
  static Future<void> show(BuildContext context) async {
    await Navigator.of(context).push(
      MaterialPageRoute(
          builder: (context) => A(),
          settings: RouteSettings(name: 'A'), // <-- change 1 give a name
          fullscreenDialog: false),
    );
  }
...

class C extends StatelessWidget {
...  
  onPressed: () {
    Navigator.popUntil(context, (route) => route.settings.name == 'A'); //<=== will pop until A change 2
...

see it works in dartpad

working gist used in dartpad

更新A.back中发生了什么？

1. 它正在使用页面A推新条路线（旧路线将被销毁）
2. 然后将所有路线删除到第一个路线X
3. 但是如果在X之前有更多路线，也会将其删除

缺点-在iOS swipe back上调用Navigator.pop的行为，在这种情况下无法直接调用A.back

  static Future<void> back(BuildContext context) async {
    await Navigator.of(context).pushAndRemoveUntil(
        MaterialPageRoute(
            builder: (context) => A(),
            fullscreenDialog: false),
        ModalRoute.withName('/'));
  }

Answer 2

  class C extends StatelessWidget {
  static Future<void> show(BuildContext context) async {
         await Navigator.of(context).push(
              MaterialPageRoute(builder: (context) => C(), fullscreenDialog: false),  
   );
   }

    @override
      Widget build(BuildContext context) {
     return Scaffold(
     appBar: AppBar(),
     body: Center(
     child: FlatButton(
      child: Text('Navigate back to A'),
      onPressed: () {
        int count = 0;
             Navigator.of(context).popUntil((_) => count++ >= 2);
      },
    ),
  ),
);
 }
}