如何在 gridview.count flutter 中创建分区

Posted 2023-03-06

【中文标题】如何在 gridview.count flutter 中创建分区

【英文标题】：How to create divisions in gridview.count flutter

【发布时间】：2022-01-05 19:16:57

【问题描述】：

所以我有一个 9x9 网格，我想分成 3x3 网格，在后端它应该保持 9x9 网格，但在 UI 中它应该看起来好像它被分成 3x3 网格。它应该看起来像这样，忽略颜色。我正在寻找 3x3 网格之间的边距

【参考方案1】：

我们可以使用Container边框，

  body: GridView.count(
        crossAxisCount: 3,
        children: [
          ...List.generate(
            9,
            (index) => Container(
              decoration: BoxDecoration(
                border: Border.all(
                  width: 3,
                  color: Colors.blue,
                ),
              ),
              alignment: Alignment.center,
              child: GridView.count(
                physics: NeverScrollableScrollPhysics(),
                crossAxisCount: 3,
                children: [
                  ...List.generate(
                    9,
                    (index) => Container(
                      decoration: BoxDecoration(
                        border: Border.all(
                          width: 1,
                          color: Colors.grey,
                        ),
                      ),
                      alignment: Alignment.center,
                      child: GridView.count(
                        crossAxisCount: 3,
                      ),
                    ),
                  )
                ],
              ),
            ),
          )
        ],
      ),
   

【讨论】：

有没有办法只使用 1 个 gridview 来做到这一点？

是的，在 border 上传递 null 就像 selectedItem.contains(index)?Border():null 一样