Utils
Orientation
Utility functions and hooks for handling screen orientation and device type detection in React Native applications.
shouldRotate
Determines if the screen should rotate to landscape based on the provided dimensions and configuration.
Usage
import { shouldRotate } from 'react-native-video-toolkit';
const canRotate = shouldRotate(1920, 1080);Parameters
| Parameter | Type | Required | Default | Description |
|---|---|---|---|---|
width | number | Yes | – | The width of the screen. |
height | number | Yes | – | The height of the screen. |
config | RotationConfig | No | {} | Configuration options for rotation detection. |
Returns
| Type | Description |
|---|---|
boolean | true if the screen should rotate, false otherwise. |
Example
import { shouldRotate } from 'react-native-video-toolkit';
const config = {
threshold: 1.5,
minWidth: 768,
};
const canRotate = shouldRotate(1920, 1080, config);detectDeviceType
Detects the type of the device based on the screen dimensions.
Usage
import { detectDeviceType } from 'react-native-video-toolkit';
const deviceType = detectDeviceType();Returns
| Type | Description |
|---|---|
DeviceType | The type of the device ('phone', 'tablet', 'foldable', 'tv', 'desktop', or 'unknown'). |
Example
import { detectDeviceType } from 'react-native-video-toolkit';
const deviceType = detectDeviceType();
// deviceType will be 'phone', 'tablet', etc.getOptimalConfig
Returns the optimal rotation configuration for the current platform and device.
Usage
import { getOptimalConfig } from 'react-native-video-toolkit';
const config = getOptimalConfig();Returns
| Type | Description |
|---|---|
RotationConfig | The optimal rotation configuration for the current device. |
Example
import { getOptimalConfig } from 'react-native-video-toolkit';
const config = getOptimalConfig();
// config will be { threshold: 1.5, minWidth: 768 }useShouldRotate
A hook that returns a boolean indicating whether the screen should rotate to landscape.
Usage
import { useShouldRotate } from 'react-native-video-toolkit';
const shouldRotate = useShouldRotate();Returns
| Type | Description |
|---|---|
boolean | true if the screen should rotate, false otherwise. |
Example
import { useShouldRotate } from 'react-native-video-toolkit';
import { Text } from 'react-native';
const MyComponent = () => {
const shouldRotate = useShouldRotate();
return <Text>{shouldRotate ? 'Rotate' : 'Do not rotate'}</Text>;
};getVideoControlsConfig
Returns the configuration for the video controls based on the screen orientation and platform.
Usage
import { getVideoControlsConfig } from 'react-native-video-toolkit';
const config = getVideoControlsConfig(true, 'web');Parameters
| Parameter | Type | Required | Default | Description |
|---|---|---|---|---|
isLandscape | boolean | Yes | – | Whether the screen is in landscape mode. |
platform | string | Yes | – | The current platform ('web', 'mobile', or 'tv'). |
Returns
| Type | Description |
|---|---|
object | The configuration for the video controls. |
Example
import { getVideoControlsConfig } from 'react-native-video-toolkit';
const config = getVideoControlsConfig(true, 'web');
// config will be { showFullscreen: false, showSeekBar: true, ... }