Screen orientation on React Native
Apps should adapt to the preferred display orientation of the user. Most apps restrict the screen to portrait orientation, but they should also support landscape orientation. Some users have their devices mounted in a fixed orientation (e.g. on the arm of a wheelchair). Therefore, apps need to support both orientations.
In React Native, multiple screen orientations are enabled by default. Locking screen orientation is handled in native code:
For Android, remove instances of the
android:screenOrientation
attribute.For iOS, check if 4 orientations have been added to
UISupportedInterfaceOrientations
.
You can use the Dimensions
API to listen to orientation changes.
Dimensions.addEventListener('change', () => {
this.setState({
orientation: Platform.isPortrait() ? 'portrait' : 'landscape'
});
});