Methods

This page shows the list of available methods

`dismissFullscreenPlayer`

Platforms: Android | iOS | web

dismissFullscreenPlayer(): Promise<void>

Take the player out of fullscreen mode.

[!WARNING] deprecated, use setFullScreen method instead

`pause`

Platforms: Android | iOS | web

pause(): Promise<void>

Pause the video.

`presentFullscreenPlayer`

Platforms: Android | iOS | web

presentFullscreenPlayer(): Promise<void>

Put the player in fullscreen mode.

On iOS, this displays the video in a fullscreen view controller with controls.

On Android, this puts the navigation controls in fullscreen mode. It is not a complete fullscreen implementation, so you will still need to apply a style that makes the width and height match your screen dimensions to get a fullscreen video.

[!WARNING] deprecated, use setFullScreen method instead

`resume`

Platforms: Android | iOS | web

resume(): Promise<void>

Resume the video.

`restoreUserInterfaceForPictureInPictureStopCompleted`

Platform: iOS

restoreUserInterfaceForPictureInPictureStopCompleted(restored)

This function corresponds to the completion handler in Apple's restoreUserInterfaceForPictureInPictureStop (opens in a new tab). IMPORTANT: This function must be called after onRestoreUserInterfaceForPictureInPictureStop is called.

`save`

Platform: iOS

save(): Promise<{ uri: string }>

Save video to your Photos with current filter prop. Returns promise.

Notes:

Currently only supports highest quality export
Currently only supports MP4 export
Currently only supports exporting to user's cache directory with a generated UUID filename.
User will need to remove the saved video through their Photos app
Works with cached videos as well. (Checkout video-caching example)
If the video is has not began buffering (e.g. there is no internet connection) then the save function will throw an error.
If the video is buffering then the save function promise will return after the video has finished buffering and processing.

Future:

Will support multiple qualities through options
Will support more formats in the future through options
Will support custom directory and file name through options

`seek`

Platforms: All

seek(seconds)

Seek to the specified position represented by seconds. seconds is a float value.

seek() can only be called after the onLoad event has fired. Once completed, the onSeek event will be called.

Exact seek

Platform: iOS

By default iOS seeks within 100 milliseconds of the target position. If you need more accuracy, you can use the seek with tolerance method:

seek(seconds, tolerance)

tolerance is the max distance in milliseconds from the seconds position that's allowed. Using a more exact tolerance can cause seeks to take longer. If you want to seek exactly, set tolerance to 0.

`setVolume`

Platforms: Android | iOS | web

setVolume(value): Promise<void>

This function will change the volume exactly like volume property. default value and range are the same then.

`getCurrentPosition`

Platforms: Android | iOS | web

getCurrentPosition(): Promise<number>

This function retrieves and returns the precise current position of the video playback, measured in seconds. This function will throw an error if player is not initialized.

`setSource`

Platforms: Android | iOS

setSource(source: ReactVideoSource): Promise<void>

This function will change the source exactly like source property. Changing source with this function will overide source provided as props.

`setFullScreen`

Platforms: Android | iOS | web

setFullScreen(fullscreen): Promise<void>

If you set it to true, the player enters fullscreen mode. If you set it to false, the player exits fullscreen mode.

On iOS, this displays the video in a fullscreen view controller with controls.

`nativeHtmlVideoRef`

Platform: web

A ref to the underlying html video element. This can be used if you need to integrate a 3d party, web only video library (like hls.js, shaka, video.js...).

Example Usage

const videoRef = useRef<VideoRef>(null);
 
const someCoolFunctions = async () => {
  if (!videoRef.current) {
    return;
  }
 
  // present or dismiss fullscreen player
  videoRef.current.presentFullscreenPlayer();
  videoRef.current.dismissFullscreenPlayer();
 
  // pause or resume the video
  videoRef.current.pause();
  videoRef.current.resume();
 
  // save video to your Photos with current filter prop
  const response = await videoRef.current.save();
  const path = response.uri;
 
  // seek to the specified position represented by seconds
  videoRef.current.seek(200);
  // or on iOS you can seek with tolerance
  videoRef.current.seek(200, 10);
};
 
return (
  <Video
    ref={videoRef}
    source={{uri: 'https://www.w3schools.com/html/mov_bbb.mp4'}}
  />
);

Static methods

`getWidevineLevel`

Platform: Android

Indicates whether the widevine level supported by device.

Possible values are:

0 - unable to determine widevine support (typically not supported)
1, 2, 3 - Widevine level supported

`isCodecSupported`

Platforms: Android | web

Indicates whether the provided codec is supported level supported by device.

parameters:

mimetype: mime type of codec to query
width, height: resolution to query

Possible results:

hardware - codec is supported by hardware
software - codec is supported by software only
unsupported - codec is not supported

`isHEVCSupported`

Platform: Android

Helper which Indicates whether the provided HEVC/1920*1080 is supported level supported by device. It uses isCodecSupported internally.

Example Usage

import { VideoDecoderProperties } from 'react-native-video';
 
VideoDecoderProperties.getWidevineLevel().then((level) => {
  ...
});
 
VideoDecoderProperties.isCodecSupported('video/hevc', 1920, 1080).then((support) => {
  ...
});
 
VideoDecoderProperties.isHEVCSupported().then((support) => {
  ...
});

Events Caching