provide a easy way to know the percentage of animation?

For example, I change a cube’s x position using spring, and want the background-color to change proportion to the percentage of animation. Is it possible?

[nkbt]

@lzl124631x you can animate arbitrary numbers with react motion, and derive color from that number. Effectively:

 <Motion style={{value: spring(255)}} >
  {({value}) => {
    const color = `rgb(${value}, ${value}, ${value})`;
  }}
</Motion>

[sompylasar]

@tannerlinsley Good job there! I meant one cannot get the time-based percentage because the time moment when physical animation ends is not known in advance, without premodeling it. The value-based percentage can definitely be obtained, that’s what is in the block you’ve shown. And it might overshoot in case of a spring (the complex easing curves can, too, so it should be fine).