2017-08-05 1 views
0

Ich habe kopiert und verwiesen alle Starter-Dateien für die Verwendung eines Videos als Hintergrund in reagieren native, aber es immer noch nicht angezeigt. Ich bekomme keine Fehler. Ich habe auf die Dokumentation verwiesen und bin für 2 Stunden darauf festgefahren.Reactive Native Background Video wird nicht angezeigt

Hier ist mein Code

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 
    } 
    }); 

Antwort

0

Verwendung In diesem Beispiel:

<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, 
    }, 
});