Fluter/Dart如何将索引从Listview.builder传递到item小部件

在Flutter中，使用ListView.builder构建列表时，可以通过构造函数将索引传递给每个列表项的小部件。以下是一个简单的示例，展示了如何实现这一点：

基础概念

ListView.builder: 这是一个用于构建长列表的高效小部件，它只在需要时构建列表项。
IndexedWidgetBuilder: 这是一个函数类型，用于构建列表中的每个项，并接收当前项的索引作为参数。

示例代码

假设我们有一个简单的数据列表，并且我们想要在每个列表项中显示该数据以及它的索引。

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('ListView with Index Example')),
        body: ListViewWithIndex(),
      ),
    );
  }
}

class ListViewWithIndex extends StatelessWidget {
  final List<String> items = ['Item 1', 'Item 2', 'Item 3', 'Item 4'];

  @override
  Widget build(BuildContext context) {
    return ListView.builder(
      itemCount: items.length,
      itemBuilder: (BuildContext context, int index) {
        return ListTile(
          title: Text('Index: $index, Value: ${items[index]}'),
        );
      },
    );
  }
}

解释

itemCount: 这个参数告诉ListView.builder列表中有多少项。
itemBuilder: 这是一个回调函数，它为列表中的每一项调用一次。它接收两个参数：BuildContext和当前项的index。
- BuildContext: 提供构建小部件所需的环境信息。
- index: 当前正在构建的项的索引。

在itemBuilder中，我们创建了一个ListTile小部件，并在其中显示了索引和对应的列表项值。