rn-media-player v0.5.2

rn-media-player

Introduction

This library is specifically designed for the React Native developer community, aiming to provide a robust and highly performant video player solution. By utilizing native components, our goal is to maximize the performance and efficiency of video playback in React Native applications. Maintaining the fluidity and responsiveness that users expect from native video experiences.

table of contents

• Installation

Installation

npm install rn-media-player

yarn add rn-media-player

Usage

import { Video } from "rn-media-player";

// ...
const source = {
  url: "http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4"
  title: "Big Buck Bunny"
}

<Video source={source} />

API Reference

This section provides detailed information about the props, methods, and events supported by the VideoPlayer component.

Configurations

Settings

{
  data: [
    {
      name: 'Qualities',
      enabled: true,
    },
    {
      name: 'Playback Speeds',
      enabled: true,
    },
    {
      name: 'More Options',
      enabled: true,
    },
  ],
}

Speeds

{
    initialSelected: 'Normal',
    data: [
        {
            name: '0.5x',
            value: '0.5',
            enabled: true,
        },
        {
            name: 'Normal',
            value: '1',
            enabled: true,
        },
        {
            name: '1.5x',
            value: '1.5',
            enabled: true,
        },
    ],
}

Controls

Detailed Configuration Options

Note: This library accepts color specifications in hexadecimal format only. Please ensure that all color properties are provided as hex codes.

seekSlider

• maximumTrackColor: Color of the slider track (string)
• minimumTrackColor: Color of the slider track before the thumb (string)
• seekableTintColor: Color of the track showing seekable range (string)
• thumbImageColor: Color of the slider thumb (string)
• thumbnailBorderColor: Border color of the thumbnail on the slider (string)
• thumbnailTimeCodeColor: Color of the time code on the thumbnail (string)

timeCodes

• currentTimeColor: Color of the current playback time (string)
• durationColor: Color of the total duration (string)
• slashColor: Color of the slash between current time and duration (string)

download

• color: Color of the download icon (string)
• progressBarColor: Color of the progress bar frame (string)
• progressBarFillColor: Fill color of the progress bar (string)
• messageDelete: Message displayed on deleting (string)
• messageDownload: Message displayed during downloading (string)
• labelDelete: Label for delete button (string)
• labelCancel: Label for cancel button (string)
• labelDownload: Label for download button (string)

toast

• label: Text label for the toast (string)
• backgroundColor: Background color of the toast (string)
• labelColor: Color of the label text (string)

header

• leftButtonColor: Color of the left button in the header (string)
• titleColor: Color of the title in the header (string)

Events

Detailed Events

Notes to access events must be use callback params ex:

  <Video
    // ...rest code
    onCompleted={(event)  => event.nativeEvent.xxxx}
  />

onBufferCompleted : Called when the video has completed buffering.

: - Parameters:

• completed (boolean): True if buffering is complete and playback can continue.

onVideoDownloaded : Called when the video download status changes.

: - Parameters:

• downloaded (boolean): Indicates whether the video has been fully downloaded.
• status (string): Status message of the download.
• error (any): Error object if the download failed.

onBuffer : Indicates changes in the buffering state of the video.

: - Parameters:

• buffering (boolean): True if the video is currently buffering.

onLoaded : Called when the video is loaded and ready to play.

: - Parameters:

• duration (Float): The total duration of the video.

onVideoProgress : Called periodically during playback to indicate buffering progress and play progress.

: - Parameters:

• buffering (Float): Current buffering state as a float value.
• progress (Float): Current progress of the video playback as a float value.

onPlayPause : Called when the play or pause action is triggered.

: - Parameters:

• isPlaying (boolean): True if the video is currently playing.

onCompleted : Called when the video playback has completed.

: - Parameters:

• completed (boolean): True if the video has finished playing.

onError : Called when there is an error during video playback.

: - Parameters:

• code (number): Error code identifying the type of error.
• userInfo (string): General information about the error.
• description (string): Detailed description of what caused the error.
• failureReason (string): The reason for the video playback failure.
• fixSuggestion (string): Suggested fix for the error.

License

MIT