react-native-video: React-native-video not working for android

I’m trying to play videos on my react-native project for android.

Installed

react-native-video && react-native link

I can’t play local storage and online videos.

problem

  • Sometimes audio only coming with the white screen.
  • sometimes video is flickering.

package,json

{
  "name": "viapp",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "dependencies": {
    "react": "16.3.1",
    "react-native": "0.55.4",
    "react-native-video": "^2.0.0"
  },
  "devDependencies": {
    "babel-jest": "23.0.0",
    "babel-preset-react-native": "4.0.0",
    "jest": "23.0.0",
    "react-test-renderer": "16.3.1"
  },
  "jest": {
    "preset": "react-native"
  }
}

settings.gradle

rootProject.name = 'viapp'
include ':react-native-video'
project(':react-native-video').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-video/android')
include ':app'

Build.gradle

dependencies {
    compile project(':react-native-video')
    compile fileTree(dir: "libs", include: ["*.jar"])
    compile "com.android.support:appcompat-v7:23.0.1"
    compile "com.facebook.react:react-native:+"  // From node_modules
}

MainApplication.java

package com.viapp;

import android.app.Application;

import com.facebook.react.ReactApplication;
import com.brentvatne.react.ReactVideoPackage;
import com.facebook.react.ReactNativeHost;
import com.facebook.react.ReactPackage;
import com.facebook.react.shell.MainReactPackage;
import com.facebook.soloader.SoLoader;

import java.util.Arrays;
import java.util.List;

public class MainApplication extends Application implements ReactApplication {

  private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
    @Override
    public boolean getUseDeveloperSupport() {
      return BuildConfig.DEBUG;
    }

    @Override
    protected List<ReactPackage> getPackages() {
      return Arrays.<ReactPackage>asList(
          new MainReactPackage(),
            new ReactVideoPackage()
      );
    }

    @Override
    protected String getJSMainModuleName() {
      return "index";
    }
  };

  @Override
  public ReactNativeHost getReactNativeHost() {
    return mReactNativeHost;
  }

  @Override
  public void onCreate() {
    super.onCreate();
    SoLoader.init(this, /* native exopackage */ false);
  }
}

App.js

import React, { Component } from 'react';
import {
  Platform,
  StyleSheet,
  Text,
  View
} from 'react-native';

import Video from 'react-native-video';
import Dog from './dog.mp4';
import LightVideo from "./lights.mp4";

export default class App extends Component {
  render() {
    return (
      <View style={styles.container}>
        <Video
          source={LightVideo}
          resizeMode="cover"
          style={StyleSheet.absoluteFill}
        />

      </View>
    );
  }
}



// Later on in your styles..


const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
});

I don’t know where i made mistake.I tried uri it also not working.the version is doubtfull for me.

Any help would be really appreciated

About this issue

  • Original URL
  • State: closed
  • Created 6 years ago
  • Reactions: 9
  • Comments: 38 (5 by maintainers)

Most upvoted comments

Update to the newest release and see if using ExoPlayer resolves the issues. You can do this by changing your settings.gradle from '../node_modules/react-native-video/android' to '../node_modules/react-native-video/android-exoplayer'

I am using react-native-video with react-native-video-controls everything is working fine in the emulator but in the real device video and thumbnail, both are not loading. Can anybody please help?

For me, I had to do the opposite and changed ‘…/node_modules/react-native-video/android-exoplayer’ to ‘…/node_modules/react-native-video/android’. Then it worked.

This might be because when I installed, I specified the version
npm install react-native-video@3.2.1
because I’m also using “react-native-gifted-chat” which requires that version of “react-native-video”.

react-native: “0.61.5” react-native-video: “^5.0.2”

Audio is Fine. Video is not playing in Android.

iOS recorded video is not playing in some android devices like Samsung J7, M30.

Getting the below issue whenever play the video.

error:{
   extra: -2147483648
   what: 1
}

same issue in android

@akashdk How did this turn out for you?

@havinhthai @deniaz My guess is the device doesn’t support the video codecs needed. Android devices vary greatly, so it’s hard to know what will work and what won’t #smh

@cobarxI did that but my emulator is stopped working sometimes it shows the below image. is there anything wrong with version is installed? I have the latest version r-n-v@2.1.1 and r-n@0.55 Thanks! capture

+923015049608 It’s my contect number.

I changed ‘…/node_modules/react-native-video/android’ to ‘…/node_modules/react-native-video/android-exoplayer’ in setting.gradle but have the same problems as had @akashdk. Who could find a proper solution?