flutter Warp按照宽高自动换行布局

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: "Warp按照宽高自动换行布局",
      home: Scaffold(
        appBar: AppBar(
          title: Text("Warp按照宽高自动换行布局"),
        ),
        body: Wrap(
          spacing: 8.0, //chip之间的间距大小
          runSpacing: 4.0, //行之间的间距大小
          children: <Widget>[
            Chip(
              avatar: CircleAvatar(
                backgroundColor: Colors.lightBlueAccent.shade400,
                child: Text(
                  '西门',
                  style: TextStyle(fontSize: 10),
                ),
              ),
              label: Text('西门吹雪'),
            ),
            Chip(
              avatar: CircleAvatar(
                backgroundColor: Colors.lightBlueAccent.shade400,
                child: Text(
                  '一郎',
                  style: TextStyle(fontSize: 10),
                ),
              ),
              label: Text('萧十一郎'),
            ),
            Chip(
              avatar: CircleAvatar(
                backgroundColor: Colors.lightBlueAccent.shade400,
                child: Text(
                  '周',
                  style: TextStyle(fontSize: 10),
                ),
              ),
              label: Text('周杰伦'),
            ),
            Chip(
              avatar: CircleAvatar(
                backgroundColor: Colors.lightBlueAccent.shade400,
                child: Text(
                  '一郎',
                  style: TextStyle(fontSize: 10),
                ),
              ),
              label: Text('萧十一郎'),
            ),
            Chip(
              avatar: CircleAvatar(
                backgroundColor: Colors.lightBlueAccent.shade400,
                child: Text(
                  '一郎',
                  style: TextStyle(fontSize: 10),
                ),
              ),
              label: Text('萧十一郎'),
            ),
            Chip(
              avatar: CircleAvatar(
                backgroundColor: Colors.lightBlueAccent.shade400,
                child: Text(
                  '一郎',
                  style: TextStyle(fontSize: 10),
                ),
              ),
              label: Text('萧十一郎'),
            ),
          ],
        ),
      ),
    );
  }
}