Software Archive
Read-only legacy content
17061 Discussions

how to make an app default portrait but some screen support landscape too?

Arthur_T_
New Contributor I
306 Views

I'm using XDK 3922, how to make an app default in portrait only but some screen support landscape too?

I need that just because I have a screen to view an video. In iOS, the app can be just set to portrait. When I view the video and rotate the device, it will becomes landscape even my app orientation is portrait only. However, in android, it won't rotate and I need to set its orientation to Default. But that will make all of my screens support landscape too. In case I can't make only certain screen support landscape. I will review all my screens look ok in landscape too.

0 Kudos
3 Replies
Arthur_T_
New Contributor I
306 Views

I used the plugin cordova-plugin-screen-orientation but not work. In iOS, seems it even cause javascript error as codes after that statement not run. In android, there is no effect of

screen.orientation.lock('portrait');

as app screen still rotate to landscape after rotate device. But

alert('Orientation is ' + screen.orientation.type);

output the correct device orientation.

P.S.

env: iOS 10.3.1 iPhone 7

android 6.0 LG K8 LTE

0 Kudos
PaulF_IntelCorp
Employee
306 Views

Last time I used that plugin I discovered the API calls varied as a function of the platform. Not sure if that is still true, but in case it is, you can steal from this code, which does work:

app.testToggleOrientation = function() {
    "use strict" ;
    var fName = "toggleOrientation():" ;
    app.consoleLog(fName, "entry") ;

    var str = "" ;
    var screenOrientation = "unknown" ;

    if( window.cordova ) {
        try {
            if( cordova.platformId.match(/ios/i) ) {
                screenOrientation = screen.orientation ;
            }
            else if( cordova.platformId.match(/android/i) ) {
                screenOrientation = screen.orientation.type ;
            }
            else {
                screenOrientation = "unknown" ;
            }

            if( screenOrientation.match(/landscape/i) ) {
                screenOrientation = "portrait" ;
                screen.lockOrientation(screenOrientation) ;
            }
            else if( screenOrientation.match(/portrait/i) ) {
                screenOrientation = "landscape" ;
                screen.lockOrientation(screenOrientation) ;
            }
            else {
                screenOrientation = "unlocked" ;
                screen.unlockOrientation() ;
            }

            str = "try succeeded, screen orientation set to: " + screenOrientation ;
            app.consoleLog(fName, str) ;
        }
        catch(e) {
            str = "try failed: " + e ;
            app.consoleLog(fName, str) ;
            app.alert(str) ;
        }
    }

//    app.flashBackground("#"+Math.floor(Math.random()*16777215).toString(16), 0) ;
    app.consoleLog(fName, "exit") ;
} ;



app.windowEventOrientationChange = function() {
    "use strict" ;
    var fName = "windowEventOrientationChange():" ;

    var str = "" ;
    var screenOrientation = "unknown" ;

    if( window.cordova ) {
        if( cordova.platformId.match(/ios/i) )
            screenOrientation = screen.orientation ;
        else if( cordova.platformId.match(/android/i) )
            screenOrientation = screen.orientation.type ;
    }

    str = "Screen orientation is: " + screenOrientation ;
    app.consoleLog(fName, str) ;
//    app.alert(str, 1000) ;
} ;
window.addEventListener("orientationchange", app.windowEventOrientationChange) ;

 

0 Kudos
Arthur_T_
New Contributor I
306 Views

thanks, it is ok now after using your methods:

screen.lockOrientation, screen.unlockOrientation

0 Kudos
Reply