flutter 传值到android flutter传递参数

       这里主要介绍页面跳转的时候参数的传递和接受。用在程序上解释就是比如你进入一个商品选择列表，当你想选择一个商品的具体信息的时候，你就要传递商品编号，详细页面接受到编号后，显示出不同的内容。

知识点： 

一、Awesome Flutter snippets组件的使用

       我们的代码有些多，这时候我们要加快敲代码的速度，可以使用VSCode 中的Awesome Flutter snippets插件。它可以帮忙我们快速生成常用的Flutter代码片段。比如输入stlss就会给我们生成如下代码：

class name extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: child,
    );
  }
}

二、声明数据结构类

Dart中可以使用类来抽象一个数据，比如我们模仿一个商品信息，有商品标题和商品描述。我们定义了一个Product类，里边有两个字符型变量，title和description。

• title:是商品标题。
• description: 商品详情描述

代码如下:

class Product{
  final String title;   //商品标题
  final String description;//商品描述
  Product(this.title,this.description);
}

 三、构建一个商品列表

作一个商品的列表，这里我们采用动态的构造方法，在主方法里传递一个商品列表（List）到自定义的Widget中。

先来看看主方法的编写代码:

void main(){
  runApp(MaterialApp(
    title:'数据传递案例',
    home:ProductList(
      products:List.generate(
        20, 
        (i)=>Product('商品 $i','这是一个商品详情，编号为:$i')
      ),
    )
  ));
}

上面的代码是主路口文件，主要是在home属性中，我们使用了ProductList，这个自定义组件，而且时候会报错，因为我们缺少这个组件。这个组件我们传递了一个products参数，也就是商品的列表数据，这个数据是我们用List.generate生成的。并且这个生成的List原型就是我们刚开始定义的Product这个类（抽象数据）。

ProductList自定义组件的代码：

class ProductList extends StatelessWidget{
  final List<Product> products;
  ProductList({Key key,@required this.products}):super(key:key);
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title:Text('商品列表')),
      body:ListView.builder(
        itemCount:products.length,
        itemBuilder: (context,index){
          return ListTile(
            title:Text(products[index].title),
            onTap:(){
            }
          );
        },
      )
    );
  }
}

 先接受了主方法传递过来的参数，接受后用ListView.builder方法，作了一个根据传递参数数据形成的动态列表。

四、demo总源码如下：

import 'package:flutter/material.dart';
//定义一个商品类
class Product{
  final String title;   //商品标题
  final String description;//商品描述
  Product(this.title,this.description);
}

void main() {
  runApp(MaterialApp(
     title: '商品数据的传递和接收案例',
     //生成一个商品列表
     home: ProducList(
       //用List.generate生成商品数据
       products:List.generate(20, (i)=>Product('商品:$i','这是一个商品描述，编号是$i'))
     ),
  ));
}
class ProducList extends StatelessWidget {
  final List<Product> products;
  //接收主方法传递过来的参数(构造方法)
  ProducList({Key key,@required this.products}):super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('商品列表'),),
      //用ListView.builder方法，作了一个根据传递参数数据形成的动态列表
      body: ListView.builder(
        itemCount: products.length,
        itemBuilder: (context,index){//构建item
          return ListTile(
            title: Text(products[index].title),
            onTap: (){},//item的点击事件
          );
        },
      ),
    );
  }
}

 五、运行效果如下：