扑如何弹出到动态页面?

时间:2018-11-30 02:00:49

标签: dart flutter navigator

我有一个从父页面推送的帖子页面。此页面中有3个步骤,需要再进行2次推送(每个页面使用CupertinoPageRoute进行推送)。输入所有文本字段后,需要弹出菜单直到起始页面(一次弹出3个页面),该页面是一个带有topic_id的动态页面。

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

然后完成创建,并使用相同的topic_id弹出主题页面。

如何实现这种效果?

2 个答案:

答案 0 :(得分:2)

以下是代码段,可以帮助您到达路线树中的所有先前路线。

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

如果您需要此代码的完整示例,请找到此随附的演示。

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"),)
          ],
        ),
      ),
    );
  }
}

如有任何疑问,请告诉我。

答案 1 :(得分:0)

根据我的理解,您希望回到特定的路线。例如,要返回到名为“登录”的路由,可以执行以下操作:

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