Titanium Community Questions & Answer Archive

We felt that 6+ years of knowledge should not die so this is the Titanium Community Questions & Answer Archive

How to set Landscape mode

I would like to make landscape mode app. Please advise me how to set it.

— asked March 21st 2010 by kazuaki konno
  • landscape
0 Comments

6 Answers

  • You can instruct Titanium which orientation modes you app supports by setting the orientationModes property of your window.

    win.orientationModes = [
        Titanium.UI.PORTRAIT,
        Titanium.UI.UPSIDE_PORTRAIT,
        Titanium.UI.LANDSCAPE_LEFT,
        Titanium.UI.LANDSCAPE_RIGHT,
        Titanium.UI.FACE_UP,
        Titanium.UI.FACE_DOWN
    ];
    

    This should be an array of the modes you support for the device. This affects which modes your app can rotate to when the user rotates the device.

    To programmatically change the orientation, you can do something like this:

    Titanium.UI.orientation = Titanium.UI.LANDSCAPE_LEFT;
    

    Note that this software rotates the main UI of the device to that rotation.

    — answered March 21st 2010 by Jeff Haynie
    permalink
    3 Comments
    • I need the app to start in landscape mode and stay in landscape mode. What you described above, starts the app in portrait and then quickly animates into landscape. I'd love for it to just start in landscape & stay that way. Is this possible?

      — commented March 1st 2011 by Philip Kaplan
    • I, too am having the same issue as Mr. Kaplan. Someone? Anyone? Release date is looming!

      — commented March 25th 2011 by Richard John
    • This answer is out of date. From docs for Ti.UI.orientation:

      This property has been REMOVED since 3.0.0
      
      Use <Titanium.UI.Window.orientationModes> instead.
      

      — commented July 14th 2015 by Christine Viets
  • Thank you for the advise!
    I set
    Titanium.UI.orientation = Titanium.UI.LANDSCAPE_LEFT;
    in app.js as bellow.

    But the splash screen is not landscape mode and also view in window is miss alignment.
    Do I need to set the view position?
    If you have any example document, please advise me.


    Titanium.UI.setBackgroundColor('#000');
    Titanium.UI.orientation = Titanium.UI.LANDSCAPE_LEFT;

    var win1 = Titanium.UI.createWindow({
    backgroundColor:'#fff'
    });

    var label1 = Titanium.UI.createLabel({
    color:'#999',
    text:'I am Window 1',
    font:{fontSize:20,fontFamily:'Helvetica Neue'}
    });

    win1.orientationModes = [
    Titanium.UI.LANDSCAPE_LEFT
    ];

    win1.add(label1);
    win1.open();

    — answered March 22nd 2010 by kazuaki konno
    permalink
    0 Comments
  • Thank you for the advise!
    I set
    Titanium.UI.orientation = Titanium.UI.LANDSCAPE_LEFT;
    in app.js as bellow.

    But the splash screen is not landscape mode and also view in window is miss alignment.
    Do I need to set the view position?
    If you have any example document, please advise me.


    Titanium.UI.setBackgroundColor('#000');
    Titanium.UI.orientation = Titanium.UI.LANDSCAPE_LEFT;

    var win1 = Titanium.UI.createWindow({
    backgroundColor:'#fff'
    });

    var label1 = Titanium.UI.createLabel({
    color:'#999',
    text:'I am Window 1',
    font:{fontSize:20,fontFamily:'Helvetica Neue'}
    });

    win1.orientationModes = [
    Titanium.UI.LANDSCAPE_LEFT
    ];

    win1.add(label1);
    win1.open();

    — answered March 22nd 2010 by kazuaki konno
    permalink
    0 Comments
  • Thank you, Matthew!
    Your idea is good. But as you know, I want to have landscape oriented app like game apps.
    I hope some way to make it happen.

    — answered March 25th 2010 by kazuaki konno
    permalink
    0 Comments
  • I too am having trouble with this. I am trying to create a landscape oriented program. I can get the display and windows to rotate, but every window still seems by default to have the same dimensions as when it was vertical. The fullscreen boolean still seems to assume that the window is in portrait orientation. The only way I can get the window to fill the frame properly is to manually add the dimensions, then reset the top and left dimensions to 0,0. Is there a more generic way to do this that will fit more devices with different resolutions?

    var win = Titanium.UI.createWindow({
    title:'testWin',
    backgroundColor:'#ff0',
    orientationModes:[Titanium.UI.LANDSCAPE_RIGHT],
    //fullscreen:true
    width:480,
    height:360,
    left:0,
    top:0
    });

    — answered March 25th 2010 by Matthew Woods
    permalink
    3 Comments
    • I'm having the same problem… I have an image as my background.
      I have to manually set the dimensions of the background image, then it usually works. Oddly, compiles about 10% of the time on android, but it's the same issue.

      — commented November 24th 2010 by jonny sorber
    • I'm having the same problem… I have an image as my background.
      I have to manually set the dimensions of the background image, then it usually works. Oddly, compiles about 10% of the time on android, but it's the same issue.

      — commented November 24th 2010 by jonny sorber
    • Was there ever a solution to this?

      — commented November 30th 2011 by Dooley P
The ownership of individual contributions to this community generated content is retained by the authors of their contributions.
All trademarks remain the property of the respective owner.