1.1.18 • Published 4 years ago
react-native-calling v1.1.18
react-native-calling
Getting started
$ npm install react-native-calling --save
Required packages install
$ npm install native-base uuid react-native-incall-manager react-native-webrtc react-native-websocket --save
1.) In android/app/src/main/AndroidManifest.xml
add these permissions
<uses-permission android:name="android.permission.CAMERA" />
<uses-feature android:name="android.hardware.camera" />
<uses-feature android:name="android.hardware.camera.autofocus"/>
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-permission android:name="android.permission.WAKE_LOCK" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
Usage
App.js only use
import React, { Component } from 'react';
import { Text, View } from 'react-native';
import { InitMedia, signalingConnection, LoginCall, Online, WebSoket, Call } from "react-native-calling";
export default class App extends Component {
constructor(props) {
super(props);
this.state = {
loading: true,
localVideo: null,
clientID: null,
username: null,
};
}
async componentDidMount() {
let localVideo = await InitMedia("< webSocketURL >", false);
this.setState({
localVideo: localVideo
});
this.setState({
loading: false
});
signalingConnection.addMsgListener(this.onSignalingMessage);
}
onSignalingMessage = async (msg) => {
switch (msg.type) {
case "id":
// server connecting successful thin server id (this is unique)
this.setState({
clientID: msg.id
});
break;
}
}
render() {
if (this.state.loading) {
return (
<View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
<Text>loading....</Text>
</View>
)
}
return (
<>
<Call
localStream={this.state.localVideo}
signalingConnection={signalingConnection}
clientID={this.state.clientID}
username={"your App user username (unique)"}
/>
<View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
<Text>your code only use Call component</Text>
</View>
</>
);
}
}
online userlist live
import { signalingConnection } from "react-native-calling";
signalingConnection.addMsgListener(this.onSignalingMessage);
export default class LiveUserLise extends Component {
constructor(props) {
super(props);
this.state = {
loading: true,
userList: []
};
}
async componentDidMount() {
signalingConnection.addMsgListener(this.onSignalingMessage);
}
onSignalingMessage = async (msg) => {
switch (msg.type) {
case "userlist": // Received an updated user list
this.setState({
userList: msg.userfull
});
break;
}
}
render() {
return (
<View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
<Text>Your code</Text>
</View>
)
}
}
online userlist get
import { Online } from "react-native-calling";
await Online(); // user this function
call button
import { LoginCall } from "react-native-calling";
await LoginCall("youer user name ", "call user username");
1.1.18
4 years ago
1.1.17
4 years ago
1.1.16
4 years ago
1.1.15
4 years ago
1.1.14
4 years ago
1.1.13
4 years ago
1.1.12
4 years ago
1.1.11
4 years ago
1.1.10
4 years ago
1.1.9
4 years ago
1.1.8
4 years ago
1.1.7
4 years ago
1.1.6
4 years ago
1.1.5
4 years ago
1.1.4
4 years ago
1.1.3
4 years ago
1.1.2
4 years ago
1.1.1
4 years ago
1.1.0
4 years ago
1.0.3
4 years ago
1.0.2
4 years ago
1.0.1
4 years ago
1.0.0
4 years ago