Skip to main content

measureSpring()

从 v2.0.8 版本开始可用

基于 spring() 配置和帧率，返回弹簧动画稳定所需的时间。

tsx
import { measureSpring, SpringConfig } from "remotion";
 
const config: Partial<SpringConfig> = {
  damping: 200,
};
 
measureSpring({
  fps: 30,
  config: {
    damping: 200,
  },
}); // => 23
tsx
import { measureSpring, SpringConfig } from "remotion";
 
const config: Partial<SpringConfig> = {
  damping: 200,
};
 
measureSpring({
  fps: 30,
  config: {
    damping: 200,
  },
}); // => 23
info

理论上，弹簧动画永远不会结束。弹簧中总是会留有微小的能量，导致微小的运动。因此，我们设置一个阈值来定义何时认为弹簧动画已完成。

参数​

一个具有以下键的对象：

fps​

弹簧动画基于的帧率。

threshold​

可选 - 默认值: 0.005

定义动画应何时被视为已完成。0.01 意味着动画在始终保持在 to 值的 1% 范围内时被视为已完成。例如，从 0 到 1 的动画在结束点后，当值永远不离开范围 [0.99, 1.01] 时被视为已完成。

较低的值意味着弹簧持续时间更长，较高的值导致弹簧持续时间更短。

config?​

可选

您传递给 spring() 的弹簧配置。

from?​

可选 - 默认值: 0

动画的初始值。

to?​

可选 - 默认值: 1

动画的结束值。请注意，根据参数设置，弹簧动画可能会在最终目标之前稍微超过目标，然后反弹回最终目标。

另请参阅​