导航参数的传递和接收-Flutter

导航参数的传递和接收

• 效果
  
• 源代码

  import 'package:flutter/material.dart';
  void main()=>runApp(MaterialApp(
    title: "导航参数的传递和接收",
    home: First(),
  ));
  
  class First extends StatelessWidget{
    //生成0-19的列表
    List<int> i = new List.generate(20, (m)=>m);
    @override
    Widget build(BuildContext context) {
      // TODO: implement build
      return Scaffold(
        appBar: AppBar(
          title: Text("导航参数的传递和接收"),
        ),
        //若干列表用builder方法生成
        body: ListView.builder(
          //列表的数量
          itemCount: 20,
          //列表生成（index从0到19）
          itemBuilder: (context,index){
            //每一个列表都是一个ListTile
            return ListTile(
              title: Text("The square of ${i[index]}"),
              //点击ListTile时
              onTap: (){
                Navigator.push(context, MaterialPageRoute(
                  //用Second类的构造函数传递参数
                  builder: (context)=> new Second(temp: i[index],)
                ));
              },
            );
          },
        ),
      );
    }
  }
  
  class Second extends StatelessWidget{
    //创建临时int对象接收参数
    int temp;
    //Second用来接收参数的构造函数
    Second({Key key,this.temp}):super(key: key);
    @override
    Widget build(BuildContext context) {
      // TODO: implement build
      return Scaffold(
        appBar: AppBar(
          title: Text("The square of ${temp}"),
        ),
        body: Center(child: Text("${temp*temp}",style: TextStyle(fontSize: 30.0),)),
      );
    }
  }