Flutter頁面轉跳

這裏的頁面轉跳是不攜帶參數的，進入下一個頁面和返回上一個頁面方法如下：

• Flutter進入下一個頁面方法

Navigator.push(
	context, 
	new MaterialPageRoute(builder: (context) => new SecondPage())
);

• Flutter返回上一個頁面方法

Navigator.pop(context);

下面結合一個demo，來實現Flutter頁面轉跳與返回的功能。

import 'package:flutter/material.dart';

void main() => runApp(
  new MaterialApp(
    home: MyApp(),
  )
);

class MyApp extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('路由導航demo'),
      ),
      body: Center(
        child: RaisedButton(
          onPressed: () {
            Navigator.push(
              context,
              new MaterialPageRoute(builder: (context) => new SecondPage())
            );
          },
          child: Text('進入第二頁'),
        ),
      ),
    );
  }
}

class SecondPage extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('第二個頁面'),
      ),
      body: Center(
        child: RaisedButton(
          onPressed: () {
            Navigator.pop(context);
          },
          child: Text('返回第一頁'),
        ),
      ),
    );
  }
}

效果圖如下：

Flutter 的頁面轉跳是通過 Navigator 來實現的，使用也非常簡單。