TUICallKit
TUICallKit is a UIKit component for audio and video calls.
 [](https://www.npmjs.com/package/@trtc/calls-uikit-vue2) [](https://trtc.io/document/51015) [](https://github.com/tencentyun/TUICallKit)
English | 简体中文
## Introduction
TUICallKit is a UIKit component for audio and video calls developed by Tencent Cloud. By integrating this component, you can easily add video calling functionality to your app with just a few lines of code.
- [Online Demo](https://trtc.io/demo/homepage/#/detail?scene=callkit)
- [Changelog](https://trtc.io/document/51019)
- [API Documents](https://trtc.io/document/51015)
- We offer TUICallKit for Web, Android, iOS, MiniProgram, Flutter, explore more in [trtc.io](https://trtc.io/products/call).
## Environment Supports
TUICallKit supports major modern browsers. For details, please refer to [Browsers Supported](https://web.sdk.qcloud.com/trtc/webrtc/v5/doc/en/tutorial-05-info-browser.html).
```text
Please be sure to use HTTPS protocol or localhost to deploy your Web App, otherwise a navigator.mediaDevices not found error will occur!
```
| [
](http://godban.github.io/browsers-support-badges/)
Chrome | [
](http://godban.github.io/browsers-support-badges/)
Edge | [
](http://godban.github.io/browsers-support-badges/)
Firefox | [
](http://godban.github.io/browsers-support-badges/)
Safari | [
](http://godban.github.io/browsers-support-badges/)
iOS Safari | [
](http://godban.github.io/browsers-support-badges/)
Opera |
| --------- | --------- | --------- | --------- | --------- | --------- |
| 56+ | 80+ | 56+ | 11+ | 11+ | 46+ |
## Recommend Using the More Efficient AI Integration Assistant
We offer you a brand new method for AI integration. If you don't need the complete demo project and just want to get started with integration quickly, we recommend using the more efficient AI Integration Assistant. Simply describe your requirements, and it will automatically generate the integration code, significantly boosting development efficiency.
Click here to experience [AI integration]((https://cloud.tencent.com/document/product/647/125504)) now!
## Install
npm:
```
npm install @trtc/calls-uikit-vue2 --save
```
yarn:
```
yarn add @trtc/calls-uikit-vue2
```
## Usage
Refer to the following two tutorials for a quick run-through of the demo and how to use the TUICallKit to implement basic audio and video calling functionality.
- [Demo Quick Run](https://trtc.io/document/50993)
- [TUICallKit Github Demo](https://github.com/tencentyun/TUICallKit/tree/main/Web/basic-vue2.7)
Explore TUICallKit API documents：[TUICallKit API](https://trtc.io/document/51015)
## API Overview
- Initialize TUICallKit [init](https://trtc.io/document/51015#init)
- Start single or group calls [calls](https://trtc.io/document/51015#calls)
- Set language [setLanguage](https://trtc.io/document/51015#setLanguage)
- Set user nickname and avatar [setSelfInfo](https://trtc.io/document/51015#setSelfInfo)
- Customize the user's incoming call ringtone [setCallingBell](https://trtc.io/document/51015#setCallingBell)
- Enable/Disable floating window [enableFloatWindow](https://trtc.io/document/51015#enableFloatWindow)
- Enable/Disable incoming call ringtone [enableMuteMode](https://trtc.io/document/51015#enableMuteMode)
- Destroyed the TUICallKit instance [destroyed](https://trtc.io/document/51015#destroyed)
## Directory
```text
├── debug
├── src // component source file
├── types // ts declaration file
├── README-zh_CN.md
├── README.md
├── package.json
├── tuicall-uikit-vue2.es.js // sdk file base on ES modules
└── tuicall-uikit-vue2.umd.js // sdk file base on umd modules
```