Listview滚动到具有可变高度的小部件

Question

我有一个列表视图，其中填充了可变高度的文本小部件：

ListView.builder(
    controller: _controller,
    itemCount: items.length,
    itemBuilder: (context, index) {
        return Padding(
        padding: const EdgeInsets.all(8.0),
        child: Text(items[index].text));
    })

我使用 ScrollController (_controller) 为列表设置动画，并在用户单击按钮时向下滚动。

_moveDown() {
    _controller.animateTo(_controller.offset + 100,
    curve: Curves.linear, duration: Duration(milliseconds: 100));
}

我以固定增量滚动（上例中为 100 像素）没有问题，但我不知道如何计算列表中小部件的高度，以便用户可以在列表项之间滚动。

有没有办法获取列表中每个元素的高度？

Answer 1

是的，有。

您需要为您的子小部件提供Key，例如GlobalKey，在您的示例中，它看起来像Padding，然后您可以找到渲染小部件的height。您处理滚动的方法可能是这样的，其中myKey 是每个项目的键。

 void _moveDown(GlobalKey myKey) {
    final keyContext = myKey.currentContext;

    if (keyContext != null) {
      final box = keyContext.findRenderObject() as RenderBox;
      _scrollController.animateTo(_scrollController.offset + box.size.height,
          duration: Duration(milliseconds: 100), curve: Curves.linear);
    }
  }