升级Flutter 3.32.3后pull_to_refresh下拉刷新阻尼过小振荡过大

Flutter鸿蒙梁典典学院2025-06-21 17:10

修复方法自定义调整回弹属性springDescription

dart 复制代码

RefreshConfiguration(
      footerTriggerDistance: 15,
      dragSpeedRatio: 0.9,
      springDescription: const SpringDescription(
        mass: 1.0, //质量越大，惯性越大，运动越慢
        stiffness: 150, //刚度 - 值越大，弹簧越硬，回弹力越强
        damping: 16.0,//值越大，运动越快停止，减少振荡
      ),
      headerBuilder: () => const ClassicHeader(),
      // 配置默认头部指示器,假如你每个页面的头部指示器都一样的话,你需要设置这个
      footerBuilder: () => const ClassicFooter(),
      // 配置默认底部指示器
      enableLoadingWhenNoData: false,
      enableRefreshVibrate: false,
      //下拉刷新振动
      enableLoadMoreVibrate: false,
      //上拉加载振动
      hideFooterWhenNotFull: false,
      // Viewport不满一屏时,禁用上拉加载更多功能
      enableBallisticLoad: true,
      // 可以通过惯性滑动触发加载更多
      shouldFooterFollowWhenNotFull: (state) {
        // If you want load more with noMoreData state ,may be you should return false
        return false;
      },
      child: child!,
    );

我来解释一下 SpringDescription 中这三个属性的含义：

mass (质量):

值设置为 1.0
这个值模拟了物理弹簧系统中物体的质量
质量越大，惯性越大，运动越慢
质量越小，运动越快，响应更灵敏

stiffness (刚度):

值设置为 150
表示弹簧的硬度或弹性系数
值越大，弹簧越硬，回弹力越强
值越小，弹簧越软，回弹力越弱

damping (阻尼):

值设置为 16.0
控制弹簧运动的阻力
值越大，运动越快停止，减少振荡
值越小，运动持续时间更长，振荡更明显

这三个参数共同决定了下拉刷新时的动画效果：

当前配置（mass: 1.0, stiffness: 150, damping: 16.0）会产生一个相对平滑、有适当弹性的下拉刷新效果
下拉时会有一定的弹性感，但不会过度振荡
松手后会有一个自然的回弹动画

这些参数可以根据需要调整来获得不同的动画效果：

想要更快的响应：可以减小 mass 或增加 stiffness
想要更柔和的动画：可以减小 stiffness 或增加 damping
想要更明显的弹性效果：可以减小 damping