Przez jakiś czas byłem w tym kodzie podczas próby wymieniania moich filmów z lokalnego katalogu do mojej aplikacji natywnej reagowania. Poprosiłem o kilka pytań jako nowicjusze w tym momencie wcześniej, gdy zacząłem projekt, ale nie otrzymałem żadnej odpowiedzi. Jakoś udało mi się dotrzeć do tego punktu. Udało mi się zdobyć moje filmy z mojego lokalnego katalogu, ale problemem jest, że moje filmy są tylko pokazującymy szare miniatury, a kiedy dotknę dowolnego filmu, daje referenceError: nie można znaleźć zmiennej: Filmy

Poniżej znajduje się mój zrzut ekranu i mój kod. Muszę poprawić złe rzeczy, które robię na tym kodzie. Z góry dziękuje za twoją pomoc. Moja lista wideo

 constructor(Props) {
        super(Props);
        this.state = {
          videos: [],
          playing: false,
          screenType: 'content',
          resizeMode: 'contain',
          currentTime: 0,
          videoPlayer: null,
          duration: 0,
          isFullScreen: false,
          isLoading: true,
          paused: false,
          playerState: PLAYER_STATES.PLAYING,

    
        };

To jest mój konstruktor

 componentDidMount() {
        var filePath = RNFetchBlob.fs.dirs.MovieDir + '/Voc Vedos/';
        RNFetchBlob.fs.ls(filePath)
        .then(files => {
        this.setState({videos:files});
        console.warn(files);
        }).catch(err=>alert(err.toString()))
    }

Właśnie tam dostałem moje filmy z mojego lokalnego katalogu na moim urządzeniu

render() {
        const { duration, currentTime, paused, overlay } = this.state
        
        return(
           <View style={styles.container}>
               <FlatList
                data={this.state.videos}
                keyExtractor={item=>item}
                ItemSeparatorComponent={() => { return (<View style={styles.separator} />) }}
                // viewabilityConfig={this.viewabilityConfig}

                // onViewableItemsChanged={this.onViewableItemsChanged}
                // viewabilityConfig={{
                //     itemVisiblePercentThreshold: 95
                //   }}
                  numColumns={3}
                  renderItem={({ item, index, separators }) => (
                    <TouchableOpacity
                        onPress={() => this._onPress(item)}       
                        style={{width:100,height:100}}>
                          <View
                        style={{width:100,height:100, margin:8}}
                        >
                            <Video
                                source ={{uri: '/storage/emulated/0/Movies/Voc Vedos/'+{item}}}
                                ref={(ref: Video) => { this.video = ref }}
                                style={{width:100,height:100}}
                                rate={this.state.rate}
                                paused={this.state.paused}
                                volume={this.state.volume}
                                muted={this.state.muted}
                                resizeMode={this.state.resizeMode}
                                onLoad={this.onLoad}
                                onProgress={this.onProgress}
                                onEnd={this.onEnd}
                                onAudioBecomingNoisy={this.onAudioBecomingNoisy}
                                onAudioFocusChanged={this.onAudioFocusChanged}

                            />
                            <MediaControls
                                isFullScreen={this.state.isFullScreen}
                                duration={duration}
                                isLoading={this.state.isLoading}
                                mainColor="purple"
                                onFullScreen={noop}
                                onPaused={this.state.onPaused}
                                onReplay={this.state.onReplay}
                                onSeek={this.state.onSeek}
                                onSeeking={this.state.onSeeking}
                                playerState={this.state.playerState}
                                progress={currentTime}
                            />
                            
                        </View>
                    </TouchableOpacity>
                )}   
               />
               
           </View>

To jest mój kod renderowania. Proszę, potrzebuję pomocy, jak prawidłowo wyświetlić moje filmy i grać w wideo

1
Benjamin Ikwuagwu 27 lipiec 2020, 12:56

1 odpowiedź

Najlepsza odpowiedź

Według reakcji-natywnych dokumentów: Aby uzyskać źródło plików w pamięci urządzenia, musi napisać "Plik: //" początek ścieżki

Przykład:

Źródło = {{URI: "Plik: ///sdcard/movies/sintel.mp4 '}}

Czytaj dokument https://github.com/reaget-Native-community/ Reaguj-Native-Video # Źródło

0
Mohammad Mas 7 wrzesień 2020, 11:16