Flutter音视频通话插件cometchatcalls_plugin的使用

Flutter音视频通话插件cometchatcalls_plugin的使用

CometChat

CometChat Calls SDK for Flutter

CometChat SDK 是一个强大的工具包,开发人员可以利用它快速地将可靠的、功能齐全的聊天功能集成到现有的或新的应用程序中。它去除了从头开始构建聊天基础设施的复杂性,从而加速了开发过程并减少了上市时间。

前提条件

  • Flutter >=2.5.0
  • SDK >=2.17.0 <4.0.0
  • Android Studio 2022.2
  • Android 7.0, API 24 及以上
  • Xcode 14.3
  • iOS 12.0

入门指南

要设置 Flutter SDK 并利用 CometChat 进行聊天和通话功能,您需要遵循以下步骤:

  1. CometChat Dashboard 注册以创建一个帐户。
  2. 注册后,登录您的 CometChat 帐户并创建一个新的应用。一旦创建完成,CometChat 将为您生成一个身份验证密钥和应用 ID。请妥善保管这些凭据,因为您稍后会需要它们。
  3. 查看 CometChat 关键概念 以了解 CometChat 的基本组件。
  4. 参考我们的文档中的 集成步骤 将 SDK 集成到您的 Flutter 应用程序中。

帮助和支持

如果您在运行项目或与我们的 SDK 集成时遇到问题,请查阅我们的 文档,或创建一个 支持票,或通过 CometChat Dashboard 寻求实时支持。

示例代码

import 'dart:math';
import 'package:cometchatcalls_plugin/cometchatcalls_plugin.dart';
import 'package:flutter/material.dart';

String appId = ""; // 您的应用 ID
String region = ""; // 您的应用区域

class CometChatCallsDemo extends StatefulWidget {
  const CometChatCallsDemo({Key? key}) : super(key: key);

  @override
  State<CometChatCallsDemo> createState() => _CometChatCallsDemoState();
}

class _CometChatCallsDemoState extends State<CometChatCallsDemo> implements CometChatCallsEventsListener {
  String? sessionId;
  String? generateTokenResult;
  Widget? videoContainer;

  @override
  void initState() {
    super.initState();
    initCometChatCallsSDK();
  }

  // 1. 初始化 CometChatCalls
  initCometChatCallsSDK() {
    CallAppSettings callAppSettings = (CallAppSettingBuilder()
      ..appId = appId
      ..region = region
      // ..host = "" // 添加自定义 URL
    ).build();
    CometChatCalls.init(callAppSettings, onSuccess: (String successMessage) {
      debugPrint("初始化成功: $successMessage");
      generateToken(); // 2. 初始化成功后调用生成令牌
    }, onError: (CometChatCallsException e) {
      debugPrint("初始化失败: ${e.message}");
    });
  }

  // 2. 生成令牌
  Future<void> generateToken() async {
    String? userAuthToken = ""; // 获取用户认证令牌,调用 CometChat.getUserAuthToken() 方法
    CometChatCalls.generateToken(generateNewSessionId(), userAuthToken, onSuccess: (GenerateToken generateToken) {
      debugPrint("生成令牌成功: ${generateToken.token}");
      startCall(generateToken.token!); // 3. 开始通话
    }, onError: (CometChatCallsException e) {
      debugPrint("生成令牌错误: $e");
    });
  }

  // 3. 开始通话
  startCall(String generatedToken) async {
    // 可选设置
    MainVideoContainerSetting videoSettings = MainVideoContainerSetting();
    videoSettings.setMainVideoAspectRatio(CometChatCallsConstants.aspectRatioContain);
    videoSettings.setNameLabelParams(CometChatCallsConstants.positionTopLeft, true, "#000");
    videoSettings.setZoomButtonParams(CometChatCallsConstants.positionTopRight, true);
    videoSettings.setUserListButtonParams(CometChatCallsConstants.positionTopLeft, true);
    videoSettings.setFullScreenButtonParams(CometChatCallsConstants.positionTopRight, true);

    // 通话设置构建器
    CallSettings callSettings = (CallSettingsBuilder()
      ..enableDefaultLayout = true
      ..setMainVideoContainerSetting = videoSettings
      ..listener = this
    ).build();

    // 开始通话
    CometChatCalls.startSession(generatedToken, callSettings, onSuccess: (Widget? callingWidget) {
      setState(() {
        videoContainer = callingWidget;
      });
    }, onError: (CometChatCallsException e) {
      debugPrint("错误: 开始会话失败: $e");
    });
  }

  // 生成新会话 ID
  String generateNewSessionId() {
    return "${generateRandomString(4)}-${generateRandomString(4)}-${generateRandomString(4)}";
  }

  // 随机字符串生成器
  String generateRandomString(int len) {
    var r = Random();
    const chars = 'AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTtUuVvWwXxYyZz';
    return List.generate(len, (index) => chars[r.nextInt(chars.length)]).join();
  }

  // 通话回调
  @override
  void onAudioModeChanged(List<AudioMode> devices) {
    debugPrint("音频模式改变: ${devices.length}");
  }

  @override
  void onCallEndButtonPressed() {
    debugPrint("结束通话按钮被按下");
  }

  @override
  void onCallEnded() {
    debugPrint("通话结束");
  }

  @override
  void onCallSwitchedToVideo(CallSwitchRequestInfo info) {
    debugPrint("通话切换到视频: ${info.requestAcceptedBy}");
  }

  @override
  void onError(CometChatCallsException ce) {
    debugPrint("错误: ${ce.message}");
  }

  @override
  void onRecordingToggled(RTCRecordingInfo info) {
    debugPrint("录制开关状态改变: ${info.user?.name}");
  }

  @override
  void onUserJoined(RTCUser user) {
    debugPrint("用户加入: ${user.name}");
  }

  @override
  void onUserLeft(RTCUser user) {
    debugPrint("用户离开: ${user.name}");
  }

  @override
  void onUserListChanged(List<RTCUser> users) {
    debugPrint("用户列表改变: ${users.length}");
  }

  @override
  void onUserMuted(RTCMutedUser muteObj) {
    debugPrint("用户被静音: ${muteObj.mutedBy}");
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: const Color(0xFF333333),
      body: SafeArea(
        child: videoContainer ?? const Center(
          child: CircularProgressIndicator(
            color: Colors.white,
          ),
        ),
      ),
    );
  }
}

更多关于Flutter音视频通话插件cometchatcalls_plugin的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter音视频通话插件cometchatcalls_plugin的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


cometchatcalls_plugin 是一个用于在 Flutter 应用中实现音视频通话功能的插件。它基于 CometChat 的 SDK,提供了丰富的功能,包括一对一通话、群组通话、屏幕共享等。

以下是如何在 Flutter 项目中使用 cometchatcalls_plugin 的基本步骤:

1. 添加依赖

首先,在 pubspec.yaml 文件中添加 cometchatcalls_plugin 的依赖:

dependencies:
  flutter:
    sdk: flutter
  cometchatcalls_plugin: ^1.0.0  # 请确保使用最新版本

然后运行 flutter pub get 来获取依赖。

2. 初始化 CometChat

在使用插件之前,需要先初始化 CometChat。你可以在 main.dart 或任何合适的地方进行初始化。

import 'package:cometchatcalls_plugin/cometchatcalls_plugin.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  
  // 初始化 CometChat
  await CometChat.init(
    appId: "YOUR_APP_ID",
    region: "YOUR_REGION",
    authKey: "YOUR_AUTH_KEY",
  );
  
  runApp(MyApp());
}

3. 登录用户

在初始化之后,用户需要登录才能进行通话。你可以使用 CometChat.login 方法进行登录。

await CometChat.login(
  uid: "USER_UID",
  authToken: "USER_AUTH_TOKEN",
);

4. 发起通话

你可以使用 CometChat.startCall 方法来发起通话。

await CometChat.startCall(
  sessionId: "SESSION_ID",
  callType: CallType.VIDEO,  // 或 CallType.AUDIO
  receiverId: "RECEIVER_UID",
  receiverType: ReceiverType.USER,  // 或 ReceiverType.GROUP
);

5. 监听通话事件

你可以监听通话事件来处理通话状态、错误等。

CometChat.onCallEvent.listen((event) {
  print("Call Event: ${event.toString()}");
});

6. 处理通话UI

cometchatcalls_plugin 提供了内置的 UI 组件,你可以直接使用它们来显示通话界面。

class CallScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: CometChatCallView(
        sessionId: "SESSION_ID",
        callType: CallType.VIDEO,
      ),
    );
  }
}

7. 结束通话

你可以使用 CometChat.endCall 方法来结束通话。

await CometChat.endCall(sessionId: "SESSION_ID");

8. 处理权限

在 Android 和 iOS 上,音视频通话需要特定的权限。确保在 AndroidManifest.xmlInfo.plist 中添加必要的权限。

AndroidManifest.xml

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

Info.plist

<key>NSCameraUsageDescription</key>
<string>We need access to your camera for video calls</string>
<key>NSMicrophoneUsageDescription</key>
<string>We need access to your microphone for audio calls</string>

9. 处理错误和异常

在使用插件时,可能会遇到各种错误和异常。确保在代码中正确处理这些情况。

try {
  await CometChat.startCall(
    sessionId: "SESSION_ID",
    callType: CallType.VIDEO,
    receiverId: "RECEIVER_UID",
    receiverType: ReceiverType.USER,
  );
} catch (e) {
  print("Error starting call: $e");
}
回到顶部