想在 Flutter 的同一行添加多个项目

【问题标题】：Want to add multiple items on the same line in Flutter想在 Flutter 的同一行添加多个项目
【发布时间】：2021-11-28 03:25:05
【问题描述】：

在以下代码中，所有项目都显示在单独的行上，即每个项目跨越整行。如何更改代码以便多个项目可以出现在同一行？

在此先感谢 :)

Expanded(
  child: SizedBox(
    child: new ListView.builder(
      shrinkWrap: true,
      scrollDirection: Axis.vertical,
      itemCount: filterStatus == false
        ? allDeals.length
        : filteredDeals.length,
      itemBuilder: (BuildContext ctx, int index) {
        return Container(
          margin: EdgeInsets.only(top: 20.0),
          child: ListTile(...)
        );
      }
    ),
  ),
),

【问题讨论】：

标签： flutter dart flutter-web

【解决方案1】：

如果你想做这样的事情：

您可以使用 GridView.builder。

这是根据屏幕截图构建示例的代码。

GridView.builder(
  gridDelegate: SliverGridDelegateWithMaxCrossAxisExtent(
    maxCrossAxisExtent: 100, // the size of item
    crossAxisSpacing: 10, // margin of 10px top and bottom
    mainAxisSpacing: 10, // margin of 10px left and right
    // the spacing is not applicable on the GridView margins.
  ),
  itemCount: 30,
  itemBuilder: (_, index) {
    return Container(
      color: Colors.blue,
      child: Center(
        child: Text(
          'Item $index',
        ),
      ),
    );
  },
),

【讨论】：