Flutter Container

博客地址：flutterall.com

Container构成以及绘制过程

Container作为Flutter中的用来布局的Widget，可以对子widget进行 绘制(painting)、定位(positioning)、**调整大小(sizing)**操作。

绘制过程（painting)

• transform
  Matrix4 transform

• decoration
  Decoration

• paints the child

• paints the foregroundDecoration

调整大小(sizing)

看下Container 构造方法，下面的大小约束会更好理解。

Container({
   
    Key key,
    this.alignment,
    this.padding,
    Color color,
    Decoration decoration,
    this.foregroundDecoration,
    double width,
    double height,
    BoxConstraints constraints,
    this.margin,
    this.transform,
    this.child,
  })

• 没有子节点的Container试图尽可能大，除非传入的约束(constraints
  )是无限制(unbounded)的，在这种情况下，它们尽可能地小。
• 拥有子节点的Container，大小会按照子节点的大小进行适应。如果Container设置了大小参数（例如：width, height, constraints
  ），则按照Container的大小参数来。

布局行为

由于Container包含了一系列其他的Widget，所以Container得布局行为是由一系列其他的Widget的布局行为组合而成。所以，Container的布局行为比较麻烦。

布局策略顺序

Container tries, in order: to honor alignment, to size itself to the child, to honor the width, height, and constraints, to expand to fit the parent, to be as small as possible.

也就是说，Container会按照下面的这个顺序去进行布局操作：

• 对齐（alignment）
• 调节自身大小去适应子节点
• 优先使用width 、 height、constraints
• 放大自己去填充父节点
• 尽可能的变小

布局策略细分解释

有界是指：bool get hasBoundedWidth => maxWidth < double.infinity;

• 父节点提供了有界(bounded)约束

没有子节点，没有width、height、alignment，但是父节点提供了有界约束（bounded constraints）。

这种情况，Container会自动拓展大小，填充父节点。

class FlutterContainer extends StatelessWidget {
   
  @override
  Widget build(BuildContext context) {
   
    return Container(
      color: const Color(0xFFCDCD00),
      child: Text("hello"),
    );
  }
}

• unbounded constraints

跟上面情况相反，没有子节点，没有width、height、alignment，但是父节点提供了无界约束（unbounded constraints）。

这种情况，Container会尽可能的小。

cla