Flutter 页面跳转示例

最新推荐文章于 2025-03-05 20:20:33 发布

ACGuan

最新推荐文章于 2025-03-05 20:20:33 发布

阅读量822

点赞数

分类专栏： Flutter

本文链接：https://blog.youkuaiyun.com/csdnlinyongsheng/article/details/92401733

版权

本文详细介绍了Flutter中页面跳转的各种方法，包括使用Navigator、Routes和BottomNavigationBar等组件进行导航操作，同时提供了丰富的代码示例，帮助开发者更好地理解和实践Flutter应用的页面间切换。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

#页面跳转发送数据
import 'package:flutter/material.dart';
void main(){
  runApp(MyApp());
}
class Product{
  final String title;
  final String description;

  Product(this.title, this.description);
}
class MyApp extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return MaterialApp(
      title: "数据传递示例",
      home: new ProductList(
        products: new List.generate(
          20,
            (i) => new Product('商品$i', "这是一个商品详情$i")
        )
      )
    );
  }
}
class ProductList extends StatelessWidget{
  final List<Product> products;
  ProductList({Key key, @required this.products}): super(key:key);

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      appBar: new AppBar(
        title: new Text("商品列表"),
      ),
      body: new ListView.builder(
          itemCount: products.length,
          itemBuilder: (context, index){
            return new ListTile(
              title: new Text(products[index].title),
              onTap: (){
                Navigator.push(context,
                    new MaterialPageRoute(
                    builder: (context) =>
                      new ProductDetail(product:products[ind

最低0.47元/天解锁文章