如何在React Native中使用Agora实现语音通话？

你不需要更换套件，Agora Video Kit本身支持快速切换为纯语音通话模式，只需通过配置参数即可实现。以下是适配最新Agora RN UIKit的代码示例：

完整代码示例 #

import React, { useState } from 'react';
import { Text, TouchableOpacity, View, StyleSheet } from 'react-native';
import AgoraUIKit from 'agora-rn-uikit';

const App = () => {
  const [isInCall, setIsInCall] = useState(false);
  const connectionData = {
    appId: '<你的Agora App ID>',
    channel: 'voice-test',
  };
  const rtcCallbacks = {
    EndCall: () => setIsInCall(false),
  };

  return (
    <View style={styles.container}>
      {isInCall ? (
        <AgoraUIKit
          connectionData={connectionData}
          rtcCallbacks={rtcCallbacks}
          audioOnly={true} // 启用纯语音模式
          showVideo={false} // 隐藏视频相关UI元素
        />
      ) : (
        <TouchableOpacity style={styles.startButton} onPress={() => setIsInCall(true)}>
          <Text style={styles.buttonText}>开始语音通话</Text>
        </TouchableOpacity>
      )}
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#fff',
  },
  startButton: {
    paddingHorizontal: 30,
    paddingVertical: 15,
    backgroundColor: '#2196F3',
    borderRadius: 8,
  },
  buttonText: {
    color: '#fff',
    fontSize: 18,
    fontWeight: 'bold',
  },
});

export default App;

关键配置说明 #

• audioOnly={true}：核心参数，告诉Agora SDK仅初始化音频模块，禁用视频采集、编码和传输，大幅降低资源占用。
• showVideo={false}：隐藏UIKit中的视频渲染窗口和视频控制按钮，让界面适配纯语音场景。
• 权限配置：
  • Android：在AndroidManifest.xml中添加录音权限：

    <uses-permission android:name="android.permission.RECORD_AUDIO" />
    

  • iOS：在Info.plist中添加麦克风权限说明：

    <key>NSMicrophoneUsageDescription</key>
    <string>需要访问麦克风进行语音通话</string>
    

内容的提问来源于stack exchange，提问作者cwecae