software-mansion / software-mansion/react-native-screens
Orientation is not locked as intended
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 3.7k
- Forks
- 714
- Avg merge
- 2d 23h
- Merged PRs (30d)
- 71
Description
Description
I'm currently facing an issue with the orientation lock. When I set the orientation to landscape using useNavigation().setOptions from react-navigation while the device is actually in landscape mode, it does not lock into landscape.
When I change the code in RNSScreenWindowTraits.mm as shown below, it works fine:
if ([RNSScreenWindowTraits maskFromOrientation:currentDeviceOrientation] & orientationMask) {
- if (!([RNSScreenWindowTraits maskFromOrientation:currentInterfaceOrientation] & orientationMask)) {
- // if the device orientation is in the mask, but interface orientation is not, we rotate to device's orientation
- newOrientation = currentDeviceOrientation;
- } else {
- if (currentDeviceOrientation != currentInterfaceOrientation) {
- // if both device orientation and interface orientation are in the mask, but in different orientations, we
- // rotate to device's orientation
- newOrientation = currentDeviceOrientation;
- }
- }
+ newOrientation = currentDeviceOrientation;
} else {
if (!([RNSScreenWindowTraits maskFromOrientation:currentInterfaceOrientation] & orientationMask)) {
// if both device orientation and interface orientation are not in the mask, we rotate to closest available
// rotation from mask
newOrientation = [RNSScreenWindowTraits defaultOrientationForOrientationMask:orientationMask];
} else {
// if the device orientation is not in the mask, but interface orientation is in the mask, do nothing
+ newOrientation = currentInterfaceOrientation;
}
}
I think the issue arises because both the actual device orientation and the new value are the same, so it does not attempt to change anything. By ensuring it set to the new value, even if it is the same as the device's orientation, the problem is resolved.
if this code is okay, I can make a pull request.
with original code
with patch
Steps to reproduce
- navigate to RePro with
go to nextbutton. - rotate device to landscape.
- press landscape toggle button.
- rotate device to portrait.
Snack or a link to a repository
https://github.com/lifeisegg123/react-native-screen-rotation-repro
Screens version
3.32.0(repro), 3.30.1(real app)
React Native version
0.74.2(repro), 0.73.6(real app)
Platforms
iOS
JavaScript runtime
None
Workflow
React Native (without Expo)
Architecture
Paper (Old Architecture)
Build type
None
Device
None
Device model
No response
Acknowledgements
Yes
Contributor guide
No contributing guide indexed for this repository
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the orientation handling in RNSScreenWindowTraits.mm and reproduce the issue using the linked React Native screen-rotation repro. Compare the original behavior with the proposed change, then verify that setting landscape while already in landscape locks correctly and that the listed portrait rotation flow still behaves as expected.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- ios, objective-c, react-native
- Domain
- mobile
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 42/100