导航参数的传递和接收-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),)),
    );
  }
}