简介

ListBody “列表组件”

作用是按给定的轴方向，按照顺序排列子节点。
是一个不常直接使用的控件，一般都会配合ListView或者Column等控件使用。

基本用法

布局行为

在主轴上，子节点按照顺序进行布局，在交叉轴上，子节点尺寸会被拉伸，以适应交叉轴的区域。
在主轴上，给予子节点的空间必须是不受限制的（unlimited），使得子节点可以全部被容纳，ListBody不会去裁剪或者缩放其子节点。
ListBody的布局代码非常简单，根据主轴的方向，对子节点依次排布。

实例演示

import 'package:flutter/material.dart';

/*
* Checkbox 默认ListBody的实例
* */
class ListBodyFullDefault extends StatefulWidget {
  const ListBodyFullDefault() : super();

  @override
  State<StatefulWidget> createState() => _ListBodyFullDefault();
}

/*
* ListBody 默认的实例,有状态
* */
class _ListBodyFullDefault extends State {
  @override
  Widget build(BuildContext context) {
    return ListBody(
      // ...  // 如果没有,就是不需要有状态的 StatefulWidget
    );
  }
}

/*
* ListBody 默认的实例,无状态
* */
class ListBodyLessDefault extends StatelessWidget {
  final widget;
  final parent;

  const ListBodyLessDefault([this.widget, this.parent])
      : super();

  @override
  Widget build(BuildContext context) {
    return ListBody(
          mainAxis: Axis.vertical, // 排列的主轴方向
          reverse: false, // 是否反向
          children: <Widget>[
            Container(color: Colors.red,
                width: 50.0,
                height: 150.0,
                child: Text('标题1', style: TextStyle(color: Color(0xffffffff)))),
            Container(color: Colors.yellow,
                width: 50.0,
                height: 50.0,
                child: Text('标题2', style: TextStyle(color: Color(0xffffffff)))),
            Container(color: Colors.green,
                width: 50.0,
                height: 50.0,
                child: Text('标题3', style: TextStyle(color: Color(0xffffffff)))),
            Container(color: Colors.blue,
                width: 50.0,
                height: 50.0,
                child: Text('标题4', style: TextStyle(color: Color(0xffffffff)))),
            Container(color: Colors.black,
                width: 50.0,
                height: 50.0,
                child: Text('标题5', style: TextStyle(color: Color(0xffffffff))))
          ],
        );
  }
}