useScreenOrientation ​
Hook that provides the current screen orientation
sensors
test coverage
Last changed: last month
TIP
This hook uses screen.orientation browser api to provide enhanced functionality. Make sure to check for compatibility with different browsers when using this api
Installation ​
Library
CLI
Manual
typescript
import { useScreenOrientation } from '@siberiacancode/reactuse';
Usage ​
typescript
const { supported, value, lock, unlock } = useScreenOrientation();
Demo ​
Api ​
Returns
useScreenOrientationReturn
Type declaration ​
typescript
interface ScreenOrientation {
lock: (orientation: OrientationLockType) => Promise<void>;
}
export interface UseScreenOrientationValue {
/** The current angle */
angle: number;
/** The current orientation type */
orientationType: OrientationType;
}
export type OrientationLockType =
| 'any'
| 'landscape-primary'
| 'landscape-secondary'
| 'landscape'
| 'natural'
| 'portrait-primary'
| 'portrait-secondary'
| 'portrait';
export interface useScreenOrientationReturn {
/** Whether the screen orientation is supported */
supported: boolean;
/** The current screen orientation value */
value: UseScreenOrientationValue;
/** Lock the screen orientation */
lock: (orientation: OrientationLockType) => void;
/** Unlock the screen orientation */
unlock: () => void;
}
Source ​
Source • DemoContributors ​
D