react-native - 视频在 react native (android)中不起作用

Question

import React, { Component } from 'react';

import {AppRegistry,StyleSheet,Text,Alert,TouchableOpacity,View,ScrollView,Image,WebView,ListView,Linking } from 'react-native';

import Video from 'react-native-video';

 class SampleRow extends React.Component{

 constructor(props) {
super(props);
this.onLoad = this.onLoad.bind(this);
this.onProgress = this.onProgress.bind(this);
 }

 state = {
rate: 1,
volume: 1,
muted: false,
resizeMode: 'contain',
duration: 0.0,
currentTime: 0.0,
  };

 onLoad(data) {
this.setState({duration: data.duration});
  }

 onProgress(data) {
this.setState({currentTime: data.currentTime});
 }

  render() {
return (
  <View >
   <Video source={{uri:"https://www.youtube.com/watch?v=gQOaYQs07fc"}}
   style={styles.backgroundVideo}
 rate={this.state.rate} 
 volume={this.state.volume}
 muted={this.state.muted} 
 resizeMode={this.state.resizeMode} 
 onLoadStart={() => {console.warn("loading started");}} 
 onLoad={() => {console.warn("loading done");}} 
 onProgress={this.onProgress} 
 onEnd={() => { this.refs.myVideo.refs.node.seek(0) }} repeat={true}
   />
   </View>

    );
   }
  }

  var styles = StyleSheet.create({
  backgroundVideo: {
   position: 'absolute',
     top: 0,
    left: 0,
   bottom: 0,
  right: 0
   }
  });

 AppRegistry.registerComponent('smart', () => SampleRow);

尝试了本地和远程视频。什么都不管用。输出空白页。

以上代码引用自https://github.com/react-native-community/react-native-video/blob/master/example/index.android.js

此处引用 https://github.com/react-native-community/react-native-video/issues/174但没有任何帮助

期待这样的输出 https://www.youtube.com/watch?v=TPGNgovQlRc

Answer 1

您应该在样式中插入 width 和 height。