CODEWITHSUNDEEP
cordovacordova-pluginsscreen-orientation
Manoj Shrestha
Manoj Shrestha

Reputation: 4684

Cordova Plugin Screen Orientation 1.4.2 (for IOS) does not change the viewport width

After updating the plugin to version 1.4.2, it screen locking started working in iPad. From the portrait mode, I tried locking the screen in landscape mode by executing screen.lockOrientation('landscape-primary'). The screen does rotate to landscape mode. But it doesn't occupy the full screen width. The rotation doesn't seem to change the view port width and height.

Screen Size in Portrait view:

Height: 1004 px
Width: 768px

After executing screen.lockOrientation('landscape-primary')

Screen Size in Landscape view (Still same) :

Height: 1004 px
Width: 768px

The following is my configuration:

cordova version: 6.0.0
ios version: 9.3.4
screen plugin version: 1.4.2

Updates:

The problem I'm facing is same as the one mentioned here: https://github.com/gbenvenuti/cordova-plugin-screen-orientation/issues/1

I tried putting the following configuration, still didn't work.

<platform name="ios">
  <preference name="Orientation" value="all" />
</platform>

I don't have width=device-width or height=device-height in the meta viewport.

enter image description here

Upvotes: 2

Views: 1316

Answers (2)

St&#233;phane Maleyrie
St&#233;phane Maleyrie

Reputation: 120

Based on @Rolando answer, this is what i did, because, it must have a short delay between the lockOrientation and the statsuBar refresh :

var interval;
screen.lockOrientation('landscape');
if(ionic.Platform.isIPad()){
    // Ipad only, check every 10ms if screen size is refresh or do it with statusBar
    interval = $interval(testLandscapeWidth, 10);
}else{
    // Other ios and android
    doProcess();
}


function testLandscapeWidth(){
    if(parseInt($window.innerWidth) < parseInt($window.innerHeight)){
        StatusBar.hide();
        StatusBar.show();
    }else{
        $interval.cancel(interval); // When scree size is refresh, cancel interval
        doProcess();
    }
}


function doProcess(){
    // Your process
}

I use an interval and not a timer to be sure it do it many time and success, that just 1 time and fail the refresh. I tried with 10ms, 100ms, 500ms, depend on the ipad health fast or not, sometimes the status bar refresh didn't success. So, with the interval, it is.

Upvotes: 0

Rolando Rez
Rolando Rez

Reputation: 11

cordova-plugin-screen-orientation doesnt seem to be resizing the web view. I was having the same issue.

A quick hack that will fix this is to call another plugin that DOES implement resizing of the webview properly. For example: Install cordova-plugin-statusbar and after locking the status bar do a quick hide/show of the status bar. Boom! your orientation is locked AND you have the right webview size.

screen.lockOrientation('portrait');     
StatusBar.hide();
StatusBar.show();

Upvotes: 1

Related Questions