Skip to content
Titanium SDK
Version13.2.0

You are reading 13.2.0. See this page in 13.4.1.

Titanium.UI.iOS.TransitionAnimation

proxyiPhoneiPadmacOSsince iPhone 3.2.0, iPad 3.2.0, macOS 9.2.0

Extends Titanium.Proxy

A transition animation when opening or closing windows in a Titanium.UI.NavigationWindow or Titanium.UI.Tab.

Use this proxy with the Window's transitionAnimation property.

Examples

Simple Example

In this example, the red window opens with a transition animation, while closing it uses the default behavior where it slides off screen. To add a transition animation when the red window closes, define a transition animation for the blue window.

var transition = Ti.UI.iOS.createTransitionAnimation({
    duration: 300,
    // The show transition makes the window opaque and rotates it correctly
    transitionTo: {
        opacity: 1,
        duration: 300,
        transform: Ti.UI.createMatrix2D()
    },
    // The hide transition makes the window transparent and rotates it upside down
    transitionFrom: {
        opacity: 0,
        duration: 300 / 2,
        transform: Ti.UI.createMatrix2D().rotate(180),
    }
});

var win2 = Ti.UI.createWindow({
    backgroundColor: 'red',
    title: 'Red Window',
    transitionAnimation: transition,
    opacity: 0,
    transform: Ti.UI.createMatrix2D().rotate(180)
});
var button2 = Ti.UI.createButton({
    title: 'Close Red Window'
});
button2.addEventListener('click', function(){
    nav.closeWindow(win2);
    // In order to see the blue window again,
    // need to reverse the transition animation
    win1.opacity = 1;
    win1.transform = Ti.UI.createMatrix2D().rotate(0);
});
win2.add(button2);

var win1 = Ti.UI.createWindow({
    backgroundColor: 'blue',
    title: 'Blue Window',
    // Uncomment to use a transition animation when the blue window is closed
    // transitionAnimation: transition
});
var button1 = Ti.UI.createButton({title: 'Open Red Window'});
button1.addEventListener('click', function(){
    nav.openWindow(win2);
});
win1.add(button1);

var nav = Ti.UI.createNavigationWindow({
    window: win1
});
nav.open();

Properties 5

apiName

Stringsince Android 3.2.0, iPhone 3.2.0, iPad 3.2.0, macOS 9.2.0read-only

Inherited from Titanium.Proxy

The name of the API that this proxy corresponds to.

bubbleParent

Booleansince Android 3.0.0, iPhone 3.0.0, iPad 3.0.0, macOS 9.2.0

Inherited from Titanium.Proxy

Indicates if the proxy will bubble an event to its parent.

Default: true

duration

Number

Length of the transition in milliseconds.

Methods 4

Inherited from Titanium.Proxy

Adds the specified callback as an event listener for the named event.

Parameters
ParametersTypeDescription
nameString

Name of the event.

callbackCallback<Titanium.Event>

Callback function to invoke when the event is fired.

4 fields
bubbles Boolean

True if the event will try to bubble up if possible.

cancelBubble Boolean

Set to true to stop the event from bubbling.

source Object

Source object that fired the event.

type String

Name of the event fired.

Inherited from Titanium.Proxy

Fires a synthesized event to any registered listeners.

Parameters
ParametersTypeDescription
nameString

Name of the event.

event?Dictionary

A dictionary of keys and values to add to the Titanium.Event object sent to the listeners.

Inherited from Titanium.Proxy

Removes the specified callback as an event listener for the named event.

Parameters
ParametersTypeDescription
nameString

Name of the event.

callbackCallback<Titanium.Event>

Callback function to remove. Must be the same function passed to addEventListener.

4 fields
bubbles Boolean

True if the event will try to bubble up if possible.

cancelBubble Boolean

Set to true to stop the event from bubbling.

source Object

Source object that fired the event.

type String

Name of the event fired.