2017-08-05 187 views
0

我已經複製並引用了所有使用視頻作爲我的背景的原始文件,但它仍然不顯示。我沒有收到任何錯誤。我已經參考了文檔,並一直堅持2個小時。React原生背景視頻未顯示

這裏是我的代碼

import React, { Component } from "react"; 
import { AppRegistry, StyleSheet, Text, View, TextInput } from "react- 
native"; 

import Video from "react-native-video"; 
import LightVideo from "./Turntablevid.mp4"; 

    export default class BackgroundVid extends Component { 
    render() { 
    return (
     <View style={styles.container}> 
     <Video repeat source={LightVideo} resizeMode="cover" style= 
     {StyleSheet.absoluteFill} /> 
     <View> 
     <Text style={styles.header}>Login</Text> 
     <TextInput 
     placeholder="Email" 
     style={styles.input} 
     /> 
     <TextInput 
     placeholder="Password" 
     secureTextEntry 
     style={styles.input} 
     /> 
    </View> 
    </View> 
); 
} 
} 

const styles = StyleSheet.create({ 
container: { 
flex: 1, 
alignItems: "center", 
justifyContent: "center", 
    }, 
header: { 
fontSize: 30, 
color: "#FFF", 
backgroundColor: "transparent", 
textAlign: "center" 
    }, 
    input: { 
    width: 300, 
    height: 50, 
    backgroundColor: "#FFF", 
    marginVertical: 15, 
    paddingLeft: 15 
    } 
    }); 

回答

0

用這個例子:

<Video source={require('./Turntablevid.mp4')} 
     ref={(ref) => { 
     this.player = ref 
     }}          // Store reference 
     rate={1.0}        // 0 is paused, 1 is normal. 
     volume={1.0}       // 0 is muted, 1 is normal. 
     muted={false}       // Mutes the audio entirely. 
     paused={false}       // Pauses playback entirely. 
     resizeMode="cover"      // Fill the whole screen at aspect ratio.* 
     repeat={true}       // Repeat forever. 
     playInBackground={false}    // Audio continues to play when app entering background. 
     playWhenInactive={false}    // [iOS] Video continues to play when control or notification center are shown. 
     ignoreSilentSwitch={"ignore"}   // [iOS] ignore | obey - When 'ignore', audio will still play with the iOS hard silent switch set to silent. When 'obey', audio will toggle with the switch. When not specified, will inherit audio settings as usual. 
     progressUpdateInterval={250.0}   // [iOS] Interval to fire onProgress (default to ~250ms) 
     onLoadStart={this.loadStart}   // Callback when video starts to load 
     onLoad={this.setDuration}    // Callback when video loads 
     onProgress={this.setTime}    // Callback every ~250ms with currentTime 
     onEnd={this.onEnd}      // Callback when playback finishes 
     onError={this.videoError}    // Callback when video cannot be loaded 
     onBuffer={this.onBuffer}    // Callback when remote video is buffering 
     onTimedMetadata={this.onTimedMetadata} // Callback when the stream receive some metadata 
     style={styles.backgroundVideo} /> 

// Later to trigger fullscreen 
this.player.presentFullscreenPlayer() 

// To set video position in seconds (seek) 
this.player.seek(0) 

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