Flutter中，如何在没有渲染过部分Item的情况下让ListView滚动到底部？

发布于 1周前 作者 ionicwang 来自 Flutter

_scrollController.position.maxScrollExtent应该是个预估值，滑动到这个位置有一定概率是错误的。超出则会有回弹效果，小于则离底部有些距离。试过两个 lib ，scroll_to_index这个不能直接 jumpto ，只能 animate ，应该和其原理有关。不适用。scrollable_positioned_list这个库支持 jumpto ，但是滚动到最后一项依然会有回弹效果。

我能想到的是提前计算出每个 Item 的高度，但是这在 Flutter 这种布局方式来看好像很困难。（比如 Text 的高度要如何计算出来）

难道这个需求在 Flutter 上无法实现吗？
Flutter中，如何在没有渲染过部分Item的情况下让ListView滚动到底部？


更多关于Flutter中，如何在没有渲染过部分Item的情况下让ListView滚动到底部？的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

Harmonyos Next教程
3 回复

可以在 listview 滚动的时候让它透明,等滚动结束再展示, 如果 jumpto 一次到不了,那就多 jump 几次, text 的高度是可以通过 Textpainter 计算的

更多关于Flutter中，如何在没有渲染过部分Item的情况下让ListView滚动到底部？的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


如果列表不能隐藏的话, 就只能用 scrollable_positioned_list 了,可以关掉回弹效果试试, 如果还是 jump 到错误的位置,那就只能自己算高度了

在Flutter中，如果你希望让ListView滚动到底部，即使部分Item尚未渲染，可以通过使用ScrollController来实现。ScrollController允许你直接控制滚动视图的位置。

以下是一个基本的步骤和示例代码：

  1. 创建ScrollController：首先，你需要创建一个ScrollController实例。
  2. 将其附加到ListView：通过ListView.builder或ListView.separated的controller参数，将ScrollController附加到ListView。
  3. 跳转到底部：使用ScrollController的animateTo方法，配合ScrollPosition.alignTo参数，可以实现平滑滚动到列表底部。

示例代码：

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final controller = ScrollController();

    void scrollToBottom() {
      controller.animateTo(
        controller.position.maxScrollExtent,
        duration: const Duration(seconds: 1),
        curve: Curves.easeInOut
      );
    }

    return MaterialApp(
      home: Scaffold(
        body: ListView.builder(
          controller: controller,
          itemCount: 100,
          itemBuilder: (_, index) => Text('Item $index'),
        ),
        floatingActionButton: FloatingActionButton(
          onPressed: scrollToBottom,
          tooltip: 'Scroll to Bottom',
          child: Icon(Icons.arrow_downward),
        ),
      ),
    );
  }
}

这个示例展示了如何创建一个带有浮动按钮的ListView，点击按钮时会滚动到底部。

回到顶部