Dimensions.get('screen') is returning reversed values for height and width

[snigdhaDhanireddy29]

Description

When I am using Dimensions.get('screen').width and Dimensions.get('screen').height, I am getting the values as reversed sometimes (i.e width is coming as height and height as width).
This is occurring randomly when the application is launched.
The application is supported only in landscape mode.

React Native version:

System:
OS: macOS 10.15.4
CPU: (8) x64 Intel(R) Core(TM) i7-4770HQ CPU @ 2.20GHz
Memory: 22.54 MB / 16.00 GB
Shell: 5.7.1 - /bin/zsh
Binaries:
Node: 10.16.1 - /usr/local/bin/node
npm: 6.9.0 - /usr/local/bin/npm
SDKs:
iOS SDK:
Platforms: iOS 13.4, DriverKit 19.0, macOS 10.15, tvOS 13.4, watchOS 6.2
IDEs:
Android Studio: 3.6 AI-192.7142.36.36.6241897
Xcode: 11.4.1/11E503a - /usr/bin/xcodebuild
npmPackages:
react: 16.9.0 => 16.9.0
react-native: 0.61.5 => 0.61.5
npmGlobalPackages:
react-native-cli: 2.0.1

Steps To Reproduce

Provide a detailed list of steps that reproduce the issue.

1. Use Dimensions.get('screen').width and Dimensions.get('screen').height, its populating reversed values. This is happening randomly sometimes.

Expected Results

The width and height should be populated correctly

Snack, code example, screenshot, or link to a repository:

The expected result is the below screen.

But since the width and height are reversed, we are getting the screen as below.

[github-actions]

⚠️	Missing Reproducible Example
ℹ️	It looks like your issue is missing a reproducible example. Please provide a Snack or a repository that demonstrates the issue you are reporting in a minimal, complete, and reproducible manner.

[github-actions]

⚠️	Missing Environment Information
ℹ️	Your issue may be missing information about your development environment. You can obtain the missing information by running react-native info in a console.

[chrisglein]

Are you seeing this on iOS or Android or both?
Related to #29290?

[ejanzer]

Hey @snigdhaDhanireddy29, I think the issue you're seeing is happening because Dimensions.get('screen') is returning a stale value - the best way to deal with this will be to subscribe to the dimensions changes using Dimensions.addEventListener() to make sure you have the latest value. I was seeing this issue on Android - even if I launch the app with the device in landscape mode, I'd still initially get portrait mode display metrics.

If you're using hooks, this hook will do all the work of subscribing to the event for you: https://reactnative.dev/docs/usewindowdimensions