Cómo rechazar o responder una llamada entrante en una aplicación de React Native con botones personalizados (¿Puedo usar react-native-call-keep?)
Estoy usando el paquete react-native-call-detection para guardar el número de llamada entrante (y enviarlo al servidor más tarde), también quiero rechazar/responder la llamada entrante en función del botón presionado (según la respuesta del servidor más tarde).
¿Qué paquete debo usar para hacerlo? Solo encontré react-native-call-keep pero todos los ejemplos proporcionaron un número de teléfono falso a las funciones y no sé cómo usar sus funciones o cómo obtener mi UUID de llamada. Solo sé que hay funciones para rechazar/responder la llamada y debo llamar a las funciones addEventListener antes de llamar a las funciones.
Aquí está mi código actual:
“`import React, {useEffect, useState} from ‘react’;
import RNCallKeep from 'react-native-callkeep';
import {
View,
Text,
StyleSheet,
TouchableOpacity,
TouchableHighlight,
PermissionsAndroid,
} from 'react-native';
import CallDetectorManager from 'react-native-call-detection';
import RNCallKeep from 'react-native-callkeep';
export default class MasterScreen extends React.Component {
constructor(props) {
super(props);
this.state = {
featureOn: false,
incoming: false,
number: null,
};
}
componentDidMount() {
this.askPermission();
this.startListenerTapped();
this.setupCallKeep();
}
setupCallKeep() {
const options = {
android: {
alertTitle: 'Permisos requeridos',
alertDescription:
'Esta aplicación necesita acceder a tus cuentas de llamadas para hacer llamadas',
cancelButton: 'Cancelar',
okButton: 'Aceptar',
imageName: 'ic_launcher',
additionalPermissions: [PermissionsAndroid.PERMISSIONS.READ_CONTACTS],
},
};
<pre><code>try {
RNCallKeep.setup(options);
RNCallKeep.setAvailable(true); // Solo se usa para Android, ver la documentación anterior.
} catch (err) {
console.error('initializeCallKeep error:', err.message);
}
</code></pre>
}
askPermission = async () => {
try {
const permissions = await PermissionsAndroid.requestMultiple([
PermissionsAndroid.PERMISSIONS.READ_CALL_LOG,
PermissionsAndroid.PERMISSIONS.READ_PHONE_STATE,
]);
console.log('Los permisos son:', permissions);
} catch (err) {
console.warn(err);
}
};
startListenerTapped = () => {
this.setState({featureOn: true});
this.callDetector = new CallDetectorManager(
(event, phoneNumber) => {
console.log(event);
if (event === 'Disconnected') {
this.setState({incoming: false, number: null});
} else if (event === 'Incoming') {
this.setState({incoming: true, number: phoneNumber});
} else if (event === 'Offhook') {
this.setState({incoming: true, number: phoneNumber});
} else if (event === 'Missed') {
this.setState({incoming: false, number: null});
}
},
true,
() => {},
{
title: 'Permiso de estado de llamada',
message:
'Esta aplicación necesita acceso a tu estado de llamada para reaccionar y/o adaptarse a las llamadas entrantes.',
},
);
};
stopListenerTapped = () => {
this.setState({featureOn: false});
this.callDetector && this.callDetector.dispose();
};
render() {
return (
<view style="{styles.body}">
<text>número de llamada entrante: {this.state.number}</text>
<touchableopacity onpress="{/*qué" hacer="" */}="" style="{{" width:="" 200,="" height:="" 200,="" justifycontent:="" 'center',="" }}=""><text>contestar</text></touchableopacity>
<pre><code> <touchableopacity onpress="{/*qué" hacer="" */}="" style="{{" width:="" 200,="" height:="" 200,="" justifycontent:="" 'center',="" }}="">
<text>rechazar</text>
</touchableopacity>
</view>
);
</code></pre>
}
}
const styles = StyleSheet.create({
body: {
backgroundColor: 'honeydew',
justifyContent: 'center',
alignItems: 'center',
flex: 1,
},
text: {
padding: 20,
fontSize: 20,
},
button: {},
});
“`
davy.ai
Para responder y rechazar llamadas entrantes en react-native basado en la respuesta del servidor, puedes utilizar el paquete react-native-voip-call. Este paquete provee métodos para responder y rechazar llamadas, así como para monitorear eventos de llamada.
Para utilizar el paquete react-native-voip-call, necesitarías instalarlo en tu proyecto y configurar los permisos necesarios. Luego, puedes utilizar los métodos answerCall y rejectCall para manejar llamadas entrantes basado en la respuesta del servidor.
Aquí tienes un ejemplo de código que utiliza el paquete react-native-voip-call para manejar llamadas entrantes:
Nota que necesitarías pasar el UUID de la llamada devuelto por el método addEventListener del paquete react-native-call-keep a los métodos answerCall y rejectCall del paquete react-native-voip-call.