fn

useScreenOrientation

v0.0.14testeddemo

Reactive Screen Orientation API. Tracks the current orientation type and angle, and exposes helpers to lock/unlock the orientation. SSR-safe.

Examples

ts
const { isSupported, orientation, angle, lockOrientation, unlockOrientation } = useScreenOrientation();
ts
// Lock to landscape (must run from a user gesture / fullscreen context)
const { lockOrientation } = useScreenOrientation();
await lockOrientation('landscape');

Demo

Loading demo…

Signature

ts
export function useScreenOrientation(options: UseScreenOrientationOptions ={ ... }

Parameters

ParameterTypeDescription
options?UseScreenOrientationOptionsOptions (custom window)

Returns

UseScreenOrientationReturn{ isSupported, orientation, angle, lockOrientation, unlockOrientation }
PropertyTypeDescription
isSupportedComputedRef<boolean>Whether the Screen Orientation API is supported
orientationShallowRef<OrientationType | undefined>Current screen orientation type, or undefined when unsupported
angleShallowRef<number>Current screen orientation angle in degrees (defaults to 0)
lockOrientation(type: OrientationLockType) => Promise<void>Lock the screen to the given orientation. Rejects when unsupported.
unlockOrientation() => voidRelease a previously applied orientation lock. No-op when unsupported.