Search code examples
titaniumappceleratorappcelerator-mobile

How to simply handle orientation changes?


I'm not talking about doing anything fancy. I'd just like the standard windows and views to rotate when the user rotates the device.


Solution

  • You need to tell the window which orientations it should support:

    var window = Ti.UI.createWindow({
        orientationModes: [
            Ti.UI.LANDSCAPE_LEFT,
            Ti.UI.LANDSCAPE_RIGHT,
            Ti.UI.PORTRAIT,
            Ti.UI.UPSIDE_PORTRAIT
        ]
    });
    
    window.open();
    

    You can then listen on the orientation changes with a listener like so:

    Ti.Gesture.addEventListener('orientationchange', function(e) {
        Titanium.API.info('Orientation changed');
    });
    

    Edit: I think (though I've never tried it) you can also set this in tiapp.xml, which has the added benefit of applying to all windows automatically.

    <orientations device="iphone">
        <orientation>Ti.UI.LANDSCAPE_LEFT</orientation>
        <orientation>Ti.UI.LANDSCAPE_RIGHT</orientation>
        <orientation>Ti.UI.PORTRAIT</orientation>
        <orientation>Ti.UI.UPSIDE_PORTRAIT</orientation>
    </orientations>