Flutter开发中如何实现ListView的360°无限循环滚动效果？

这里提供两种可落地的实现方式，按需选择即可： #

方案1：无依赖原生实现（绝大多数场景适用） #

核心逻辑是利用ListView.builder的无限构建能力，通过下标对真实数据长度取模的方式复用item，初始偏移设置到一个足够大的中间值，避免普通使用场景下碰到边界。

示例代码 #

// 你的真实列表数据
final List<String> realItems = ["条目1", "条目2", "条目3", "条目4"];
// 单个列表项的固定高度，动态高度的话需要自行适配计算
const double itemHeight = 80;

@override
Widget build(BuildContext context) {
  return ListView.builder(
    controller: ScrollController(
      // 初始偏移设置到足够大的位置，按单轮总高度*1000计算，足够普通用户滑几千轮不会碰到边界
      initialScrollOffset: itemHeight * realItems.length * 1000,
    ),
    itemExtent: itemHeight,
    // 不设置itemCount，默认无限构建
    itemBuilder: (context, index) {
      // 处理下标，兼容正负索引实现双向无限滚动
      final actualIndex = (index % realItems.length + realItems.length) % realItems.length;
      return Container(
        alignment: Alignment.center,
        child: Text(realItems[actualIndex]),
      );
    },
  );
}

优缺点 #

• 优点：无任何第三方依赖，实现简单，完全兼容ListView的所有原生配置（水平滚动、分割线、自定义item等）
• 缺点：理论上存在边界（需要连续向同一个方向滑几千轮才会碰到），完全满足99%的业务场景需求

方案2：零边界严谨实现 #

如果你的场景需要完全不存在滚动边界，可以通过CustomScrollView结合自定义Sliver的偏移量重写逻辑实现，核心是在滚动到列表首尾边界的时候，动态重置偏移量到对应位置，用户感知不到跳变。

核心注意点 #

• 提前预计算所有item的高度，避免滚动偏移计算错误
• 偏移重置要放在帧绘制回调里执行，避免出现视觉跳闪
• 水平滚动逻辑完全一致，仅需修改滚动方向参数即可

内容的提问来源于stack exchange，提问作者muhanad alhourani