颤动示例中的流程布局

Question

我想在flutter中实现流布局我在sdk中找到了一个名为FLOW的类但是无法找到关于如何使用它的示例代码

这是我想要实现的布局

Answer 1

用Wrap而不是Flow.

Flow是为了更复杂的自定义布局.Wrap用于实现屏幕截图中的布局.

new Wrap(
  spacing: 8.0, // gap between adjacent chips
  runSpacing: 4.0, // gap between lines
  children: <Widget>[
      new Chip(
        avatar: new CircleAvatar(backgroundColor: Colors.blue.shade900, child: new Text('AH')),
        label: new Text('Hamilton'),
      ),
      new Chip(
        avatar: new CircleAvatar(backgroundColor: Colors.blue.shade900, child: new Text('ML')),
        label: new Text('Lafayette'),
      ),
      new Chip(
        avatar: new CircleAvatar(backgroundColor: Colors.blue.shade900, child: new Text('HM')),
        label: new Text('Mulligan'),
      ),
      new Chip(
        avatar: new CircleAvatar(backgroundColor: Colors.blue.shade900, child: new Text('JL')),
        label: new Text('Laurens'),
      ),
  ],
)