Expanded 延展组件

父类是Flexible，相当于一个fit类型为tight的Flexible组件。可嵌套孩子利用剩余空间对占位空间进行延展。

Expanded基本使用

   <br />【child】 : 孩子   【Widget】<br />【flex】 : 剩余空间分配占比   【int】<br />![image.png](https://cdn.nlark.com/yuque/0/2020/png/326147/1589511520218-12489a33-c8e4-438d-9948-b819dd3ae712.png#align=left&display=inline&height=252&margin=%5Bobject%20Object%5D&name=image.png&originHeight=252&originWidth=412&size=14445&status=done&style=none&width=412)

import 'package:flutter/material.dart';
import '../../../../app/utils/color_utils.dart';
class CustomExpended extends StatefulWidget {
  @override
  _CustomExpendedState createState() => _CustomExpendedState();
}

class _CustomExpendedState extends State<CustomExpended> {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Column(
        children: <Widget>[
          buildRow([0, 0, 0]),
          SizedBox(height: 10,),
          buildRow([0, 0, 1]),
          SizedBox(height: 10,),
          buildRow([1, 1, 1]),
          SizedBox(height: 10,),
          buildRow([2, 3, 3]),
        ],
      ),
    );
  }

  Widget buildRow(List<int> num) {
    return Row(
        children: num.map((e) => Expanded(
              flex: e,
              child: Container(
                alignment: Alignment.center,
                width: 50,
                height: 50,
                color: ColorUtils.randomColor(),
                child: Text(
                  'flex=$e',
                  style: TextStyle(color: Colors.white),
                ),
              ),
            )).toList());
  }
}