以网格为中心的颤振布局

Question

我正在尝试创建一个 Flutter 布局，屏幕中央有 6x6 方桌（网格），网格上方/下方有一些元素。这样做的最佳方法是什么？

我已经实现了居中网格

Center() => AspectRatio(aspectRatio: 1) => GridView();

但是如何放置其余元素？我考虑过使用 Stack() 但决定这不是最好的解决方案。或者我应该使用 Row() 小部件来做到这一点，如果是这样，我如何在中心对齐行的第二个孩子？

谢谢你的帮助！

UPD：这是我打算做的事情的图片。我想在网格下方和上方再放置两个容器，并希望它们填满所有可用空间

Answer 1

有一个非常简单的方法。

只需设置shrinkWrap: true使GridView占用最小空间并GridView用Center小部件包装。

  body: Center(
    child: GridView.count(
      shrinkWrap: true,
      crossAxisCount: 4,
      children: childrenWidgets,
      childAspectRatio: r,
    ),
  ),

Answer 2

这就是我使用“列”小部件对齐网格下方和上方的元素并“扩展”以使网格在“列”小部件中可见的方法：

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: SafeArea(
      child: Column(children: [
        new Text('app'),
        new Expanded(
            child: new Center(
                child: new Container(
                    height: [EXPECTED_GRID_HEIGHT],
                    child: GridView.count(
                      padding: const EdgeInsets.all(20.0),
                      crossAxisSpacing: 10.0,
                      mainAxisSpacing: 10.0,
                      crossAxisCount: 4,
                      children: [GRID_ELEMENTS],
                    )))),
        new Text('app'),
      ]),
    ));