timothypratley / reanimated

An animation library for Reagent (ClojureScript)
250 stars 14 forks source link

Support standard easing functions #9

Open rafd opened 8 years ago

rafd commented 8 years ago

I'm used to working with CSS easing functions and thinking in terms of tweens rather than springs (with mass, stiffness, and velocity).

I realize that interpolate-to already supports custom easing functions, but would you consider a PR that added a few standard easing functions to reanimated?

For example: (interpolate-to value {:interpolate :ease-in-out})

timothypratley commented 8 years ago

Hi Rafal,

Absolutely, I would love that. I agree some standard easing functions would be nice to have baked in.

Just as a point of reference the only easing libraries I've looked at are: https://github.com/pleasetrythisathome/bardo https://jqueryui.com/easing/

Either we could use as a reference implementation. We could add bardo as a dependency and instantly have access to

(def ease-fns {:linear  (constantly identity)
               :quad    (constantly quad)
               :cubic   (constantly cubic)
               :poly    poly
               :sine    (constantly sine)
               :circle  (constantly circle)
               :exp     (constantly exp)
               :elastic (constantly elastic)
               :back    (constantly back)
               :bounce  (constantly bounce)})

On thing to note is that the function signature for bardo interpolation is very slightly different from jquery interpolation, and jquery interpolation might be slightly more 'comfortable' for users.

So I think we could either

  1. Create some built in interpolation functions in reanimated itself
  2. Depend on bardo
  3. Wrap jquery interpolation functions

I'm open to any approach :)