React Native视频播放(iOS)

前端之家收集整理的这篇文章主要介绍了React Native视频播放(iOS)前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

网站链接http://www.ncloud.hk/%E6%8A%80%E6%9C%AF%E5%88%86%E4%BA%AB/learn-react-native-video/

React Native项目中插入视频播放的简单教程(iOS)。

在你的项目中执行以下步骤:

1.运行npm install react-native-video --save

2.iOS下:

(1)在Xcode中打开你的项目,在名字为Libraries上点右键,然后点击Add Files to "Your Project Name";

(2)添加libRTCVideo.a到Build Phases -> Link Binary With Libraries

(3)添加项目中的.mp4格式的视频文件到Build Phases -> Copy Bundle Resources

(4)在你的项目中使用以下命令就可以得到你想引用的视频:

调用视频用法:

复制代码

//Withinyourrenderfunction,assumingyouhaveafilecalled
//"background.mp4"inyourproject.Youcanincludemultiplevideos
//onasinglescreenifyoulike.<Videosource={{uri:"background"}}//CanbeaURLoralocalfile.
rate={1.0}//0ispaused,1isnormal.
volume={1.0}//0ismuted,1isnormal.
muted={false}//Mutestheaudioentirely.
paused={false}//Pausesplaybackentirely.
resizeMode="contain"//Fillthewholescreenataspectratio.
repeat={true}//Repeatforever.
onLoadStart={this.loadStart}//Callbackwhenvideostartstoload
onLoad={this.setDuration}//Callbackwhenvideoloads
onProgress={this.setTime}//Callbackevery~250mswithcurrentTime
onEnd={this.onEnd}//Callbackwhenplaybackfinishes
onError={this.videoError}//Callbackwhenvideocannotbeloaded
style={styles.backgroundVideo}/>//Lateroninyourstyles..
varstyles=Stylesheet.create({
backgroundVideo:{
position:'absolute',top:0,left:0,bottom:0,right:0,},});
原文链接:https://www.f2er.com/react/307114.html

猜你在找的React相关文章