Flutter bottom overflowed by 64

Flutter 底部溢出或者Widget不显示

这里我们可以用到一个控件Expanded，Expanded是一个用展开Row、Column、或者Flex子控件的一个Widget，用于填充可用空间。相当于Linearlayout里面我们使用weight=1。
代码如下：

 @override
Widget build(BuildContext context) {
return Scaffold(
  appBar: AppBar(title: Text("${post.title}")),
  body: Column(
    children: <Widget>[
      Expanded(
        child: Image.network(
          post.imageUrl,
        ),
      ),
      Container(
        padding: EdgeInsets.all(32.0),
        width: double.infinity,
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[
            Text(
              "${post.title}",
              style: Theme.of(context).textTheme.title,
            ),
            Text(
              "${post.author}",
              style: Theme.of(context).textTheme.subtitle,
            ),
            SizedBox(
              height: 12.0,
            ),
            Text("${post.description}")
          ],
        ),
      ),
    ],
  ),
);
}

我把我的图片用Expanded包裹，得到效果如此下图：

我们可以看一下Expanded的源码：

class Expanded extends Flexible {
/// Creates a widget that expands a child of a [Row], [Column], or [Flex]
/// so that the child fills the available space along the flex widget's
/// main axis.
const Expanded({
Key key,
int flex = 1,
@required Widget child,
}) : super(key: key, flex: flex, fit: FlexFit.tight, child: child);
}

我们发现Expanded 是继承Flexible ，所以刚才的代码改成Flexible 也能同样实现，flex属性用于控制自身在主轴上占据的空间比，默认值为1。