Flutter中Flexible和Expanded区别
在官网的介绍中感觉说的很模糊:
- Flexible:Flexible是一个控制Row、Column、Flex等子组件如何布局的组件,Flexible 组件可以控制 Row、Column、Flex 的子控件占满父组件,比如,Row 中有3个子组件,两边的宽是100,中间的占满剩余的空间
- Expanded:Expanded 继承字 Flexible,fit 参数固定为 FlexFit.tight,也就是说 Expanded 必须(强制)填满剩余空间
首先看下他们的构造:
const Flexible({
Key? key,
this.flex = 1,
this.fit = FlexFit.loose,
required Widget child,
}) : super(key: key, child: child);
const Expanded({
Key? key,
int flex = 1,
required Widget child,
}) : super(key: key, flex: flex, fit: FlexFit.tight, child: child);
构造中看出他们的 FlexFit 参数是不同的
FlexFit是个枚举类型
///
/// * [RenderFlex], the flex render object.
/// * [Column], [Row], and [Flex], the flex wi