Flutter PageView内嵌ListView.builder滚动时条目颜色溢出是什么原因？

问题原因 #

你自定义的NoGlowingScrollBehavior重写buildOverscrollIndicator时直接返回了子组件，在移除Android滚动默认波纹效果的同时，也去掉了滚动组件默认的边界裁剪逻辑，导致列表滚动到首尾两端时，超出可视区域的条目内容没有被裁剪，就出现了颜色溢出滚动区域的问题。

解决方案 #

任选其中一种即可：

• 方案1：给HoursTab中的ListView.builder添加clipBehavior属性，主动开启边界裁剪

child: ListView.builder(
  clipBehavior: Clip.hardEdge, // 添加该行
  itemCount: 10,
  // 其余原有代码保持不变
)

• 方案2：修改NoGlowingScrollBehavior的实现，移除波纹的同时保留裁剪能力

class NoGlowingScrollBehavior extends ScrollBehavior {
  @override
  Widget buildOverscrollIndicator(BuildContext context, Widget child, ScrollableDetails details) {
    // 只移除发光效果，保留滚动边界裁剪
    return ClipRect(child: child);
  }
}

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