flutter how to popuntil to a dynamic page?

Question

I have a post page which pushed from parent page. And there are 3 steps in this page which needs 2 more pushes(each page use CupertinoPageRoute to push). After inputting all the textfield, it needs popuntil to the start page(pop 3 pages at one time) which is a dynamic page with topic_id.

Homepage
 ┗ TopicPage (specified with topic_id) 
    ┗ CreatePage (input some text)
       ┗ OptionPage (select some options to finish creation)

Then finish the Creation and pop back to the TopicPage with same topic_id.

How to achieve this effects?

Answer 1

Here is the snippet which will help you reach any previous route in routes tree.

          Navigator.popUntil(context, (Route<dynamic> route){
            bool shouldPop = false;
            if(route.settings.name == HomePage.routeName){
              shouldPop = true;
            }
            return shouldPop;
          });

If you need full sample for this code then please find this attached demo.

import 'package:flutter/material.dart';

void main(){



  runApp(MaterialApp(
    title: "Demo App",
    routes: {
      HomePage.routeName : (_) => HomePage(),
      Step1Page.routeName : (_) => Step1Page(),
      Step2Page.routeName : (_) => Step2Page(),
      Step3Page.routeName : (_) => Step3Page(),
    },
    home: SplashPage(),
    initialRoute: HomePage.routeName,
  ));
}

class SplashPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold();
  }
}


class HomePage extends StatelessWidget {

  static const routeName = "/home";

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text("Home Page"),
            RaisedButton(onPressed: (){
              Navigator.pushNamed(context, Step1Page.routeName);
            }, child: Text("Start Steps"),)
          ],
        ),
      ),
    );
  }
}


class Step1Page extends StatelessWidget {

  static const routeName = "/step1";

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text("Step1 Page"),
            RaisedButton(onPressed: (){
              Navigator.pushNamed(context, Step2Page.routeName);
            }, child: Text("Go Step2"),)
          ],
        ),
      ),
    );
  }
}



class Step2Page extends StatelessWidget {

  static const routeName = "/step2";

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text("Step2 Page"),
            RaisedButton(onPressed: (){
              Navigator.pushNamed(context, Step3Page.routeName);
            }, child: Text("Go Step3"),)
          ],
        ),
      ),
    );
  }
}

class Step3Page extends StatelessWidget {

  static const routeName = "/step3";

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text("Step3 Page"),
            RaisedButton(onPressed: (){
              Navigator.popUntil(context, (Route<dynamic> route){
                bool shouldPop = false;
                if(route.settings.name == HomePage.routeName){
                  shouldPop = true;
                }
                return shouldPop;
              });
            }, child: Text("Go Home"),)
          ],
        ),
      ),
    );
  }
}

Please let me know if you have any queries.

Answer 2

From my understanding you wish to go back to a certain route. To go back to a route named "login", for example, you could do this:

Navigator.of(context).pushNamedAndRemoveUntil('/login', (Route<dynamic> route) => false);