Flutter-ListView动态列表组件以及循环动态数据

最新推荐文章于 2025-04-17 14:00:00 发布

程序员里的BUG

最新推荐文章于 2025-04-17 14:00:00 发布

阅读量1.4k

点赞数

分类专栏： Flutter 文章标签： flutter android

本文链接：https://blog.youkuaiyun.com/m0_48259951/article/details/129422147

版权

这篇博客探讨了如何利用Flutter的ListView组件及其builder方法创建动态列表。通过指定itemCount和itemBuilder参数，可以轻松地展示循环动态数据。

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

import 'package:flutter/material.dart';
import './fonts.dart';
import 'package:flutter_basic/res/listData.dart';

void main() {
  runApp(MaterialApp(
    home: Scaffold(
      appBar: AppBar(
        title: const Text('hello flutter'),
      ),
      body: const Myapp(),
    ),
  ));
}

class Myapp extends StatelessWidget {
  const Myapp({Key? key}) : super(key: key);
  
  /// 定义组件
  /// 第一种方法：for循环
  // List<Widget> _initListData() {
  //   List<Widget> tempList = [];
  //   for (var i = 0; i < listData.length; i++) {
  //     tempList.add(ListTile(
  //       leading: Image.network("${listData[i]["imageUrl"]}"),
  //       title: Text("${listData[i]["title"]}"),
  //       subtitle: Text("${listData[i]["author"]}"),
  //     ));
  //   }
  //   return tempList;
  // }


  ///第二种方法：map
  List<Widget> _initListData() {
    var tempList = list