zoukankan      html  css  js  c++  java
  • 16Flutter中的路由 基本路由 基本路由跳转传值(上)

    /*
    Flutter中的普通路由、普通路由传值、命名路由、命名路由传值
    Flutter中的路由通俗的讲就是页面跳转。在Flutter中通过Navigator组件管理路由导航。
    并提供了管理堆栈的方法。如:Navigator.push和Navigator.pop
    Flutter 中给我们提供了两种配置路由跳转的方式;1.基本路由。2.命名路由
    */
    main.dart
    import 'package:flutter/material.dart';
    import 'pages/Tabs.dart';
    
    void main() {
      runApp(MyApp());
    }
    
    class MyApp extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        // TODO: implement build
        return MaterialApp(
          home: Tabs(),
        );
      }
    }

    pages/Form.dart

    import 'package:flutter/material.dart';
    class FormPage extends StatelessWidget {
      
      String title;
      FormPage({this.title="表单"});
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          floatingActionButton: FloatingActionButton(
            child: Text('返回'),
            onPressed: (){
              Navigator.of(context).pop();
            },
          ),
          appBar: AppBar(
            title: Text(this.title),
          ),
          body: ListView(
            children: <Widget>[
              ListTile(
                title: Text('我是表单页面'),
              ),
              ListTile(
                title: Text('我是表单页面'),
              )
            ],
          ),
        );
      }
    }

    pages/Search.dart

    import 'package:flutter/material.dart';
    class SearchPage extends StatelessWidget {
      const SearchPage({Key key}) : super(key: key);
    
      Widget build(BuildContext context) {
        return Scaffold(
          appBar: AppBar(
            title: Text('我是搜索页面'),
          ),
          body: Text('搜索页面内容区域'),
        );
      }
    }

    pages/Tabs.dart

    import 'package:flutter/material.dart';
    import 'tabs/Home.dart';
    import 'tabs/Category.dart';
    import 'tabs/Setting.dart';
    class Tabs extends StatefulWidget {
      Tabs({Key key}) : super(key: key);
      _TabsState createState() => _TabsState();
    }
    
    class _TabsState extends State<Tabs> {
      int _currentIndex = 0;
      List _pageList=[
        HomePage(),
        CategoryPage(),
        SettingPage()
      ];
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          appBar: AppBar(
            title: Text('Flutter Demo'),
          ),
          bottomNavigationBar: BottomNavigationBar(
              currentIndex: this._currentIndex,
              onTap: (int index) {
                // print(index);
                setState(() {
                  this._currentIndex = index;
                });
              },
              iconSize: 36.0,
              type: BottomNavigationBarType.fixed,
              fixedColor: Colors.red,
              items: [
                BottomNavigationBarItem(icon: Icon(Icons.home), title: Text('首页')),
                BottomNavigationBarItem(
                    icon: Icon(Icons.category), title: Text('分类')),
                BottomNavigationBarItem(
                    icon: Icon(Icons.settings), title: Text('设置')),
              ]),
          body: this._pageList[this._currentIndex],
        );
      }
    }

    pages/tabs/Category.dart

    import 'package:flutter/material.dart';
    import '../Form.dart';
    class CategoryPage extends StatelessWidget {
      const CategoryPage({Key key}) : super(key: key);
    
      @override
      Widget build(BuildContext context) {
        return Column(
          crossAxisAlignment: CrossAxisAlignment.center,
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            RaisedButton(
              child: Text('跳转到表单页面并传值'),
              onPressed: (){
                Navigator.of(context).push(
                  MaterialPageRoute(
                    builder:(context)=>FormPage(title: '我是跳转传值')
                  )
                );
              },
              color: Theme.of(context).accentColor,
              textTheme: ButtonTextTheme.primary
            )
          ],
        );
      }
    }

    pages/tabs/Home.dart

    import 'package:flutter/material.dart';
    import '../Search.dart';
    class HomePage extends StatelessWidget {
      const HomePage({Key key}) : super(key: key);
    
      @override
      Widget build(BuildContext context) {
        return Column(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: <Widget>[
            RaisedButton(
              child: Text('跳转到搜索页面'),
              onPressed: (){
                //页面跳转:
                Navigator.of(context).push(
                  MaterialPageRoute(
                    builder: (context)=>SearchPage()
                  )
                );
              },
              color: Theme.of(context).accentColor,
              textTheme: ButtonTextTheme.primary
            ),
            RaisedButton(
              child: Text('跳转到表单页面并传值'),
              onPressed: (){
                
              },
              color: Theme.of(context).accentColor,
              textTheme: ButtonTextTheme.primary
            )
          ],
        );
      }
    }

    pages/tabs/Setting.dart

    import 'package:flutter/cupertino.dart';
    
    class SettingPage extends StatelessWidget {
      const SettingPage({Key key}) : super(key: key);
    
      @override
      Widget build(BuildContext context) {
        return Container(
          child: Text('设置'),
        );
      }
    }
  • 相关阅读:
    C# Activator.CreateInstance 动态创建类的实例(二)
    C# Activator.CreateInstance 动态创建类的实例(一)
    C#中Activator.CreateInstance()方法用法分析
    C#实现插件的“动态替换”
    Windows Mobile X图标如何销毁窗体而非隐藏
    Windows Mobile 6开发环境搭建
    Mac系统下配置JDK及MAVEN环境变量配置
    通过 mklink 命令创建目录链接实现文件转移
    SQL SERVER 存储过程示例
    BNU 34990 Justice String (hash+二分求LCP)
  • 原文地址:https://www.cnblogs.com/yiweiyihang/p/11468852.html
Copyright © 2011-2022 走看看