Flutter自定义布局排列：多个子View

简单例子：该例子让多个子View垂直排列

class LinearLayout extends MultiChildRenderObjectWidget {

  LinearLayout({
    Key key,
    List<Widget> child
  }): super(key: key , children: child);

  @override
  RenderObject createRenderObject(BuildContext context) => RenderLayout();
}

class PageParentData extends ContainerBoxParentData<RenderBox> {}

class RenderLayout extends RenderBox with ContainerRenderObjectMixin<RenderBox, PageParentData>,RenderBoxContainerDefaultsMixin<RenderBox, PageParentData>{

  @override
  void setupParentData(RenderBox child) {
    if (child.parentData is! PageParentData)
      child.parentData = PageParentData();
  }

  @override
  void performLayout() {
    //测量自身大小
    size = constraints.constrain(Size(double.infinity,double.infinity));
    double dx = 0, dy = 0;
    RenderBox child = firstChild;
    while(child != null) {
      PageParentData childParentData = child.parentData;
      child.layout(constraints.heightConstraints(), parentUsesSize: true);
      //设置子View的坐标
      childParentData.offset = Offset(dx, dy);
      //dx += child.size.width;
      dy += child.size.height;
      child = childParentData.nextSibling;
    }
  }

  @override
  void paint(PaintingContext context, Offset offset) {
    defaultPaint(context, offset);
  }
}

使用：

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Color(0xffffffff),
      body: Container(
        child: LinearLayout(
          child: <Widget>[
            Text(
                "第一行第一行第一行第一行"
            ),
            Text(
                "第二行第二行第二行第二行第二行"
            ),
            Text(
                "第三行第三行第三行第三行第三行第三行第三行"
            )
          ],
        ),
      ),
    );
  }