Call
  • 개요
  • Web
    • Demo 실행
    • 통합
      • Web&H5 (React)
      • Web&H5(Vue3)
    • AI 노이즈 캔슬링
    • 가상 배경
    • UI 맞춤화
    • 클라우드 녹화
    • 더 많은 기능
      • 닉네임 및 아바타 설정
      • 해상도 및 채우기 모드 설정
      • 그룹 통화
      • 플로팅 윈도우
      • 사용자 정의 벨소리
      • 통화 상태 모니터링
    • 인터페이스 문서
      • 인터페이스 개요
      • TUICallKit
      • TUICallEngine
      • TUICallEvent
    • 서버 API
      • 통화 상태 콜백
        • 통화 상태 콜백
        • 통화 이벤트 콜백
        • 콜백 구성
          • 콜백 구성 인터페이스 목록
          • 콜백 구성 생성
          • 콜백 구성 조회
          • 콜백 구성 업데이트
          • 콜백 구성 삭제
      • REST 인터페이스
        • REST 인터페이스 소개
        • callId를 통한 기록 획득
        • 조건에 따른 기록 획득
    • 배포 설명
  • Android
    • Demo 실행
    • 통합
    • AI 노이즈 캔슬링
    • 가상 배경
    • UI 맞춤화
    • 오프라인 통화 푸시
    • 클라우드 녹화
    • 더 많은 기능
      • 닉네임 및 아바타 설정
      • 그룹 통화
      • 플로팅 윈도우
      • 사용자 정의 벨소리
      • 통화 상태 모니터링
    • 인터페이스 문서
      • 인터페이스 개요
      • TUICallKit
      • TUICallEngine
      • TUICallObserver
      • 유형 정의
    • 서버 API
      • 통화 상태 콜백
        • 통화 상태 콜백
        • 통화 이벤트 콜백
        • 콜백 구성
          • 콜백 구성 인터페이스 목록
          • 콜백 구성 생성
          • 콜백 구성 조회
          • 콜백 구성 업데이트
          • 콜백 구성 삭제
      • REST 인터페이스
        • REST 인터페이스 소개
        • callId를 통한 기록 획득
        • 조건에 따른 기록 획득
    • 배포 설명
  • iOS
    • Demo 실행
    • 통합
    • AI 노이즈 캔슬링
    • 가상 배경
    • UI 맞춤화
    • 오프라인 통화 푸시
      • VoIP
      • APN
    • 클라우드 녹화
    • 더 많은 기능
      • 닉네임 및 아바타 설정
      • 그룹 통화
      • 플로팅 윈도우
      • 사용자 정의 벨소리
      • 통화 상태 모니터링
    • 인터페이스 문서
      • 인터페이스 개요
      • TUICallKit
      • TUICallEngine
      • TUICallObserver
      • 유형 정의
    • 서버 API
      • 통화 상태 콜백
        • 통화 상태 콜백
        • 통화 이벤트 콜백
        • 콜백 구성
          • 콜백 구성 인터페이스 목록
          • 콜백 구성 생성
          • 콜백 구성 조회
          • 콜백 구성 업데이트
          • 콜백 구성 삭제
      • REST 인터페이스
        • REST 인터페이스 소개
        • callId를 통한 기록 획득
        • 조건에 따른 기록 획득
    • 배포 설명
  • Flutter
    • Demo 실행
    • 통합
    • AI 노이즈 캔슬링
    • 가상 배경
    • UI 맞춤화
    • 오프라인 통화 푸시
      • 알림
      • VoIP(옵션)
    • 클라우드 녹화
    • 더 많은 기능
      • 닉네임 및 아바타 설정
      • 그룹 통화
      • 플로팅 윈도우
      • 뷰티 특수효과
      • 사용자 정의 벨소리
      • 통화 상태 모니터링
    • 인터페이스 문서
      • 인터페이스 개요
      • TUICallKit
      • TUICallEngine
      • TUICallObserver
      • 유형 정의
    • 서버 API
      • 통화 상태 콜백
        • 통화 상태 콜백
        • 통화 이벤트 콜백
        • 콜백 구성
          • 콜백 구성 인터페이스 목록
          • 콜백 구성 생성
          • 콜백 구성 조회
          • 콜백 구성 업데이트
          • 콜백 구성 삭제
      • REST 인터페이스
        • REST 인터페이스 소개
        • callId를 통한 기록 획득
        • 조건에 따른 기록 획득
    • 업그레이드
    • 배포 설명
  • 개요
    • 개요
  • 서비스 활성화
  • 가격
    • 무료시간
    • 오디오/비디오 통화 Call 월정액 패키지
    • Billing Explanation for Subscription Package Duration
    • Pay-as-you-go
      • Billing of Audio and Video Duration
      • Billing of On-Cloud Recording and Recording Delivery
      • Billing of MixTranscoding and Relay to CDN
  • ErrorCode
  • 자주 받는 질문들
    • All Platform
      • FAQs
      • UserSig
    • Web
    • Flutter
    • iOS
    • Android
Call
이 페이지는 현재 영어로만 제공되며 한국어 버전은 곧 제공될 예정입니다. 기다려 주셔서 감사드립니다.

UI 맞춤화

This article will introduce how to customize the user interface of TUICallKit. We provide two solutions for you to choose: interface fine-tuning solution and self-implementation UI solution.
Note: The page customization solution needs to use the tencent_calls_uikit plugin version 1.8.0 or later.

Scheme 1. Slight UI Adjustment

You can download the latest version of the tencent_calls_uikit plugin locally, and then use the local dependency method to access the plugin in your project. The local dependency method is as follows:
Under the dependencies node in the project pubspec.yaml file, add the tencent_calls_uikit plugin dependency, as shown below:
dependencies:
tencent_calls_uikit:
path: your file path

replace icon

You can directly replace the icons under the assets\images folder to ensure that the color tone of the icons in the entire app is consistent. Please keep the name of the icon file unchanged when replacing.




replace ringtone

You can replace the three audio files in the assets\audios folder to achieve the purpose of replacing the ringtone:
Name
Purpose
phone_dialing.mp3
The sound of making a call
phone_hangup.mp3
The sound of being hung up
phone_ringing.mp3
The ringtone for incoming calls

Replacing text

You can modify the string content in the video call interface by modifying the strings in the strings.g.dart file in the lib\src\i18n directory.

Scheme 2. Custom UI Implementation

The entire call feature of TUICallKit is implemented based on the UI-less component TUICallEngine. You can delete the tuicallkit folder and implement your own UIs based entirely on TUICallEngine.

TUICallEngine

TUICallEngine is the underlying API of the entire TUICallKit component. It provides key APIs such as APIs for making, answering, declining, and hanging up one-to-one audio/video and group calls and device operations.

TUICallObserver

TUICallObserver is the callback even class of TUICallEngine. You can use it to listen on the desired callback events.