React-native-video在Android端无法正常播放视频问题求助

兄弟，我仔细看了你的问题描述和配置文件，版本不兼容绝对是核心问题！你的React Native版本是0.55.4，却用了react-native-video@2.0.0——这个版本对RN0.55+的Android端支持有明显bug，比如ExoPlayer渲染冲突、音频视频不同步，刚好对应你遇到的白屏、闪烁问题。下面给你一步步解决的方案：

1. 降级react-native-video到适配版本 #

RN0.55.4最适配的react-native-video版本是1.0.x系列，比如1.0.1，先卸载当前版本再安装指定版本：

npm uninstall react-native-video
npm install react-native-video@1.0.1 --save

然后重新执行link确保配置正确：

react-native link react-native-video

2. 修正Android AppCompat依赖版本 #

你的build.gradle里用的com.android.support:appcompat-v7:23.0.1和RN0.55.4不匹配，RN0.55.x对应的AppCompat版本应该是27.0.1，版本不匹配会导致UI渲染异常：

dependencies {
 compile project(':react-native-video')
 compile fileTree(dir: "libs", include: ["*.jar"])
 // 修改这里的版本号
 compile "com.android.support:appcompat-v7:27.0.1"
 compile "com.facebook.react:react-native:+" // From node_modules
}

如果修改后出现依赖冲突，添加强制匹配规则：

// 在android{}块内添加
configurations.all {
    resolutionStrategy.force 'com.android.support:appcompat-v7:27.0.1'
}

3. 调整Video组件配置，避免渲染异常 #

给Video组件添加几个关键属性，同时明确宽高样式，避免依赖StyleSheet.absoluteFill的潜在问题：

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

export default class App extends Component {
  render() {
    return (
      <View style={styles.container}>
        <Video
          source={require("./lights.mp4")} // 改用require方式更可靠
          resizeMode="cover"
          style={styles.video}
          useNativeControls={false} // 禁用原生控件避免渲染冲突
          repeat={true}
          // 添加回调排查加载问题
          onLoadStart={() => console.log("视频开始加载")}
          onLoad={(data) => console.log("视频加载完成", data)}
          onError={(error) => console.log("视频加载错误", error)}
        />
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
  video: {
    position: 'absolute',
    top: 0,
    left: 0,
    bottom: 0,
    right: 0,
  },
});

4. 清理缓存并重新构建 #

缓存经常会导致各种奇怪的问题，执行以下命令彻底清理：

# 清理Android构建缓存
cd android && ./gradlew clean
# 回到根目录，重置metro缓存并重启服务
cd .. && npm start -- --reset-cache

完成以上步骤后，重新运行react-native run-android，应该就能正常播放视频了。如果还是有问题，可以看控制台的onError回调输出，排查具体的加载错误。

内容的提问来源于stack exchange，提问作者user9840214