Alloy Animation - builtin library

Titanium alloy framework provide collection of useful animation utilities. To use the animation builtin library, all you need to do is require it with the alloy root directory in your require call. For example:

var animation = require('alloy/animation');
animation.crossFade(view1, view2, 500, finishCallback);

chainAnimate( Titanium.UI.View view, Titanium.UI.Animation[] animations, [function() finishCallback] )

Executes a series of animations on the target view.

crossFade( Titanium.UI.View from, Titanium.UI.View to, Number duration, [function() finishCallback] )

Transitions from one view to another using a cross-fade animation.

fadeAndRemove( Titanium.UI.View from, Number duration, Titanium.UI.View container, [function() finishCallback] )

Fades out a view then removes it from its parent view. 

fadeIn( Titanium.UI.View to, Number duration, [function() finishCallback] )

Fades in the specified view. 

fadeOut( Titanium.UI.View to, Number duration, [function() finishCallback] )

Fades out the specified view. 

flash( Titanium.UI.View view, [Number delay], [function() finishCallback] )

Flashes the target view twice, fading to partially transparent then back to fully-opaque. 

popIn( Titanium.UI.View view, [function() finishCallback] )

Makes the specified view appear using a "pop-in" animation, which combines a fade-in with a slight expanding and contracting animation, to call attention to the new view. 

shake( Titanium.UI.View view, [Number delay], [function() finishCallback] )

Creates a shake animation, moving the target view back and forth rapidly several times.

Example:

1. open Titanium Studio

2. create New Alloy Project

3. Modify views/index.xml

4. Modify styles/index.tss

 
".container": {
 backgroundColor:"white"
},
"#square": {
 width: 200,
 height: 200,
 color: "#f00"
} 

"#shakeMe":{
 title:'Shake Me',
 bottom:'100dp'
}

5. Modify controllers/index.js

 
function shakeMe(e) {
    var animation = require('alloy/animation');
    animation.shake($.view2, 500);
}

$.index.open();

6. Run the project and click the button.

Thanks.