Question

我用ExpansionTiles构建一个ListView。这些图块包括许多CheckboxListTile。我必须处理所有复选框，但是我不知道该怎么做。有人可以帮我吗？

class _HomePageState extends State<HomePage> {
List<String> Test = [];
List<String> Test2 = [];
List<bool> listBool = [];

@override
void initState() {
super.initState();

for(int i = 0; i <= 10; i++)
  {
    Test.add("Test $i");
    Test2.add("Hund $i");
    listBool.add(false);
  }
}

buildCheckBoxListTile() {
  List<Widget> listTile = [];

  for (int i = 0; i < Test2.length; i++)
    listTile.add(
      new CheckboxListTile(
        title: Text(Test2[i]),
        secondary: Row(
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            IconButton(
                icon: Icon(Icons.add),
                onPressed: null
            ),
            Text("Count"),
            IconButton(
                icon: Icon(Icons.remove),
                onPressed: null
            ),
          ],
        ),
        value: listBool[i],
        onChanged: (bool value){
          setState(() {
            listBool[i] = value;
          });
        },
        controlAffinity: ListTileControlAffinity.leading,
      ),
    );

return listTile;
}

Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(title: Text("Einkauslsite")),
    body: Column(
      children: <Widget>[
        Expanded(
            child: StreamBuilder(
              builder: (BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot){
              return ListView.builder(
                itemCount: Test.length,
                itemBuilder: (context, index){
                  return  ExpansionTile(
                    title: Text(Test[index]),
                    children: buildCheckBoxListTile(),
                  );
                },
              );
            },
          ),
      ),
    ],
  ),
);
}
}

我将使用Streambuilder从Firestore读取文件。如何处理大量的Checkbox价值？我认为应该是100或150。有什么想法吗？

感谢您的帮助

Answer 1

出于可读性考虑，我真的建议创建某种类型的数据类来保存单个ListView的数据，而不是维护三个单独的列表，如果您做更多的工作，它们很容易不同步。

关于“大量物品”：如果大约100或150，那应该没问题。如果数据集变得非常庞大（例如成千上万个），则可能需要对API进行分页。如果是这种情况，您可能要签出my answer to this question或this one。

要获取有关如何构建数据的灵感，请查看以下代码：

class MyItem {
  MyItem({
    @required this.name,
    @required this.subtext,
    this.isSelected = false
  });

  final String name;
  final String subtext;
  bool isSelected;
}

...

class _HomePageState extends State<HomePage> {
  List<MyItem> items = [];

  @override
  void initState() {
    super.initState();

    for (int i = 0; i <= 10; i++) {
      items.add(MyItem(
        name: "Test $i",
        subtext: "Hund $i"
      ));
    }
  }

  Widget _buildItem(MyItem item) {
    return CheckboxListTile(
      title: Text(item.name),
      secondary: Row(
        mainAxisSize: MainAxisSize.min,
        children: <Widget>[
          IconButton(icon: Icon(Icons.add), onPressed: null),
          Text("Count"),
          IconButton(icon: Icon(Icons.remove), onPressed: null),
        ],
      ),
      value: item.isSelected,
      onChanged: (bool value) => setState(() {
        item.isSelected = value;
      }),
      controlAffinity: ListTileControlAffinity.leading,
    );
  }

  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("Einkaufsliste")),
      body: StreamBuilder(
        builder: (BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) {
          return ListView.builder(
            itemCount: items.length,
            itemBuilder: (ctx, i) => _buildItem(items[i])
          );
        },
      ),
    );
  }
}

如何为大量的CheckboxListTiles创建布尔值？

1 个答案: