react-native-orientation-locker icon indicating copy to clipboard operation
react-native-orientation-locker copied to clipboard

Navigating to new screen and lockToLandscape() immediatelly doesn't rotate on iOS

Open rogerkerse opened this issue 3 years ago • 11 comments

When using react-navigation 6, navigating to a screen and having this code doesn't rotate screen.

useEffect(() => {
    Orientation.lockToLandscape()
}, [])

It only works with timeout over 500 (in my case).

rogerkerse avatar Nov 22 '21 17:11 rogerkerse

it doesn't work for me at all

CDBridger avatar Nov 25 '21 01:11 CDBridger

Hi, Not working for me too. The screen is rotate but application still in portrait. Any idea ?

kevingraillot39 avatar Nov 28 '21 11:11 kevingraillot39

lockToLandscape and lockToPortrait don't work for me on ios 15. This post suggest force rotation was never intended? https://developer.apple.com/forums/thread/692576

Do people have work arounds?

achang0406 avatar Dec 14 '21 17:12 achang0406

adding shouldAutoRotate fixed my problem

achang0406 avatar Dec 14 '21 17:12 achang0406

Same issue - is the shouldAutoRotate setup in the Delegate file? @achang0406

bfbiggs avatar Dec 15 '21 19:12 bfbiggs

@bfbiggs Yes, like this in appdelegate.m

- (BOOL)shouldAutorotate
{
    return FALSE;    
}

Thanks @achang0406

Ananthakr avatar Jan 20 '22 17:01 Ananthakr

Not any of the solutions listed above worked for me on iOS 13, 14 and 15.

For now I solved the problem by adding setTimeout to lock the screen orientation.

setTimeout(() => {
      Orientation.lockToLandscape();
    }, Platform.select({
  android: 0,
  ios: 600,
}));

On Android, the app automatically locks into the landscape mode so I put the timeout as 0. On iOS, tweak the timeout between 600 to 1000 as per your need, it will automatically rotate the app in landscape mode (It will work for switching from landscape to portrait too).

This will work as expected.

Thank you!

Amol-B-Patil avatar Apr 07 '22 09:04 Amol-B-Patil

Not any of the solutions listed above worked for me on iOS 13, 14 and 15.

For now I solved the problem by adding setTimeout to lock the screen orientation.

setTimeout(() => {
      Orientation.lockToLandscape();
    }, Platform.select({
  android: 0,
  ios: 600,
}));

On Android, the app automatically locks into the landscape mode so I put the timeout as 0. On iOS, tweak the timeout between 600 to 1000 as per your need, it will automatically rotate the app in landscape mode (It will work for switching from landscape to portrait too).

This will work as expected.

Thank you!

I believe the forced rotation isn't working because it's being reset here https://github.com/wonday/react-native-orientation-locker/blob/733ad2c931867336f00627caf57e73c73da4594b/iOS/RCTOrientation/Orientation.m#L133-L134 I opened a PR to resolve this, I have been using this forked version in production for a few months now.

maschad avatar May 03 '22 18:05 maschad

The work around i found was this useEffect(() => { setTimeout(() => { Orientation.lockToLandscape(); }, 1000); }, []);

Champkinz avatar Oct 26 '22 11:10 Champkinz

Experiencing a similar issue, on android when i navigate to the new screen and lock the orientation to landscape it the component doesn't render and then takes me to the main screen with the orientation locked to landscape. When i remove Orientation.lockToLandscape() in the new screen the component renders perfectly, i also tried to set a time out, i am not locking the orientation anywhere else in the application. i also tried unlockingAllOrientations. Not getting any error so there is no way to try and catching.

mujehoxe avatar Aug 29 '23 08:08 mujehoxe

adding shouldAutoRotate fixed my problem

Does this solution work? Why does the iOS documentation indicate that this property is deprecated? If it works, how do I implement it? thank you

eliasg52 avatar Jan 17 '24 12:01 eliasg52