Flutter - 如何在列中填充 GridView 项目，而不是在行中

Question

目前这是将项目添加到GridView.builder的顺序：

我的问题是——如何让它们按这个顺序添加？

GridView 的滚动方向必须保持垂直。

这是我正在使用的GridView 的示例：

Widget gridViewBuilder () {
  return GridView.builder(
     gridDelegate: 
        new SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 2,
          mainAxisSpacing: 1,
        ),
       itemCount: 3,
       itemBuilder: (BuildContext context, int i) {
          itemForGridview(i, context);
  );
}

Answer 1

我认为GridView.builder 不可能有这种行为。这是一个简单的解决方法。

您可以将Row 与n Column 一起使用，其中n 是GridView 中的CrossAxisCount。 然后我们简单地划分数据并将第一半分配给第一个Column，将剩余的分配给第二个Column。

final List<int> numbers = List.generate(10, (index) => index);

Row(
  children: [
    Column(
      children: List.generate(numbers.length ~/ 2,
          (index) => getContainer(numbers[index].toString())).toList(),
    ),
    Column(
      children: List.generate(
          numbers.length ~/ 2,
          (index) => getContainer(
              numbers[numbers.length ~/ 2 + index].toString())).toList(),
    ),
  ],
);

getContainer 可以是任何想要的小部件。为简单起见，我们采用一个 Container。

Widget getContainer(String number) {
  return Padding(
    padding: EdgeInsets.all(8),
    child: Container(
      color: Colors.green,
      width: 100,
      height: 100,
      alignment: Alignment.center,
      child: Text(
        number,
      ),
    ),
  );
}