Call
  • Web
    • Overview
      • Product Introduction
      • Activate the Service
      • 価格
        • 無料時間
        • オーディオ・ビデオ通話 Call の月額パッケージ
        • サブスクリプションパッケージ期間の課金説明
    • Get Started
      • Run Sample Code
      • Integration (React)
      • Integration (Vue3)
      • Secure authentication with userSig
    • Basic Features
      • UI Customization
      • Configuring Nickname and Avatar
      • GroupCall
      • フローティングウィンドウ
      • 着信音のカスタマイズ
      • 解像度とフィルモードの設定
      • 通話状態のモニタリング
    • Advanced Features
      • 仮想背景
      • AI ノイズ低減
      • クラウドレコーディング
    • インターフェースドキュメンテーション
      • UIKit APIs
        • API Overview
        • TUICallKit
      • Engine APIs
        • TUICallEngine
        • TUICallEvent
    • サーバー API
      • 通話状態のコールバック
        • 通話状態のコールバック
        • 通話イベントコールバック
        • コールバック設定
          • コールバック設定インターフェースリスト
          • コールバック設定の作成
          • コールバック設定の照会
          • コールバック設定の更新
          • コールバック設定の削除
      • REST インターフェース
        • REST インターフェースの紹介
        • callId によりレコードを取得
        • 条件によりレコードを取得
    • FAQs
      • All Platfroms
      • Web
      • ErrorCode
      • リリース説明
  • Android
    • Overview
      • Product Introduction
      • Activate the Service
      • Pricing
        • Free Minutes
        • Call Monthly Packages
        • Billing Explanation for Subscription Package Duration
    • Get Started
      • Demo のクイックスタート
      • インテグレーション
      • Secure authentication with userSig
    • Basic Features
      • UI のカスタマイズ
      • オフライン通話プッシュ
      • Configuring Nicknames and Avatars
      • グループ通話
      • フローティングウィンドウ
      • 着信音のカスタマイズ
      • 通話状態のモニタリング
    • その他の機能
      • 仮想背景
      • AI ノイズ低減
      • クラウドレコーディング
    • インターフェースドキュメンテーション
      • UIKit APIs
        • インターフェースの概要
        • TUICallKit
        • TUICallObserver
        • タイプ定義
      • Engine APIs
        • TUICallEngine
    • サーバー API
      • 通話状態のコールバック
        • 通話状態のコールバック
        • 通話イベントコールバック
        • コールバック設定
          • コールバック設定インターフェースリスト
          • コールバック設定の作成
          • コールバック設定の照会
          • コールバック設定の更新
          • コールバック設定の削除
      • REST インターフェース
        • REST インターフェースの紹介
        • callId によりレコードを取得
        • 条件によりレコードを取得
    • FAQs
      • All Platforms
      • Android
      • ErrorCode
      • リリース説明
  • iOS
    • Overview
      • Product Introduction
      • Activate the Service
      • Pricing
        • Free Minutes
        • Call Monthly Packages
        • Billing Explanation for Subscription Package Duration
    • Get Started
      • Demo のクイックスタート
      • インテグレーション
      • Secure authentication with userSig
    • Basic Features
      • UI のカスタマイズ
      • オフライン通話プッシュ
        • VoIP
        • APN
      • ニックネームとプロファイルフォトの設定
      • グループ通話
      • フローティングウィンドウ
      • 着信音のカスタマイズ
      • 通話状態のモニタリング
    • その他の機能
      • 仮想背景
      • AI ノイズ低減
      • クラウドレコーディング
    • インターフェースドキュメンテーション
      • UIKit APIs
        • インターフェースの概要
        • TUICallKit
        • TUICallObserver
        • タイプ定義
      • Engine APIs
        • TUICallEngine
    • サーバー API
      • 通話状態のコールバック
        • 通話状態のコールバック
        • 通話イベントコールバック
        • コールバック設定
          • コールバック設定インターフェースリスト
          • コールバック設定の作成
          • コールバック設定の照会
          • コールバック設定の更新
          • コールバック設定の削除
      • REST インターフェース
        • REST インターフェースの紹介
        • callId によりレコードを取得
        • 条件によりレコードを取得
    • FQAs
      • All Platform
      • iOS
      • ErrorCode
      • リリース説明
  • Flutter
    • Overview
      • Overview
      • サービスをアクティブ化します
      • Pricing
        • Free Minutes
        • Call Monthly Packages
        • Billing Explanation for Subscription Package Duration
    • Get Started
      • Demo のクイックスタート
      • インテグレーション
      • Secure authentication with userSig
    • Basic Features
      • UI のカスタマイズ
      • オフライン通話プッシュ
        • 通知
        • VoIP(オプション)
      • ニックネームとプロファイルフォトの設定
      • グループ通話
      • フローティングウィンドウ
      • 着信音のカスタマイズ
      • 通話状態のモニタリング
    • その他の機能
      • 仮想背景
      • AI ノイズ低減
      • クラウドレコーディング
      • 美顔エフェクト
    • インターフェースドキュメンテーション
      • インターフェースの概要
      • TUICallKit
      • TUICallEngine
      • TUICallObserver
      • タイプ定義
    • サーバー API
      • 通話状態のコールバック
        • 通話状態のコールバック
        • 通話イベントコールバック
        • コールバック設定
          • コールバック設定インターフェースリスト
          • コールバック設定の作成
          • コールバック設定の照会
          • コールバック設定の更新
          • コールバック設定の削除
      • REST インターフェース
        • REST インターフェースの紹介
        • callId によりレコードを取得
        • 条件によりレコードを取得
    • FQAs
      • All Platform
      • Flutter
      • ErrorCode
      • アップグレード
      • リリース説明
Call
このページは現在英語版のみで提供されており、日本語版も近日中に提供される予定です。ご利用いただきありがとうございます。

仮想背景

TUICallKit has launched a new feature for virtual backgrounds, allowing users to set a blurry or image background during video calls. This hides the real calling environment, protects privacy, and makes the call more interesting. Next, this article will detail how to use this feature in the TUICallKit component.

Integration effect

The display effect of the TUICallKit component after integrating the virtual background feature is as follows:
Original Camera
Blurry Background Effect
Image Background Effect










Preparation Requirements

1. Before using the Virtual Background feature provided by Tencent Cloud, you need to visit the Console to activate Audio and Video Services for your application and purchase the Group Call package. For specific steps, please see Activate Service.
2. Download the Virtual Background Model file, unzip it, and copy the LiteavSegmentModel.zip file to the assets directory of your project.



3. In the tuicallkit-kt directory of the project, find the build.gradle file and replace the TRTC SDK version with the Professional Version.
api "com.tencent.liteav:LiteAVSDK_Professional:11.8.0.14176"
Note:
There is a corresponding relationship between the version of the TRTC SDK and the model file, please ensure the version number matches the model, see below: Model File Matching with SDK.

Enable Blurry Background

TUICallKit's UI design supports setting a blurry background. By calling the following interface, you can display a feature button for the blurry background on the UI. Clicking the button will directly enable the blurry background feature.
TUICallKit.createInstance(getApplicationContext()).enableVirtualBackground(true);

Setting Image Background (Optional)

Implementing the image background requires users to save the image locally. After saving, call the following interface for setting (currently, only images with a local path are supported, images of uri are not supported yet).
TUICallEngine.createInstance(context).setVirtualBackground("imagePath", null)

FAQs

Enabling blurry background has no response or is delayed?

Ensure you have purchased the audio and video call Group Call package, see Activate Service.
Ensure the model file is downloaded to local.
If a model file is not added to the local path, when enabling the blurry background feature, the SDK will then download the model file. Under normal network conditions, the download takes 1~3s; the poorer the network, the longer it will take.
Check if the model file and SDK are a match.

Matching model files with SDK?

TUICallKit is based on the IM SDK and TRTC SDK for audio and video call scenarios. Virtual background is a feature provided by TRTC SDK. There is a matching relationship between the virtual background model file and the TRTC SDK version. If they do not match, enabling the blurry background might be ineffective. The relationship between the model file and TRTC SDK is as below:
SDK Version
Virtual background model file Download address
com.tencent.liteav:LiteAVSDK_Professional:11.7.0.12001
com.tencent.liteav:LiteAVSDK_Professional:11.8.0.14176