Flutter中命名路由跳转练习

main.dart

import 'package:flutter/material.dart';
import 'package:flutter_demo/unknownPage.dart';

import 'detail.dart';
import 'about.dart';

void main() {
  runApp(const MyApp());
}

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        routes: {
          "/": (context) => HomePage(),
          "/about": (context) => AboutPage(),
        },
        initialRoute: "/",
        onGenerateRoute: (settings) {
          if (settings.name == "/detail") {
            return MaterialPageRoute(builder: (context) {
              return DetailPage(
                message: settings.arguments as String,
              );
            });
          }
          return null;
        },
        onUnknownRoute: (settings) {
          return MaterialPageRoute(builder: (context) {
            return unknowPage();
          });
        });
  }
}

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: const Text("ts"),
        ),
        body: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            TextButton(
                onPressed: () {
                  Future res = Navigator.of(context).push(MaterialPageRoute(
                    builder: (context) {
                      return DetailPage(
                        message: "232",
                      );
                    },
                  ));
                  res
                      .then((value) => print(value))
                      .catchError((error) => {print(error)});
                },
                child: Text("商品详情")),
            TextButton(
                onPressed: () {
                  /// 传递参数
                  Navigator.of(context)
                      .pushNamed("/about", arguments: {"12": 12, "112": "112"});
                },
                child: Text("关于")),
            TextButton(
                onPressed: () {
                  /// 传递参数
                  Navigator.of(context)
                      .pushNamed("/detail", arguments: "商品详情2");
                },
                child: Text("商品详情2")),
            TextButton(
                onPressed: () {
                  /// 传递参数
                  Navigator.of(context).pushNamed("/setting", arguments: "设置");
                },
                child: Text("设置")),
          ],
        ));
  }
}

detail.dart

import 'package:flutter/material.dart';

class DetailPage extends StatefulWidget {
  String? message;
  DetailPage({Key? key, this.message}) : super(key: key);

  @override
  State<DetailPage> createState() => _DetailPageState();
}

class _DetailPageState extends State<DetailPage> {
  @override
  Widget build(BuildContext context) {
    return WillPopScope(
      onWillPop: () {
        Navigator.of(context).pop([1,2,3]);
        /// true 可以返回 false不可以返回
        return Future.value(false);
      },
      child: Scaffold(
        appBar: AppBar(
          title: Text("商品详情"),
        ),
        body: Column(
          children: <Widget>[
            TextButton(onPressed: () {
              Navigator.of(context).pop([1,2,3]);
            }, child: Text("12${widget.message}"))
          ],
        ),
      ),
    );
  }
}

AboutPage

import 'package:flutter/material.dart';

class AboutPage extends StatefulWidget {
  String? message;

  AboutPage({Key? key, String? message}) : super(key: key);

  @override
  State<AboutPage> createState() => _AboutPageState();
}

class _AboutPageState extends State<AboutPage> {
  @override
  Widget build(BuildContext context) {
    /// 获取参数
    var ds = ModalRoute.of(context)?.settings.arguments ;
    print("ds=${ds}");
    return Scaffold(
        appBar: AppBar(
          title: Text("关于"),
        ),
        body: Column(
            children: [
            TextButton(onPressed: () {
    Navigator.of(context).pop();
    }, child: Text("返回上一页"))],
    )
    ,
    );
  }
}

unknowPage

import 'package:flutter/material.dart';

class unknowPage extends StatefulWidget {
  const unknowPage({Key? key}) : super(key: key);

  @override
  State<unknowPage> createState() => _unknowPageState();
}

class _unknowPageState extends State<unknowPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("错误界面"),
      ),
      body: Text("错误界面"),
    );
  }
}

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容