apache / apache/cordova-plugin-screen-orientation

Screen orientation lock not working (eg. portrait-primary) if the device is locked in other orientation (eg. landscape-primary) but held in the first orientation (eg. portrait-primary)

Open
#82 1 comment 1 reaction 0 assignees View on GitHub
Dominant language
JavaScript
Stars
219
Forks
234
PR merge metrics
No merged PRs in 30d

Description

# Bug Report
Hello, I have an application which plays live streams. Because we want custom controls on iOS we can't use the fullscreen API from our player, so we need to mimic it by using css. When the user hits a button the app is locked to landscape and the css changes for fullscreen view. The other way around for exit fullscreen.

## Problem
The screen orientation works perfect on Android, but not for iOS.

### What is expected to happen?
The application should change its orientation as the call to screenOrientation.lock is made.

### What does actually happen?
If the phone is **HELD** in the same orientation everything works as expected, even on iOS.

But if the following steps are done:
- the phone is held in portrait (locked)
- user hits fullscreen => app locks to landscape and everything looks good
- the user turns the phone to landscape then back to portrait (the app is still in landscape, being locked)
- the user hits the exit fullscreen button which should lock the phone to portrait => the phone remains in landscape (100% of the cases). Here is the even stranger part, if the user turns the phone in any landscape mode the app goes in portrait and it is locked there. It seems that somehow the phone realizes it is not in portrait only after the user rotates the phone and then it changes to portrait, as already mentioned.

## Information

The code runs without any issues, no warnings, no errors, logs from within the lock promise are displayed, everything seems fine, the phone does not change its orientation.

### Command or Code

import {ScreenOrientation} from '@ionic-native/screen-orientation/ngx';

constructor(private screenOrientation: ScreenOrientation) {
this.orientation = this.screenOrientation.type;

this.screenOrientation.onChange().subscribe(() => {
if (this.orientation !== this.screenOrientation.type) {
this.orientation = this.screenOrientation.type;
this.orientationChangeSubject.next(this.screenOrientation.type);
}
});
}

private changeTo(orientation, unlock: boolean = true): Promise {
return this.screenOrientation.lock(orientation).then(() => {
this.orientation = orientation;
if (unlock) {
this.unlock();
}
}).catch(() =>
console.error('The fullscreen button does not work from the browser, only from mobile devices')
);
}

// The "changeTo " method is called like this:
changeToPortraitAndLock() {
return this.changeTo(this.screenOrientation.ORIENTATIONS.PORTRAIT_PRIMARY, false);
}

### Environment, Platform, Device

iOS 14.3

### Version information

"@capacitor/android": "^2.4.2",
"@capacitor/core": "^2.4.2",
"@capacitor/ios": "^2.4.2",
"@ionic-native/core": "^5.0.7",
"@ionic-native/screen-orientation": "^5.33.1",
"@ionic-native/splash-screen": "^5.0.0",
"@ionic/angular": "^5.0.0",
"@ionic/pwa-elements": "^1.5.2",
"cordova-plugin-screen-orientation": "^3.0.2",

## Checklist

- [ X ] I searched for existing GitHub issues
- [ X ] I updated all Cordova tooling to most recent version
- [ X ] I included all the necessary information above

Contributor guide

Open the contributing guide

Research direction

Start at the screenOrientation.lock entry point and inspect the iOS implementation, then reproduce the reported sequence on iOS 14.3: lock landscape, rotate to landscape and back to portrait, and lock portrait. Done means the device changes to portrait immediately when the portrait lock call resolves, without requiring another physical rotation.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, objective-c
Domain
mobile-dev
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.