更改 ListView.builder 中的特定 ListTile 图标

Mar*_*rio 0 mobile android dart flutter

我对 Flutter 和 Dart 比较陌生,所以我有一个关于 ListView 操作的问题。目前,下面的代码可以工作并在 ListView 中显示一些基本信息。我将如何实现一个解决方案,以便当我单击特定列表图块时,其图标会更改为其他内容?以下是我目前的股票代码:

import 'package:flutter/material.dart';

void main() => runApp(MaterialApp(
      home: HomePage(),
    ));


class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {

  Widget _getListItemTile(BuildContext context, int index) {
    return Card(
      child: GestureDetector(
        child: ListTile(
          leading: Icon(Icons.check_box_outline_blank),
          title: Text('My Item'),
          onTap: () {},
        ),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('My Test App'),
        centerTitle: true,
      ),
      body: ListView.builder(
        itemCount: 7,
        itemBuilder: _getListItemTile,
      ),
    );
  }
}
Run Code Online (Sandbox Code Playgroud)

chu*_*han 5

您可以复制粘贴运行下面的完整代码您可以通过 代码片段
声明List<bool>并更改leading图标boolList[index]

List<bool> boolList = [true, true, true, true, true, true, true];
...
Card(
      child: GestureDetector(
        child: ListTile(
          leading: boolList[index]
              ? Icon(Icons.check_box_outline_blank)
              : Icon(Icons.place),
          title: Text('My Item'),
          onTap: () {
            boolList[index] = !boolList[index];
            setState(() {});
          },
        ),
      ),
    )
Run Code Online (Sandbox Code Playgroud)

工作演示

在此输入图像描述

完整代码

import 'package:flutter/material.dart';

void main() => runApp(MaterialApp(
      home: HomePage(),
    ));

class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  List<bool> boolList = [true, true, true, true, true, true, true];

  Widget _getListItemTile(BuildContext context, int index) {
    return Card(
      child: GestureDetector(
        child: ListTile(
          leading: boolList[index]
              ? Icon(Icons.check_box_outline_blank)
              : Icon(Icons.place),
          title: Text('My Item'),
          onTap: () {
            boolList[index] = !boolList[index];
            setState(() {});
          },
        ),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('My Test App'),
        centerTitle: true,
      ),
      body: ListView.builder(
        itemCount: boolList.length,
        itemBuilder: _getListItemTile,
      ),
    );
  }
}
Run Code Online (Sandbox Code Playgroud)