效果图
import 'package:flutter/material.dart';
class Product{
final String title;
final String description;
Product(this.title,this.description);
}
main(){
runApp(MaterialApp(
title: '导航的数据传递和接收',
home: ProductList(
// 循环20次
prodcuts:List.generate(20, (i)=> Product('商品 $i', '这是一个商品详情,编号为：$i'))
),
));
}
class ProductList extends StatelessWidget {
// 接受传来的数据
final List<Product> prodcuts;
ProductList({Key key, @required this.prodcuts}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('商品的列表'),),
body: ListView.builder(
// 获取长度
itemCount: prodcuts.length,
itemBuilder: (context,index){
return ListTile(
title: Text(prodcuts[index].title),
// 点击跳转新的页面
onTap: (){
Navigator.push(context, MaterialPageRoute(
// 创建一个要跳转的类，并把参数传递过去
builder: (context)=> ProductDetail(product:prodcuts[index]),
));
},
);
}
),
);
}
}
class ProductDetail extends StatelessWidget {
// 接受跳转的时候传来的数据
final Product product;
ProductDetail({Key key,@required this.product}):super(key:key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('${product.title}'),),
body: Center(
child: Text('${product.description}'),
),
);
}
}
