Flutter--替換路由、指定跳轉路由

替換路由

注意路由配置和上篇文章配置相同
import 'package:flutter/material.dart';

class MinePage extends StatefulWidget {
  MinePage({Key key}) : super(key: key);


  _MinePageState createState() => _MinePageState();
}


class _MinePageState extends State<MinePage> {
  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      mainAxisAlignment: MainAxisAlignment.center,
      children: <Widget>[
        RaisedButton(
          child: Column(
            children: <Widget>[
              RaisedButton(
                child: Text("跳轉到登錄頁面"),
                onPressed: (){
                  Navigator.pushNamed(context, '/login');
                },
              ),
              RaisedButton(
                child: Text("跳轉到註冊頁面"),
                onPressed: (){
                  Navigator.pushNamed(context, '/registerFirst');
                },
              ),
            ],
          )
        )
      ],
    );
  }
}
login頁面(棧中彈出當前頁面)

import 'package:flutter/material.dart';


class LoginPage extends StatelessWidget {
  const LoginPage({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(title: Text("登錄")),
        body: Center(
          child: Column(
            children: <Widget>[
              SizedBox(
                height: 40,
              ),
              Text("登錄頁"),
              RaisedButton(
                child: Text("登錄"),
                onPressed: () {
                  // 登陸成功返回
                  Navigator.of(context).pop();
                },
              )
            ],
          ),
        ));
  }
}
註冊頁面(替換路由實現)

import 'package:flutter/material.dart';

class RegisterFirstPage extends StatelessWidget {
  const RegisterFirstPage({Key key}) : super(key: key);


  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(title: Text("登錄")),
        body: Center(
          child: Column(
            children: <Widget>[
              SizedBox(
                height: 40,
              ),
              Text("註冊1"),
              RaisedButton(
                child: Text("下一步"),
                onPressed: () {
                  // 此時跳轉到第二個註冊頁,但是棧中還是存在第一個註冊頁,當點擊返回時會返回到第一個註冊頁
                  Navigator.pushNamed(context, '/registerSecond');
                  // 替換路由,把當前路由(頁面)替換成傳入的頁面(registerSecond)這樣意味着棧中當前頁面已經不存在了,可以從當前頁面直接返回至根頁面
//                  Navigator.of(context).pushReplacementNamed('/registerSecond');
                },
              )
            ],
          ),
        ));
  }
}

置頂帖跳轉路由

import 'package:flutter/material.dart';
import 'package:flutter_app/pages/tabs.dart';

class RegisterSecondPage extends StatelessWidget {
  const RegisterSecondPage({Key key}) : super(key: key);


  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(title: Text("登錄")),
        body: Center(
          child: Column(
            children: <Widget>[
              SizedBox(
                height: 40,
              ),
              Text("完成"),
              RaisedButton(
                child: Text("確定"),
                onPressed: () {
                  // 將棧中的所有路由置爲空,並將指定路由放入棧中
                  Navigator.of(context).pushAndRemoveUntil(
                    // 直接跳轉回根路由, 根路由爲index=3
                      new MaterialPageRoute(builder: (context) => new Tabs(index:3)),
                          (route) => route == null
                  );
                },
              )
            ],
          ),
        ));
  }
}

在這裏插入圖片描述

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章