React-Native視頻組件react-native-video使用(安卓版)


轉載請注明原文地址:http://www.cnblogs.com/ygj0930/p/7366019.html

一:安裝

在IDE中打開你的項目,然后在IDE的terminal,輸入:

npm i -S react-native-video

安裝第三方的視頻組件。

然后,執行以下命令,把下載回來的第三方庫連接到本地庫中:

 react-native link

 

二:使用
在RN的js文件中,引入視頻播放組件:

import Video from 'react-native-video';

然后,在就可以使用這個組件來播放視頻了。

播放本地視頻:

<Video
    source={require('./video/xx.mp4')}
    style={styles.播放器樣式}
    rate={this.state.rate}                          // 控制暫停/播放,0 代表暫停paused, 1代表播放normal.
    paused={false}
    volume={1}                   // 聲音的放大倍數,0 代表沒有聲音,就是靜音muted, 1 代表正常音量 normal,更大的數字表示放大的倍數
    muted={true}                  // true代表靜音,默認為false.
    resizeMode='contain'       // 視頻的自適應伸縮鋪放行為,
    onLoad={this.onLoad}                       // 當視頻加載完畢時的回調函數
    onLoadStart={this.loadStart}            // 當視頻開始加載時的回調函數
    onProgress={this.onProgress}   //  進度控制,每250ms調用一次,以獲取視頻播放的進度
    onEnd={this.onEnd}             // 當視頻播放完畢后的回調函數
    onError={this.videoError}    // 當視頻不能加載,或出錯后的回調函數

repeat={false} // 是否重復播放 />

播放網絡視頻:

<Video
    source={{uri:'視頻url'}}
    style={styles.播放器樣式}
    rate={this.state.rate}                          // 控制暫停/播放,0 代表暫停paused, 1代表播放normal.
    paused={false}
    volume={1}                   // 聲音的放大倍數,0 代表沒有聲音,就是靜音muted, 1 代表正常音量 normal,更大的數字表示放大的倍數
    muted={true}                  // true代表靜音,默認為false.
    resizeMode='contain'       // 視頻的自適應伸縮鋪放行為,
    onLoad={this.onLoad}                       // 當視頻加載完畢時的回調函數
    onLoadStart={this.loadStart}            // 當視頻開始加載時的回調函數
    onProgress={this.onProgress}   //  進度控制,每250ms調用一次,以獲取視頻播放的進度
    onEnd={this.onEnd}             // 當視頻播放完畢后的回調函數
    onError={this.videoError}    // 當視頻不能加載,或出錯后的回調函數

repeat={false} // 是否重復播放 />

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM