Flutter 是否支持级联网格？答案

【问题标题】：Does Flutter support cascading grids?Flutter 是否支持级联网格？
【发布时间】：2018-04-26 20:21:34
【问题描述】：

Flutter 是否支持级联网格样式布局，例如：

【问题讨论】：

【解决方案1】：

您可以在一行中创建 4 个 Expanded，并在每个 Expanded 中添加一列容器：

下面是我运行的代码并给出了你想要的确切结果：

new Row(
                children: <Widget>[
                    new Expanded(
                        child: new Column(
                            children: <Widget>[
                                new Container(
                                    height: 50.0,
                                    color: Colors.grey,
                                    margin: new EdgeInsets.all(10.0),
                                ),
                                new Container(
                                    height: 24.0,
                                    color: Colors.grey,
                                    margin: new EdgeInsets.all(10.0),
                                ),
                                new Container(
                                    height: 150.0,
                                    color: Colors.grey,
                                    margin: new EdgeInsets.all(10.0),
                                ),
                            ],
                        ),
                    ),
                    new Expanded(
                        child: new Column(
                            children: <Widget>[
                                new Container(
                                    height: 140.0,
                                    color: Colors.grey,
                                    margin: new EdgeInsets.all(10.0),
                                ),
                                new Container(
                                    height: 90.0,
                                    color: Colors.grey,
                                    margin: new EdgeInsets.all(10.0),
                                ),
                                new Container(
                                    height: 58.0,
                                    color: Colors.grey,
                                    margin: new EdgeInsets.all(10.0),
                                ),
                            ],
                        ),
                    ),
                    new Expanded(
                        child: new Column(
                            children: <Widget>[
                                new Container(
                                    height: 20.0,
                                    color: Colors.grey,
                                    margin: new EdgeInsets.all(10.0),
                                ),
                                new Container(
                                    height: 220.0,
                                    color: Colors.grey,
                                    margin: new EdgeInsets.all(10.0),
                                ),
                                new Container(
                                    height: 50.0,
                                    color: Colors.grey,
                                    margin: new EdgeInsets.all(10.0),
                                ),
                            ],
                        ),
                    ),
                    new Expanded(
                        child: new Column(
                            children: <Widget>[
                                new Container(
                                    height: 50.0,
                                    color: Colors.grey,
                                    margin: new EdgeInsets.all(10.0),
                                ),
                                new Container(
                                    height: 150.0,
                                    color: Colors.grey,
                                    margin: new EdgeInsets.all(10.0),
                                ),
                                new Container(
                                    height: 100.0,
                                    color: Colors.grey,
                                    margin: new EdgeInsets.all(10.0),
                                ),
                            ],
                        ),
                    ),
                ],
            )

结果如下：

【讨论】：

坏主意。对于庞大的数据集，这将产生可怕的性能（由于即使在屏幕外也会渲染所有内容）。

【解决方案2】：

您可以将CustomScrollView 或SliderGrid 与自定义gridDelegate 一起使用

【讨论】：