Video functionality to React Native app

If you’re a mobile application developer, skilled in React Native, then it’s highly likely you would like to feature a video player in your app.

In this article, I am going to explain how we can add a video component for the React Native app.

Before starting I am assuming you have following things:

• React Native project
• React Navigation installed in the project

React Native Libraries used in this:

• React Native Video
• React Native Media Controls

Video Component:

• There are many libraries available to play video in React Native but react-native-video may be a good library to use, so I personally wish to use it.
• React Native Video provides all the props which you’d like while playing a video which we will control easily. React Native Video doesn’t provide the inbuilt controls to Play, Pause or Seek the video as they have to supply the props for the entire access. If you’re interested in designing your own controls then you can use a supporting library called react-native-media-controls It provides you all the functional controls which you would like for a typical video player.

Installation of Dependencies:

For Video and MediaControls components, we’d like to put in react-native-video and react-native-media-controls dependencies.

Run the following commands to install:

• npm install –save react-native-video
• npm install –save react-native-media-controls
• For Media control package there is dependency of slider package:
• npm install –save react-native-slider

Read more: https://tudip.com/blog-post/video-functionality-to-react-native-app/