Flutter 动态获取widget宽高

在android中，我们可以直接在元素渲染完成时获取元素大小，直接通过View.getWidth,View.getHeight方法，ios也类似，可以在渲染完成的时候获取到大小。

那么在flutter中，我们获取大小也必须在元素渲染完成的时候才行，而有些应用场景要求在第一时间获取到这个元素的大小。那么怎么在第一时间判断元素渲染完成呢？Flutter中的WidgetsBuiding这个类就可以用来判断:

WidgetsBinding.instance.addPostFrameCallback

这个方法在一帧的最后调用，并且只调用一次。 我们可以先给widget设置一个固定的值，然后利用GlobalKey绑定在你需要获取宽高的widget上，把这个方法绑定在生命周期事件获取实际大小再进行赋值，实际中并不会感受到大小突然变化的感觉。

具体如下：

class Demo1 extends StatefulWidget {
  @override
  _Demo1State createState() => _Demo1State();
}

class _Demo1State extends State<Demo1> {
  GlobalKey _key = GlobalKey();
  num height = 0;

  @override
  Widget build(BuildContext context) {
    return Container(
      key: _key,
      height: height == 0 ? 100 : height,
      child: ...,
    );
  }

  @override
  void didChangeDependencies() {
    WidgetsBinding.instance.addPostFrameCallback(_getContainerHeight);
    super.didChangeDependencies();
  }

  @override
  void didUpdateWidget(Demo1 oldWidget) {
    WidgetsBinding.instance.addPostFrameCallback(_getContainerHeight);
    super.didUpdateWidget(oldWidget);
  }
  
  _getContainerHeight(_){
    height = _key.currentContext.size.height;
  }
}

为什么在这两个方法增加事件绑定，可以参考这里，这里不再累述。