Flutter：从现有列表中填充 ListView.builder，每行 2 个小部件

问题描述

到目前为止，我通过从 ListView.builder 获取数据使我的 List<MyCustomWidget> customs 每行显示 2 个小部件失败了。

我的列表就像：

Class CustomWidgetData extends changeNotifier {
  List<CustomWidget> customs = [
    CustomWidget(
      icon: Icons.add,iconColor: Colors.green,),];
}

我的 ListView.builder 就像：

class CustomWidgetListBuilder extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Consumer<CustomWidgetData>(
      builder: (context,customWidgetData,child) {
        return Expanded(
          child: ListView.builder(
            itemBuilder: (context,index){
              final customWidget = customWidgetData.customs[index];
              return Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,children: [
                Expanded(
                  child: CustomWidget(
                    icon:customWidget.icon,iconColor: customWidget.iconColor,//CustomWidget
                ),//Expanded
                ],);//Row
            },itemCount: customWidgetData.customs.lenght,//ListView.builder
        ); //Expanded
      },);//Consumer
  }
}

How I want it to look

How it looks

在第一张图片中，我只在 ListView.builder 的行内添加了其他 Expanded->CustomWidget，但它重复了所有列表，我想要：

1|2
3|4
5|6
...

解决方法

Listview 不适合这个用例。还有另一个名为 GridView 的小部件，它可以生成您想要的网格。

GridView.builder(
        gridDelegate: SliverGridDelegateWithMaxCrossAxisExtent(
            maxCrossAxisExtent: 200,childAspectRatio: 3 / 2,crossAxisSpacing: 20,mainAxisSpacing: 20),itemCount: customWidgetData.customs.length,itemBuilder: (BuildContext context,int index) {
          return Container();
          
        }),