Hooks
Settings Hooks
useSettings()
A hook for managing video settings such as videoTrack, audio tracks, and subtitle tracks, and controlling the visibility of a settings menu.
Usage
import { useSettings } from 'react-native-video-toolkit';
export const MyComponent = () => {
const { isSettingsMenuVisible, toggleSettingsMenu } = useSettings();
// ...
};Returns
| Value | Type | Description |
|---|---|---|
videoTrack | VideoTrack | null | The current video quality setting. |
videoTracks | VideoTrack[] | The list of available video qualities. |
setVideoTrack | (newVideoTrack: VideoTrack | null) => void | A function to set the video quality. |
getVideoTracks | (videoTracks: VideoTrack[]) => void | A function to get the available video qualities. |
audioTrack | AudioTrack | null | The current audio track setting. |
audioTracks | AudioTrack[] | The list of available audio tracks. |
setAudioTrack | (newAudioTrack: AudioTrack | null) => void | A function to set the audio track. |
getAudioTracks | (audioTracks: AudioTrack[]) => void | A function to get the available audio tracks. |
textTrack | TextTrack | null | The current subtitle track setting. |
textTracks | TextTrack[] | The list of available subtitle tracks. |
setTextTrack | (newTextTrack: TextTrack | null) => void | A function to set the subtitle track. |
getTextTracks | (textTracks: TextTrack[]) => void | A function to get the available subtitle tracks. |
isSettingsMenuVisible | boolean | A boolean indicating whether the settings menu is currently visible. |
openSettings | () => void | A function to explicitly open the settings menu. |
closeSettings | () => void | A function to explicitly close the settings menu. |
toggleSettingsMenu | () => void | A function to toggle the visibility of the settings menu. |
Example
import { useSettings, VideoPlayer } from 'react-native-video-toolkit';
import { GestureDetector } from 'react-native-gesture-handler';
import React from 'react';
import { View, Button } from 'react-native';
const MySettingsButton = () => {
const { openSettings } = useSettings();
const handleQualityChange = () => {
// Example: set quality to the first available track
if (videoTracks.length > 0) {
setVideoTrack(videoTracks[0]);
}
};
return <BaseIconButton IconComponent={SettingsIcon} onTap={openSettings} />;
};
export default MySettingsButton;