react-native-hk-video
v1.1.6
Published
hk video custom
Downloads
7
Readme
react-native-hk-video
Getting started
$ npm install react-native-hk-video --save
Mostly automatic installation
$ react-native link react-native-hk-video
Manual installation
iOS
- In XCode, in the project navigator, right click
Libraries
➜Add Files to [your project's name]
- Go to
node_modules
➜react-native-hk-video
and addRNHkVideo.xcodeproj
- In XCode, in the project navigator, select your project. Add
libRNHkVideo.a
to your project'sBuild Phases
➜Link Binary With Libraries
- Run your project (
Cmd+R
)<
Android
- Open up
android/app/src/main/java/[...]/MainActivity.java
- Add
import com.qb.hkVideo.RNHkVideoPackage;
to the imports at the top of the file - Add
new RNHkVideoPackage()
to the list returned by thegetPackages()
method
- Append the following lines to
android/settings.gradle
:include ':react-native-hk-video' project(':react-native-hk-video').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-hk-video/android')
- Insert the following lines inside the dependencies block in
android/app/build.gradle
:compile project(':react-native-hk-video')
- tips need @react-native-community/slider
yarn add @react-native-community/slider react-native link @react-native-community/slider doc https://github.com/callstack/react-native-slider
Usage
import HkPlayer from "react-native-hk-video";
const selectCameraInfos={
// id:'25908ad1-b467-4d9f-8292-6f87854cd1be',
id: '*******',
name:"测试摄像头1",
channel:"1",
status: '1',
}
const requestInfo={
token:'',
api:'http://***',
protocol:'rtsp',
getPlayUrl:"/***",
controlUrl:"/***",
getPlayBackUrl:"/***",
}
<HkPlayer
roundCiameter={180} //控制圈的直径
controlButSize={23}
offsetHeight={60}
offsetWidth={50}
requestInfo={requestInfo}
playerHeight={550} //播放器高度
selectCameraInfos={selectCameraInfos}
cameraList={cameraList}
backHandler={} //返回按钮事件
invalidTokenHander={} //token过期事件
showCloudTypes={["1"]} //显示云台控制的摄像头类型 字符串
/>
// TODO: What to do with the module?
RNHkVideo;