实时音视频 Flutter-视频通话（含 UI）-文档中心-腾讯云

本文将引导您快速地完成 TUICallKit 组件的接入工作。跟随本文档，您可以在10分钟内完成接入，并最终获得一个具备完整用户界面以及音视频通话功能的应用程序。
视频通话
群组通话
﻿
﻿
﻿
﻿
﻿
﻿
环境准备
Flutter 3.0 及更高版本。
步骤一：开通服务
在使用腾讯云提供的音视频服务前，您需要前往控制台，为应用开通音视频服务，获取 SDKAppID、SDKSecretKey，它们将在 步骤五 中使用，具体步骤请参见 开通服务。﻿
步骤二：导入 TUICallKit 组件
在工程的根目录下，通过命令行执行以下命令安装组件 tencent_calls_uikit 插件。
flutter pub add tencent_calls_uikit
步骤三：完成工程配置
Android
iOS
1. 如果您需要编译运行在 Android 平台，由于我们在 SDK 内部使用了Java 的反射特性，需要将 SDK 中的部分类加入不混淆名单。
首先，需要在工程的 android/app/build.gradle 文件中配置并开启混淆规则：
  android {
    ......
    buildTypes {  
        release {  
            ......
            minifyEnabled true  
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'  
        } 
    }
}
在工程的 android/app 目录下创建 proguard-rules.pro 文件，并 proguard-rules.pro 文件中添加如下代码：
-keep class com.tencent.** { *; }
2. 在工程的 android/app/build.gradle 文件中配置开启 Multidex 支持。
  android {  
    ......
    defaultConfig {
      ......
      multiDexEnabled true
    } 
}
1. 可选如果您需要在 iOS 模拟器上调试，并且您使用的 Mac 电脑使用的是 Intel 芯片，您需要在工程的ios/Podfile文件中添加以下代码：
target 'xxxx' do
  ......
end
......
﻿
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
2. 由于 TUICallKit 会使用 iOS 的音视频功能，您需要授权麦克风和摄像头的使用权限。
授权操作方法：在您的 iOS 工程的 Info.plist 的第一级<dict>目录下添加以下两项，分别对应麦克风和摄像头在系统弹出授权对话框时的提示信息。
<key>NSCameraUsageDescription</key>
<string>CallingApp需要访问您的相机权限，开启后录制的视频才会有画面</string>
<key>NSMicrophoneUsageDescription</key>
<string>CallingApp需要访问您的麦克风权限，开启后录制的视频才会有声音</string>
步骤四：设置 navigatorObservers
1. 在 Flutter 应用框架的 navigatorObservers 中添加 TUICallKit.navigatorObserver，以 MateriaApp 框架为例，代码如下：
import 'package:tencent_calls_uikit/tencent_calls_uikit.dart';
﻿
 ......
﻿
class XXX extends StatelessWidget {
  const XXX({super.key});

 @override
  Widget build(BuildContext context) {
    return MaterialApp(
      navigatorObservers: [TUICallKit.navigatorObserver],
      ......
    );
  }
}
步骤五：登录 TUICallKit 组件
使用 login 接口完成登录，具体使用可参考如下代码：
import 'package:tencent_calls_uikit/tencent_calls_uikit.dart';
import 'package:tencent_calls_uikit/debug/generate_test_user_sig.dart';
......
﻿
final String userID    = 'xxxxx';  // 请替换为您的UserId
final int    sdkAppID  = 0;        // 请替换为第一步在控制台得到的SDKAppID
final String secretKey = 'xxxx';   // 请替换为第一步在控制台得到的SecretKey
﻿
void login() async {
    String userSig  = GenerateTestUserSig.genTestSig(userID, sdkAppID, secretKey);
    TUIResult result = await TUICallKit.instance.login(sdkAppID, userID, userSig);
    if (result.code.isEmpty) {
      print('Login success');
    } else {
      print('Login failed: ${result.code} ${result.message}');
    }
}
参数
类型
说明
userID
String
客户根据自己的业务自定义用户 ID，只允许包含大小写英文字母(a-z A-Z)、数字(0-9)及下划线和连词符。
sdkAppID
int
在 实时音视频 TRTC 控制台 创建的音视频应用的唯一标识。
secretKey
String
在 实时音视频 TRTC 控制台 创建的音视频应用的 SDKSecretKey。
userSig
String
一种安全保护签名，用于对用户进行登录鉴权认证，确认用户是否真实，阻止恶意攻击者盗用您的云服务使用权。
注意：
开发环境：如果您正在本地开发调试阶段，可以采用本地 GenerateTestUserSig.genTestSig函数生成 userSig。该方法中 SDKSecretKey 很容易被反编译逆向破解，一旦您的密钥泄露，攻击者就可以盗用您的腾讯云流量。
生产环境：如果您的项目要发布上线，请采用 服务端生成 UserSig 的方式。
步骤六：拨打您的第一通电话
主叫方与被叫方登录成功后，主叫方通过调用 TUICallKit 的 call 方法并指定通话类型和被叫方的 userId，就可以发起语音或者视频通话，被叫方此时就可接受到来电邀请。
import 'package:tencent_calls_uikit/tencent_calls_uikit.dart';
......
﻿
void call() {
    TUICallKit.instance.call('vince', TUICallMediaType.audio);
}
﻿
﻿
﻿
﻿
﻿
﻿
主叫方
被叫方
更多特性
﻿界面定制﻿
﻿离线推送﻿
﻿群组通话﻿
﻿悬浮窗﻿
﻿美颜特效﻿
﻿自定义铃声﻿
﻿监听通话状态﻿
﻿云端录制﻿
常见问题
如果您的接入和使用中遇到问题，请参见 常见问题。
交流与反馈
如果您在使用过程中，有什么建议或者意见，可以在这里反馈：TUICallKit 产品反馈问卷，感谢您的反馈。
如果您是开发者，也欢迎您加入我们的 TUICallKit 技术交流平台 zhiliao，进行技术交流和产品沟通。

参数	类型	说明
userID	String	客户根据自己的业务自定义用户 ID，只允许包含大小写英文字母(a-z A-Z)、数字(0-9)及下划线和连词符。
sdkAppID	int	在实时音视频 TRTC 控制台创建的音视频应用的唯一标识。
secretKey	String	在实时音视频 TRTC 控制台创建的音视频应用的 SDKSecretKey。
userSig	String	一种安全保护签名，用于对用户进行登录鉴权认证，确认用户是否真实，阻止恶意攻击者盗用您的云服务使用权。

Flutter

本页目录：

环境准备

步骤一：开通服务

步骤二：导入 TUICallKit 组件

步骤三：完成工程配置

步骤四：设置 navigatorObservers

步骤五：登录 TUICallKit 组件

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

更多特性

常见问题

交流与反馈