ScreenOrientation
from expo
allows changing supported screen orientations at runtime, and subscribing to orientation changes. This will take priority over the orientation
key in app.json.Web support has limited support. For improved resize detection on mobile Safari, check out the docs on using Resize Observer in Expo web.
Android Device | Android Emulator | iOS Device | iOS Simulator | Web |
---|---|---|---|---|
→
expo install expo-screen-orientation
If you're installing this in a bare React Native app, you should also follow these additional installation instructions.
"expo"
field:{ "expo": { ... "ios": { ... "requireFullScreen": true, } } }
Requires Full Screen
checkbox in Xcode. It should be located under Project Target > General > Deployment Info
.import * as ScreenOrientation from 'expo-screen-orientation';
Gets the current screen orientation.
Returns a promise that fulfils with an Orientation
value that reflects the current screen orientation.
ERR_SCREEN_ORIENTATION_GET_ORIENTATION_LOCK
- Android Only. An unknown error occurred
when trying to get the system lock.ERR_SCREEN_ORIENTATION_MISSING_ACTIVITY
- Android Only. Could not get the current activity.Gets the current screen orientation lock type.
Returns a promise which fulfils with an OrientationLock
value.
ERR_SCREEN_ORIENTATION_MISSING_ACTIVITY
- Android Only. Could not get the current activity.Gets the platform specific screen orientation lock type.
Returns a promise which fulfils with a PlatformOrientationInfo
value.
ERR_SCREEN_ORIENTATION_GET_PLATFORM_ORIENTATION_LOCK
ERR_SCREEN_ORIENTATION_MISSING_ACTIVITY
- Android Only. Could not get the current activity.OrientationLock
) - The orientation lock to apply. See the OrientationLock
enum for possible values.Lock the screen orientation to a particular OrientationLock
.
async function changeScreenOrientation() { await ScreenOrientation.lockAsync(ScreenOrientation.OrientationLock.LANDSCAPE_LEFT); }
Promise<void>
Returns a promise with void
value, which fulfils when the orientation is set.
ERR_SCREEN_ORIENTATION_INVALID_ORIENTATION_LOCK
- An invalid OrientationLock
was passed in.ERR_SCREEN_ORIENTATION_UNSUPPORTED_ORIENTATION_LOCK
- The platform does not support the
orientation lock policy.ERR_SCREEN_ORIENTATION_MISSING_ACTIVITY
- Android Only. Could not get the current activity.PlatformOrientationInfo
) - The platform specific lock to apply. See the PlatformOrientationInfo
object type for the different platform formats.Promise<void>
Returns a promise with void
value, resolving when the orientation is set and rejecting
if an invalid option or value is passed.
ERR_SCREEN_ORIENTATION_INVALID_ORIENTATION_LOCK
- iOS Only. An invalid OrientationLock
was passed in.ERR_SCREEN_ORIENTATION_UNSUPPORTED_ORIENTATION_LOCK
- The platform does not support the
orientation lock policy.ERR_SCREEN_ORIENTATION_MISSING_ACTIVITY
- Android Only. Could not get the current activity.OrientationLock
)Returns whether the OrientationLock
policy is supported on
the device.
Promise<boolean>
Returns a promise that resolves to a boolean
value that reflects whether or not the
orientationLock is supported.
Sets the screen orientation back to the OrientationLock.DEFAULT
policy.
OrientationChangeListener
) - Each orientation update will pass an object with the new OrientationChangeEvent
to the listener.Invokes the listener
function when the screen orientation changes from portrait
to landscape
or from landscape
to portrait
. For example, it won't be invoked when screen orientation
change from portrait up
to portrait down
, but it will be called when there was a change from
portrait up
to landscape left
.
Subscription
) - A subscription object that manages the updates passed to a listener function
on an orientation change.Unsubscribes the listener associated with the Subscription
object from all orientation change
updates.
void
Removes all listeners subscribed to orientation change updates.
void
Name | Type | Description |
---|---|---|
orientationInfo | ScreenOrientationInfo | The current ScreenOrientationInfo of the device. |
orientationLock | OrientationLock | The current OrientationLock of the device. |
Name | Type | Description |
---|---|---|
screenOrientationArrayIOS (optional) | Orientation[] | iOS Only An array of orientations to allow on the iOS platform. |
screenOrientationConstantAndroid (optional) | number | Android
Only A constant to set using the Android native API. For example, in order to set the lock policy to unspecified, -1 should be passed in. |
screenOrientationLockWeb (optional) | WebOrientationLock | Web
Only A web orientation lock to apply in the browser. |
Name | Type | Description |
---|---|---|
horizontalSizeClass (optional) | SizeClassIOS | iOS Only The horizontal size class of the device. |
orientation | Orientation | The current orientation of the device. |
verticalSizeClass (optional) | SizeClassIOS | iOS Only The vertical size class of the device. |
Name | Type | Description |
---|---|---|
remove | () => void | A method to unsubscribe the listener. |
UNKNOWN
- An unknown screen orientation. For example, the device is flat, perhaps on a table.Orientation.UNKNOWN = 0
PORTRAIT_UP
- Right-side up portrait interface orientation.Orientation.PORTRAIT_UP = 1
PORTRAIT_DOWN
- Upside down portrait interface orientation.Orientation.PORTRAIT_DOWN = 2
LANDSCAPE_LEFT
- Left landscape interface orientation.Orientation.LANDSCAPE_LEFT = 3
LANDSCAPE_RIGHT
- Right landscape interface orientation.Orientation.LANDSCAPE_RIGHT = 4
An enum whose values can be passed to the lockAsync
method.
Note:OrientationLock.ALL
andOrientationLock.PORTRAIT
are invalid on devices which don't supportOrientationLock.PORTRAIT_DOWN
.
DEFAULT
- The default orientation. On iOS, this will allow all orientations except Orientation.PORTRAIT_DOWN
.
On Android, this lets the system decide the best orientation.OrientationLock.DEFAULT = 0
ALL
- All four possible orientationsOrientationLock.ALL = 1
PORTRAIT
- Any portrait orientation.OrientationLock.PORTRAIT = 2
PORTRAIT_UP
- Right-side up portrait only.OrientationLock.PORTRAIT_UP = 3
PORTRAIT_DOWN
- Upside down portrait only.OrientationLock.PORTRAIT_DOWN = 4
LANDSCAPE
- Any landscape orientation.OrientationLock.LANDSCAPE = 5
LANDSCAPE_LEFT
- Left landscape only.OrientationLock.LANDSCAPE_LEFT = 6
LANDSCAPE_RIGHT
- Right landscape only.OrientationLock.LANDSCAPE_RIGHT = 7
OTHER
- A platform specific orientation. This is not a valid policy that can be applied in lockAsync
.OrientationLock.OTHER = 8
UNKNOWN
- An unknown screen orientation lock. This is not a valid policy that can be applied in lockAsync
.OrientationLock.UNKNOWN = 9
Each iOS device has a default set of size classes that you can use as a guide when designing your interface.
REGULAR
SizeClassIOS.REGULAR = 0
COMPACT
SizeClassIOS.COMPACT = 1
UNKNOWN
SizeClassIOS.UNKNOWN = 2
LANDSCAPE_PRIMARY
WebOrientation.LANDSCAPE_PRIMARY = "landscape-primary"
LANDSCAPE_SECONDARY
WebOrientation.LANDSCAPE_SECONDARY = "landscape-secondary"
PORTRAIT_PRIMARY
WebOrientation.PORTRAIT_PRIMARY = "portrait-primary"
PORTRAIT_SECONDARY
WebOrientation.PORTRAIT_SECONDARY = "portrait-secondary"
An enum representing the lock policies that can be applied on the web platform, modelled after
the W3C specification.
These values can be applied through the lockPlatformAsync
method.
ANY
WebOrientationLock.ANY = "any"
LANDSCAPE
WebOrientationLock.LANDSCAPE = "landscape"
LANDSCAPE_PRIMARY
WebOrientationLock.LANDSCAPE_PRIMARY = "landscape-primary"
LANDSCAPE_SECONDARY
WebOrientationLock.LANDSCAPE_SECONDARY = "landscape-secondary"
NATURAL
WebOrientationLock.NATURAL = "natural"
PORTRAIT
WebOrientationLock.PORTRAIT = "portrait"
PORTRAIT_PRIMARY
WebOrientationLock.PORTRAIT_PRIMARY = "portrait-primary"
PORTRAIT_SECONDARY
WebOrientationLock.PORTRAIT_SECONDARY = "portrait-secondary"
UNKNOWN
WebOrientationLock.UNKNOWN = "unknown"
Code | Description |
---|---|
ERR_SCREEN_ORIENTATION_UNSUPPORTED_ORIENTATION_LOCK | The platform does not support the OrientationLock policy. |
ERR_SCREEN_ORIENTATION_INVALID_ORIENTATION_LOCK | An invalid OrientationLock was passed in. |
ERR_SCREEN_ORIENTATION_GET_ORIENTATION_LOCK | Android Only. An unknown error occurred when trying to get the orientation lock. |
ERR_SCREEN_ORIENTATION_GET_PLATFORM_ORIENTATION_LOCK | Android Only. An unknown error occurred when trying to get the platform orientation lock. |
ERR_SCREEN_ORIENTATION_MISSING_ACTIVITY | Android Only. Could not get the current activity. |