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

Posted 2023-02-23

【中文标题】Listview滚动到具有可变高度的小部件

【英文标题】：Listview Scrolling to widget with variable height

【发布时间】：2019-07-18 08:53:24

【问题描述】：

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

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 像素）没有问题，但我不知道如何计算列表中小部件的高度，以便用户可以在列表项之间滚动。

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

【参考方案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);
    
  

【讨论】：

谢谢@miguelpruvio - 我如何分配这些键？我已经看到完全按照您的解释进行操作的示例，但它们不处理多个项目

列表中的项目都是一样高的吗？

不，这就是问题 ;)