I'm trying to make a pleasing "spring" effect to scale a button and other components. In particular I want to scale them in when the view is created and shown, and I want to scale them down when a user taps a button, and if the user releases the button, I want them to scale back up to normal size with the spring effect.
The Facebook library "rebound" is a perfect example, see their demo here: https://facebook.github.io/rebound/.
I tried all the built in curves like bounceIn/Out and elasticIn/Out but they weren't springy enough (elastic is kind of springy).
Any help greatly appreciated!
As @Remi said, you can use the Curve
class and override the transform method.
The difficult part is then figuring out the formula to use. I'd play around with something like this curve calculator to get a formula.
i.e. -(e^(-x/a) * cos(xw)) + 1
with a = 0.15
and w = 19.4
.
Another alternative is to use existing curves together - since they all start at 0 and end at 1, you can simply multiply two different curves together in your overloaded curve method.
I'd take a look at the implementation of ElasticIn and ElasticOut to figure out how they did the math, but the dart math library should have everything you need.