VideoPlayer

Important: The Vega SDK supports many of the React Native version 0.72 components and APIs. You can use the supported components and APIs in the same manner as an ordinary React Native app. This page lists a specific React Native feature supported by the Vega SDK and contains React Native v72 documentation from the reactnative.dev website created by Meta and other contributors and licensed under the Attribution 4.0 International License. For more information about React Native v72, see the React Native documentation, version 0.72. For the most current feature information, see the Release Notes.

Important: The Kepler Video Player is available on Vega OS 1.1 (201010334150) and previous releases. Starting with with Vega OS 1.1 (201010335550), it is no longer available. For alternatives to Kepler Video Player, see WC3Media Player. For additional information, please ask a question in the Kepler Community.

A general purpose, full screen streaming media player supporting a wide range of video formats on Kepler with standard UI controls which support the following interactions:

Play/pause button
Skip back 10 seconds, skip forward 10 seconds button
Seek bar displays time elapsed and total time, allowing the user to seek to a desired point by dragging the seek bar thumb
Detects error conditions and presents user-friendly error screen
App can register callback for error conditions

Additional capabilities planned:

onStateChange callback
Partial screen playback / mini-player
Shows loading indicators during initialization and seek operations

Example

import {VideoPlayer} from '@amzn/react-native-kepler/Libraries/VideoPlayer/VideoPlayer';
import React from 'react';
import {
    View
} from 'react-native';

const App = () => {
    const videoUrl = 'http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ElephantsDream.mp4';
    return (
        <View style={{flex: 1}}>
            <VideoPlayer videoUrl={videoUrl}
                onError={errorCode => {
                    console.debug(`App got error code ${errorCode}`);
                }}
             />
        </View>
    )
}

export default App;

Reference

Props

videoUrl

Specifies the video url or absolute file path to play. Resource may be of any type supported by underling media player framework, currently including MP4 and HLS.

Type	Required
string	Yes

onStateChange

Specify a function to call back when VideoPlayer state changes. Function has one parameter, the numeric state id to provide current state of video player.

Type	Required
function	No

onError

Specify a function to call back when errors occur. Function has one parameter, the numeric error code that has been forwarded from the underlying media player framework.

Type	Required
function	No

showControls

Specifies the behavior of the video controls.

Possible values:

DEFAULT Controls automatically hide at begin but reappear based on Touch/DPaD,
AUTO_HIDE Controls automatically show at begin and hide after 5 seconds,
ALWAYS_SHOWN Controls are always visible,
NEVER_SHOWN Controls are never shown.

Type	Default	Required
enum(`'DEFAULT', 'AUTO_HIDE', 'ALWAYS_SHOWN', 'NEVER_SHOWN'`)	`DEFAULT`	no

Last updated: Sep 30, 2025