音视频通话 SDK
有奖捉虫：办公协同&微信生态&物联网文档专题 HOT
文档中心 > 音视频通话 SDK > 快速接入 > Flutter

Flutter

最近更新时间：2024-04-23 16:27:52

我的收藏

本页目录：

本文将介绍如何用较短的时间完成 TUICallKit 组件的接入，跟随本文档，您可以在10分钟内完接入工作，并最终得到一个包含完备 UI 界面的视频通话功能。

环境准备

Flutter 3.0及更高
Android 端开发:
Android Studio 3.5 及以上版本
Android 4.1 及以上版本的 Android 设备
iOS & macOS 端 端开发：
Xcode 13.0 及以上版本
macOS 12.4 及以上的系统版本
项目设置有效的开发者签名

步骤一：开通服务

在使用腾讯云提供的音视频服务前，您需要前往控制台，为应用开通音视频服务。具体步骤请参见 开通服务。

步骤二：导入 TUICallKit 组件

在命令行执行以下命令安装组件 tencent_calls_uikit 插件。
flutter pub add tencent_calls_uikit

步骤三：工程配置

1. 将 TUICallKit 的 navigatorObserver 添加到 App 组件中，以 MateriaApp 为例，代码如下：
import 'package:tencent_calls_uikit/tuicall_kit.dart';

MaterialApp（
     navigatorObservers：[TUICallKit.navigatorObserver]，
     ...
）
2. 如果您需要编译运行在 Android 平台，由于我们在 SDK 内部使用了Java 的反射特性，需要将 SDK 中的部分类加入不混淆名单。
首先，需要在 app 目录下的 build.gradle 文件中配置并开启混淆规则：
  android {  
    ...  
    buildTypes {  
        release {  
            minifyEnabled true  
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'  
        }  
    }  
}
再在 proguard-rules.pro 文件中添加如下代码：
-keep class com.tencent.** { *; }
3. 如果您的工程需要在 iOS 模拟器上调试，您需要在工程的/ios/Podfile文件中添加以下代码：
post_install do |installer|
  installer.pods_project.targets.each do |target|
    flutter_additional_ios_build_settings(target)
    target.build_configurations.each do |config|
      config.build_settings['VALID_ARCHS'] = 'arm64 arm64e x86_64'
      config.build_settings['VALID_ARCHS[sdk=iphonesimulator*]'] = 'x86_64'
    end
  end
end
4. 如果您需要使用 iOS 的音视频功能，您需要授权麦克风和摄像头的使用权限。
授权操作方法：在您的 iOS 工程的 Info.plist 中添加以下两项，分别对应麦克风和摄像头在系统弹出授权对话框时的提示信息。
<key>NSCameraUsageDescription</key>
<string>CallingApp需要访问您的相机权限，开启后录制的视频才会有画面</string>
<key>NSMicrophoneUsageDescription</key>
<string>CallingApp需要访问您的麦克风权限，开启后录制的视频才会有声音</string>

步骤四：登录

在您的项目中添加如下代码，这个步骤异常关键，因为只有在登录成功后才能正常使用 TUICallKit 的各项功能，故请您耐心检查相关参数是否配置正确：
TUIResult result = TUICallKit.instance.login(SDKAppID,       // 请替换为第一步得到的SDKAppID
                                             'userId',       // 请替换为您的User ID
                                             'userSig');     // 您可以在控制台计算一个UserSig并填到该位置
在调用完成后，您可以通过 TUIResult`类型的返回值查看是否登录成功。
参数说明：
这里详细介绍一下 login 函数中所需要用到的几个关键参数：
SDKAppID：在步骤一中的最后一步中您已经获取到，这里不再赘述。
UserID：当前用户的 ID，字符串类型，只允许包含英文字母（a-z 和 A-Z）、数字（0-9）、连词符（-）和下划线（_）。
UserSig：使用 步骤一 的第3步中获取的 SecretKey 对 SDKAppID、UserID 等信息进行加密，就可以得到 UserSig，它是一个鉴权用的票据，用于腾讯云识别当前用户是否能够使用 TRTC 的服务。您可以通过控制台中的 辅助工具 生成一个临时可用的 UserSig。
更多信息请参见 如何计算及使用 UserSig。
注意：
尊敬的开发者，您好，当前步骤是目前开发者反馈问题最多的步骤，常见问题如下:
sdkAppId 设置错误，国内站的 SDKAppID 一般是以140开头的10位整数。
userSig 被错配成了加密密钥（Secretkey），userSig 是用 SecretKey 把 sdkAppId、userId 以及过期时间等信息加密得来的，而不是直接把 Secretkey 配置成 userSig。
userId 被设置成“1”、“123”、“111”等简单字符串，由于 TRTC 不支持同一个 UserID 多端登录，所以在多人协作开发时，形如 “1”、“123”、“111” 这样的 userId 很容易被您的同事占用，导致登录失败，因此我们建议您在调试的时候设置一些辨识度高的 userId。

步骤五：拨打您的第一通电话

主叫方与被叫方登录成功后，主叫方通过调用 TUICallKit 的 call 方法并指定通话类型和被叫方的 userId，就可以发起语音或者视频通话，被叫方此时就可接受到来电邀请。
// 假设给mike拨打视频电话
TUICallKit.instance.call('mike', TUICallMediaType.video);






主叫方
被叫方

更多特性

设置昵称、头像
界面定制
离线推送
群组通话
悬浮窗
美颜特效
自定义铃声
监听通话状态
云端录制

常见问题

如果您的接入和使用中遇到问题，请参见 常见问题。

交流与反馈

如果您在使用过程中，有什么建议或者意见，可以在这里反馈：TUICallKit 产品反馈问卷，感谢您的反馈。
如果您是开发者，也欢迎您加入我们的 TUICallKit 技术交流平台 zhiliao，进行技术交流和产品沟通。
中国站