Flutter 页面入栈和出栈

Docs

demo

import 'package:flutter/material.dart';

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Ajnauw',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

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

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('demo'),
      ),
      body: ListView(
        children: [
          RaisedButton(
            onPressed: () {
              // 点击触发事件，页面入栈
              Navigator.of(context).push(
                MaterialPageRoute(builder: (BuildContext context) {
                  return Scaffold(
                    appBar: AppBar(
                      title: Text('New Page'),
                    ),
                    body: Center(
                      child: Container(
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            Text('New Page Body.'),
                            RaisedButton(
                              color: Theme.of(context).accentColor,
                              onPressed: () {
                                // 页面出栈
                                Navigator.pop(context);
                              },
                              child: Text('Back Page'),
                            ),
                          ],
                        ),
                      ),
                    ),
                  );
                }),
              );
              // Navigator.push(
              //   context,
              //   MaterialPageRoute(builder: (BuildContext context) {
              //     return Scaffold(
              //       appBar: AppBar(
              //         title: Text('New Page'),
              //       ),
              //       body: Center(
              //         child: Text('New Page Body.'),
              //       ),
              //     );
              //   }),
              // );
            },
            child: Text('跳转新页面'),
          ),
        ],
      ),
    );
  }
}

配置 routes 跳转

import 'package:flutter/material.dart';

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Ajnauw',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
      routes: {
        '/a': (BuildContext context) => MyPage(title: 'page A'),
        '/b': (BuildContext context) => MyPage(title: 'page B'),
        '/c': (BuildContext context) => MyPage(title: 'page C'),
      },
    );
  }
}

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

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State {
  final List _pages = ['/a', '/b', '/c'];
  String togoPage = '/b';

  _handleRadioValueChange(String nv) {
    setState(() {
      togoPage = nv;
    });
  }

  // 返回一个小widget
  Widget _generagorRadio(String pageName) {
    return GestureDetector(
      onTap: () {
        _handleRadioValueChange(pageName);
      },
      child: Container(
        decoration: BoxDecoration(
          color: Colors.grey[200],
        ),
        margin: EdgeInsets.only(top: 8.0),
        child: Row(
          children: [
            Radio(
              value: pageName,
              onChanged: _handleRadioValueChange,
              groupValue: togoPage,
            ),
            Text(pageName),
          ],
        ),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('demo'),
      ),
      body: ListView(
        children: [
          Container(
            margin: EdgeInsets.only(left: 8.0, right: 8.0),
            child: Column(
              children: _pages
                  .map((String pageName) => _generagorRadio(pageName))
                  .toList(),
            ),
          ),
          Container(
            margin: EdgeInsets.only(left: 8.0, right: 8.0, top: 8.0),
            child: RaisedButton(
              onPressed: () {
                // 点击触发事件，页面入栈
                Navigator.pushNamed(context, togoPage);
              },
              color: Theme.of(context).primaryColor,
              child: Text('跳转新页面 $togoPage'),
            ),
          ),
        ],
      ),
    );
  }
}

class MyPage extends StatelessWidget {
  final String title;

  MyPage({Key key, this.title}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(title),
      ),
      body: Center(
        child: Text(title),
      ),
    );
  }
}

转载于:https://www.cnblogs.com/ajanuw/p/10475578.html