如何在绘制之前知道小部件的大小？

Question

我正在尝试使用AnimatedContainer 来实现用户按下时的展开效果的简单动画（类似于ExpandableTile）。

我的问题是这个容器在展开时可以有 10.0 的高度或 1000.0（它必须是动态的）。好的，要对其进行动画处理，它需要事先知道高度，这是有道理的。但是在渲染它之前我怎么知道它的最大高度（我要渲染可以有 1 到 N 行的文本）。

我想了很多可能性，但似乎没有一个适合。大多数时候，我们从已经渲染的东西中获取大小，从RenderBox，而不是相反，所以这让我很烦。

提前谢谢你！

Answer 1

我最终通过使用非常适合这种情况的Offstage 小部件找到了解决方案。

解决方案

将子树包装在Offstage 中并为其分配一个键（可以是GlobalKey），然后，在实际渲染它之前，我可以通过以下操作获得它的高度：

  void _getWidgetHeight() {
    if (subtreeHeight == null) {
      RenderBox renderBox = key.currentContext.findRenderObject();
      subtreeHeight = renderBox.size.height;
    }
    setState(() {
      _isOffstage = false;
    });
  }

这样，如果你有一个AnimatedContainer，例如，并且需要动画到它的最终大小，你可以有以下：

AnimatedContainer(
        duration: Duration(milliseconds: 250),
        height: subtreeHeight ?? 100.0 // some default size,
      ...
  )

它会相应地渲染。

请注意，确保子树中的内容可以插入到 Container 中，而它正在制作动画（例如，如果您在 Column 中使用它，则将 Offstage 包装在 Flexible 中或Row)。