Cannon.Misc.Tween
The tween object is a little bit different than most other objects in the framework, since you can't create any instances of it. In fact, it doesn't even implement inheritance. All functions are meant to be called statically.
As you may have guessed, Tween provides you with a simple way to handle transition from one value to another. It has been designed to work with pretty much everything across the framework that has tweenable properties - so you can just pass any object as a parameter, and Tween will animate it's properties.
Holds a list of different animation queues. The default queue is called __default.
Amount of milliseconds to wait between each update of the values. Default is 15.
Contains a collection of easing functions :
- linear
- easeInQuad
- easeOutQuad
- easeInOutQuad
- easeInCubic
- easeOutCubic
- easeInOutCubic
- easeInQuart
- easeOutQuart
- easeInOutQuart
- easeInQuint
- easeOutQuint
- easeInOutQuint
- easeInSine
- easeOutSine
- easeInOutSine
- easeInExpo
- easeOutExpo
- easeInOutExpo
- easeInCirc
- easeOutCirc
- easeInOutCirc
- easeInElastic
- easeOutElastic
- easeInOutElastic
- easeInBack
- easeOutBack
- easeInOutBack
- easeInBounce
- easeOutBounce
- easeInOutBounce
create:TweenObject
- object:Object : the subject of the animation
- options:Object : the list of properties to change and their new values
- duration:Integer : optionnal, the desired duration of the animation in milliseconds. Default is 400
- callback:Function : optionnal, a function to call once the animation is completed
- effect:String : optionnal, any of the effects listed in Cannon.Misc.Tween.effects. Default is easeOutQuad.
This function will create and execute a new Tween.
At the most basic level, you must provide an object to animate and a list of properties and values.
var myObject = {x:0};
Cannon.Misc.Tween.create(myObject, {x: 5});//will animate the x property of myObject from 0 to 5Tween is able to animate a variety of values, but not everything can be animated. In order to work, the options parameter must meet 2 requirements.
First, any property of the options parameter must also be a property of the object parameter. If this isn't the case, the property will be ignored.
Second, all values in the options parameter must be supported. Supported values are :
- plain numbers
- a string indicating a number difference, like '+=5' or '-=5'
- a Cannon.Misc.Color
- a string representing a color parsable by Cannon.Misc.Color.Parsable(). When this is used, the color string will internally be converted in a Cannon.Misc.Color.
The duration, callback and effect parameters are all optional, and you can skip any of them as long as they match the expected types.
object = {x: 0};
options = {x: 5};
duration = 500;
callback = function(){console.log('done')};
effect: 'easeIn';
Cannon.Misc.Tween.create(object, options, duration, callback, effect);//works
Cannon.Misc.Tween.create(object, options, callback, effect);//works too
Cannon.Misc.Tween.create(object, options, effect);//works as well
Cannon.Misc.Tween.create(object, options, duration, effect);//works. You get the idea.