ListItem.builder 不同的事件点击

Question

如何使用 ListItem.builder 为列表中的元素提供不同的点击事件？(ontapp, onpress)

我不想单独创建单独的 listItem 构建器

 Expanded(
        child: ListView.builder(
            padding: const EdgeInsets.all(8),
            itemCount: entries.length,
            itemBuilder: (BuildContext context, int index) {
              return InkWell(
                onTap: () {},
                child: Container(
                  height: 100,
                  color: index % 2 == 0 ? Colors.white : Colors.grey,
                  child: InkWell(
                    onTap: () {},
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Icon(iconsImage[index]),
                        Text('${entries[index]}'),
                        Icon(Icons.arrow_right)
                      ],
                    ),
                  ),
                ),
              );
            }),
      )

Answer 1

现在您有 2 个不同的列表，它们是 entries 和 iconsImage。而您正试图将它们都迭代到一个 ListView 中。它现在可能会起作用。但这不是一个好的编程概念。您可以定义一个包含条目、图标和功能的新模型。它看起来像这样：

class NewModel {
  String entry;
  IconData iconData;
  Function function;

  NewModel({this.entry, this.iconData, this.function});
}

然后：

  List<NewModel> newModelList = [];

  void generateList() {
    newModelList.add(NewModel(
        entry: 'Privacy',
        iconData: Icons.privacy_tip,
        function: () {
          // GoToPrivacy();
        }));

    newModelList.add(NewModel(
        entry: 'Purchase History',
        iconData: Icons.history,
        function: () {
          // GoToHistory();
        }));

    newModelList.add(NewModel(
        entry: 'Help & Support',
        iconData: Icons.help,
        function: () {
          // GoToHelp();
        }));
  }

然后：

Expanded(
          child: ListView.builder(
              padding: const EdgeInsets.all(8),
              itemCount: newModelList.length,
              itemBuilder: (BuildContext context, int index) {
                return Container(
                  height: 100,
                  color: index % 2 == 0 ? Colors.white : Colors.grey,
                  child: InkWell(
                    onTap: newModelList[index].function, // Here is your function!
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Icon(newModelList[index].iconData),
                        Text('${newModelList[index].entry}'),
                        Icon(Icons.arrow_right)
                      ],
                    ),
                  ),
                );
              }),

ListItem.builder 不同的事件点击

ListItem.builder diffrent event click

flutter

listview

dart

listitem

ListItem.builder 不同的事件点​​击

ListItem.builder diffrent event click

flutter

listview

dart

listitem

ListItem.builder 不同的事件点击