react-native-aliplayer-wu

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	分辨率切换
onProgress	进度回调
onPrepare	播放准备回调
isLandscape	全屏是否横屏

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

Skip to content Search or jump to… Pull requests Issues Marketplace Explore

@liangsay LewinJun / react-native-aliyunplayer Public Code Issues 1 Pull requests Actions Projects Wiki Security Insights You’re making changes in a project you don’t have write access to. We’ve created a fork of this project for you to commit your proposed changes to. Submitting a change will write it to a new branch in your fork, so you can send a pull request. react-native-aliyunplayer / README.md in LewinJun:main

Spaces

4

Soft wrap 1

react-native-lewin-aliyunplayer

2 阿里云播放器 react native,播放暂停等1.0版本没有UI，需自定义 3 ​ 4 ​ 5

Table of contents

6

• Install 7
• Usage 8 ​ 9 ​ 10

Install

11

1: yarn add 或者npm install

12 yarn add react-native-lewin-aliyunplayer 13 ​ 14

2: android需要配置build.gradle maven {url 'https://maven.aliyun.com/repository/releases'}

15

16
allprojects {
17
    repositories {
18
        mavenLocal()
19
        maven {
20
            // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
21
            url("$rootDir/../node_modules/react-native/android")
22
        }
23
        maven {
24
            // Android JSC is installed from npm
25
            url("$rootDir/../node_modules/jsc-android/dist")
26
        }
27
        maven {
28
            url 'https://maven.aliyun.com/repository/releases'
29
        }
30
        google()
31
        jcenter()
32
        maven { url 'https://www.jitpack.io' }
33
    }
34
}
35

36 ​ 37

Usage

38

39
this.player?.startPlay() : this.player?.pausePlay()
40
<AliPlayer
41
    ref={(e) => this.player = e}
42
    style={{ flex: 1 }}
43
    source='https://d-appimg.doctopia.com.cn/video/1626170384423967.mp4'
44
    setAutoPlay={true}
45
    setLoop={true}
未选择任何文件
Attach files by dragging & dropping, selecting or pasting them.
@liangsay
Propose changes
Commit summary
Create README.md
Optional extended description
Add an optional extended description…
 
© 2022 GitHub, Inc.
Terms
Privacy
Security
Status
Docs
Contact GitHub
Pricing
API
Training
Blog
About