flutter(基础一) MaterialApp组件

路由简介

 FlatButton(
            onPressed: (){
           // 跳转到第二页 只需要调用Navigator 的push方法
               Navigator.of(context).pushNamed("/scend");
             },
             child: Text("点击跳转到第二页"),
           ),


onPressed: (){
              // 触发方法返回上一页
              Navigator.of(context).pop();
        },
            child: Text("点击跳转第一页面 Navigator.of(context).pop() ")

     ),

initialRoute: "/",  // 初始化路由
    routes: {
      "/":(context) => DemoList(),
      "/loading":(context) => Loading(),
      "/home":(context) => Home(),
      "/location":(context) => ChooseLocation(),
      "/firstPage":(context) => RouterDemo(),
      "/scend":(BuildContext context) => ScendPage(),
    },

 MaterialApp路由观察者 全局监听路由堆栈变化

 // 监听所有的页面
    navigatorObservers: [
      // 创建自定义路由监听
      MyNavigatorObservers(),
    ],

import 'package:flutter/cupertino.dart';
import 'package:flutter/cupertino.dart';
class MyNavigatorObservers extends NavigatorObserver{
  // 当调用Navigator.pop时回调
  @override
  void didPush(Route route, Route? previousRoute) {
    // TODO: implement didPop
    super.didPush(route, previousRoute);
    print("didPush router setting is" + route.settings.toString());
    print("didPush route setting.name is" + route.settings.name.toString());
    if(previousRoute != null){
      print("didPush previousRoute settings is " + previousRoute.settings.toString());
    print("didPush previousRouter settings.name is" + previousRoute.settings.name.toString());

    }
    
  }
  // 当调用Navigator.push时回调

  @override
  void didPop(Route route, Route? previousRoute) {
    // TODO: implement didPush
    super.didPop(route, previousRoute);
    print("didPop router setting is" + route.settings.toString());
    print("didPop route setting.name is" + route.settings.name.toString());
    if(previousRoute != null){
      print("didPop previousRoute settings is " + previousRoute.settings.toString());
      print("didPop previousRouter settings.name is" + previousRoute.settings.name.toString());

    }
    
  }


}

import 'package:flutter/material.dart';
import 'package:untitled/pages/error_page.dart';
import 'package:untitled/pages/my_navigator_observes.dart';
import 'pages/home.dart';
import 'pages/choose_location.dart';
import 'pages/loading.dart';
import 'pages/demo_list.dart';
import 'pages/routes_demo.dart';
import 'pages/scendPage.dart';

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      // title android 任务视图中显示的应用的名称，与ios没有任何关系，在ios中不起任何作用
      // 在ios中 任务视图的名称取的是 info.plist 文件中CFBundleDispLayName 或者CFBundleName
      title: "Flutter Demo",
      // 设置主题
      // 用来定义应用所使用的主题颜色
      // homeData 是MateialDesign Widget库的主题数据，Material库的Widget需要遵守相应设计规范
      theme: ThemeData(
        // primarySwatch 用于导航栏 ，FloatingActionButton的背景色等
        primarySwatch: Colors.green,
        // 配置应用程序的亮色 暗色 dark 白天和黑夜模式的切换
        brightness: Brightness.light,
        // 配置应用程序的主背景色
        primaryColor:Colors.blue,
        // 配置应用程序的前景色
        // 例如 进度条的前景色 开关 switch 选中的颜色 ，单选框 Radio 选中的颜色
        // 例如 输入框光标的颜色以及文本输入框默认下划线的颜色
        accentColor: Colors.red,
        // 用来配置应用程序中 AppBar 显示的样式
        appBarTheme: AppBarTheme(
          // 用来配置appBar 的背景色
          color: Colors.deepPurple,
          // 用来配置appbar 的阴影高度
          elevation:10.0,
          // 用来配置icon主题
          iconTheme: IconThemeData(
            // 用来配置appbar 上图标的颜色
            color: Colors.yellow,
            // 用来配置appbar 上图标的大小
            size: 33.0,
            // 透明度
            opacity: 0.3,
          ),
          actionsIconTheme: IconThemeData(
            color: Colors.red,
            size: 28.0,
            opacity: 1.0,
          )
        ),
        // 用来配置应用程序内Icon 的样式
        iconTheme: IconThemeData(
          color: Colors.red,
          size: 44.0,
          opacity: 1.0
        ),
        // 用来配置应用程序内 Button 的样式
        buttonTheme: ButtonThemeData(
          // 文字颜色样式
          textTheme: ButtonTextTheme.normal,
          // 默认是 36.0
          height: 44.0,
          // 默认是
          minWidth: 60.0,
          highlightColor: Colors.deepPurple,
          // 不可点击时的颜色
          disabledColor: Colors.grey,
          // RaisedButton 等使用的背景色
          buttonColor: Colors.green,
          // 轻触时的水波纹颜色
          splashColor: Colors.yellow,
          // 鼠标悬停状态，悬停时使用的背景颜色
          hoverColor: Colors.blue,
          // 获取焦点时的颜色
          focusColor: Colors.red,

        )

      ),
    debugShowCheckedModeBanner: false, // 是否显示调试标识
    initialRoute: "/",  // 初始化路由
    routes: {
      "/":(context) => DemoList(),
      "/loading":(context) => Loading(),
      "/home":(context) => Home(),
      "/location":(context) => ChooseLocation(),
      "/firstPage":(context) => RouterDemo(),
      "/scend":(BuildContext context) => ScendPage(),
    },
    // 配置404页面
    onGenerateRoute: (RouteSettings settings){
      return new MaterialPageRoute(builder: (BuildContext context) => ErrorPage());
    },
    // 监听所有的页面
    navigatorObservers: [
      // 创建自定义路由监听
      MyNavigatorObservers(),
    ],
  );
    
    
  }
}