React-motion: Increase linear animation, spring is not a wise choice

[cloudfroster]

When I want to accomplish a basic linear transition, I'm confused. i can only use spring effect.

Although it can be introduced to adjust the parameters of the elastic effect, but the effect is not particularly good. you will see issue like #235.

And the most basic reason is that spring effect caused. can we export a linear effect? then we can do something like:

// linear(value, duration)
<Motion defaultStyle={{x:0}} style={{x: linear(100, 2)}}
{process =>
 <div>process.x</div>   // number will linear transition
}
<Motion>

and we can custom Bessel curve.

// linear(value, duration)
<Motion defaultStyle={{x:0}} style={{x: linear(100, 2)}}

{process =>
 process = BesselCurve(process)
 <div>process.x</div>
}
<Motion>

i think that is very useful.

Welcome to discuss.

[chenglou]

The library handle only spring effects for now because it's a sweet spot in terms of UX (interruptible animation and general feel?) and API design. There were discussions on adding normal easing curves; I'm considering them for the future.

[cloudfroster]

ok ,i see. but i think linear effects may be better. beause development can be based on linear effect to complete the new effect.

thx, Looking forward to the arrival of new effects.

[subhero24]

I would also like a linear animation option.

I am creating some math animations for my students. As these math objects do not represent physical things some of my animations would look a lot better when interpolated linearly.

[guopengliang]

+1 for interruptible linear transition options.

I love the idea of React-Motion that animation should be interruptible. This makes the UI more realistic and responsive. While spring effects are nice, sometimes we need to create transitions that feel "accelerating" (like an object accelerates from ZERO velocity and moves out of the view).

I was wondering if there is any way we could achieve such effects while keeping the interruptibility? What about a velocity option?