react-native-aliplayer

阿里云点播播放器 RN 封装,支持多种播放格式,支持 android 和 ios

Getting started

$ npm install react-native-aliplayer --save

Mostly automatic installation

$ react-native link react-native-aliplayer

Manual installation

Usage

import RNAliplayer from 'react-native-aliplayer';

const source='http://200024424.vod.myqcloud.com/200024424_709ae516bdf811e6ad39991f76a4df69.f20.mp4'

<RNAliplayer source={source} style={{ width: screenWidth, height: 200 }} />;

Props

name	description
source	播放资源
poster	封面图
enableFullScreen	是否允许全屏
themeColor	主题色
onFullScreen	全屏事件
onCompletion	播放完毕事件
enableCast	是否显示投屏按钮
onCastClick	投屏按钮点击事件
onChangeBitrate	分辨率切换

Method

name	parmas	description
play	true/false	开始/暂停播放
fullscreen	true/false	控制是否全屏
stop	/	停止播放
seekTo	number(秒)	快进到多少秒

this.RNAliplayerRef.play();
this.RNAliplayerRef.fullscreen();

Custom ui

自定义控制层 UI

import ALIViewPlayer from 'react-native-aliplayer/ALIViewPlayer';

// ALIViewPlayer 支持参数可见源码 ALIViewPlayer.propTypes
<ALIViewPlayer>
  <CustomUi />
</ALIViewPlayer>;