react-native-theoplayer
Advanced tools
This projects falls under the license as defined in https://github.com/THEOplayer/license-and-disclaimer.
The react-native-theoplayer package provides a THEOplayerView component supporting video playback on the
following platforms:
This document covers the creation of a minimal app including a THEOplayerView component,
and an overview of the accompanying example app with a user interface provided
by the @theoplayer/react-native-ui package.
It also gives a description of the properties of the THEOplayerView component, and
a list of features and known limitations.
For each platform, a dependency to the corresponding THEOplayer SDK is included through a dependency manager:
In order to use one of these THEOplayer SDKs, it is necessary to obtain a valid THEOplayer license for that specific platform, i.e. HTML5, Android, and/or iOS. You can sign up for a THEOplayer SDK license through our portal.
If you have no previous experience in React Native, we encourage you to first explore the React Native Documentation, as it gives you a good start on one of the most popular app development frameworks.
These are guides on how to use the THEOplayer React Native SDK in your React Native project(s) and can be used linearly or by searching the specific section. It is recommended that you have a basic understanding of how React Native works to speed up the way of working with THEOplayer React Native SDK.
Depending on the platform on which the application is deployed, a different set of features is available.
If a feature missing, additional help is needed, or you need to extend the package, please reach out to us for support.
| Feature | Android, Android TV, Fire TV | Web | iOS, tvOS |
|---|---|---|---|
| Streaming | MPEG-DASH (fmp4, CMAF), HLS (TS, CMAF), Progressive MP4, MP3 | HLS (TS, CMAF), Progressive MP4, MP3 | |
| Content Protection | Widevine | Widevine, PlayReady, Fairplay | Fairplay |
| DRM Connectors | BuyDRM, EZDRM, Anvato, Titanium, Axinom, Irdeto, VuDRM, Comcast, Verimatrix, Azure, … | ||
| Analytics Connectors | Adobe, Agama, Comscore, Conviva, Mux, Nielsen, Youbora | ||
| Subtitles & Closed Captions | CEA-608/708, SRT, TTML, WebVTT | ||
| Metadata | Event stream, emsg, ID3, EXT-X-DATERANGE, EXT-X-PROGRAM-DATE-TIME | ||
| Advertising Integration | Google IMA, Google DAI | ||
| Cast Integration | Chromecast | Chromecast, Airplay | |
| Presentation Mode | Inline, Picture-in-Picture, Fullscreen | ||
| Audio Control Management | Audio focus & Audio-Becoming-Noisy mgmt | (Audio control management by platform) | |
| Advanced APIs | Background playback, Media Session, Media Cache (offline playback) | Background playback, NowPlaying, Media Cache (iOS only) | |
User Interface@theoplayer/react-native-ui | Basic playback, media & text track selection, progress bar, live & vod, preview thumbnails, customisable & extensible |
The react-native-theoplayer package can be combined with any number of connectors to provide extra
functionality. Currently, the following connectors are available:
| Package name | Purpose | Registry |
|---|---|---|
@theoplayer/react-native-analytics-adobe | Adobe analytics connector |  |
@theoplayer/react-native-analytics-agama | Agama analytics connector |  |
@theoplayer/react-native-analytics-comscore | Comscore analytics connector |  |
@theoplayer/react-native-analytics-conviva | Conviva analytics connector |  |
@theoplayer/react-native-analytics-mux | Mux analytics connector |  |
@theoplayer/react-native-analytics-nielsen | Nielsen analytics connector |  |
@theoplayer/react-native-analytics-youbora | Youbora analytics connector |  |
@theoplayer/react-native-drm | Content protection (DRM) connectors |  |
@theoplayer/react-native-ui | React Native user interface |  |
@theoplayer/react-native-connector-template | A template forreact-native-theoplayer connectors. |  |
This section starts with creating a minimal demo app that integrates the react-native-theoplayer package,
followed by an overview of the available properties and functionality of the THEOplayerView component.
An example application including a basic user interface and demo sources is included in the
git repository,
and discussed in the next section.
This section gives an overview of features, limitations and known issues:
See the API Reference for detailed documentation about all available components and functions.
[7.2.0] - 24-05-12
resize player event enabling monitoring of player resizes.width and height properties to THEOplayer containing the player's current dimensions in pixels.AD_CLICKED, AD_TAPPED, AD_ICON_TAPPED and AD_ICON_FALLBACK_IMAGE_CLOSED ad events for Android platforms.scheduledAdBreaks list did not include the pre-roll ad on play-out of a Google DAI stream.FAQs
A THEOplayer video component for react-native.
The npm package react-native-theoplayer receives a total of 776 weekly downloads. As such, react-native-theoplayer popularity was classified as not popular.
We found that react-native-theoplayer demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 0 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Research
Security News
Socket researchers uncover a malicious npm package posing as a tool for detecting vulnerabilities in Etherium smart contracts.
Security News
Research
A supply chain attack on Rspack's npm packages injected cryptomining malware, potentially impacting thousands of developers.
Research
Security News
Socket researchers discovered a malware campaign on npm delivering the Skuld infostealer via typosquatted packages, exposing sensitive data.