Flutter CallKit: what is it, and how to use it?
Tags: webdev, app, zegocloud, github
Published: 2022-11-15 10:45:18

[Flutter UIKit SDK](https://www.zegocloud.com/uikits) is a brand-new pre-built UIKits and UI Components by ZEGOCLOUD. Through it, We can complete the development of video calls, live-streaming, video conferences, and other scenarios within 10 minutes.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/n5202n71j58izp5wns06.png)

As shown in the figure, Flutter UIKit SDK is responsible for processing audio and video calls and the logic related to text chat, including:
* UI and interaction of the calling module
* Call status management
* Audio and video data transmission
You only need to implement business-related logic. For example:
* User login registration
* Friends List Management
* Call billing recharge

**Preparation**
* A ZEGOCLOUD developer account–Sign up (https://console.zegocloud.com/account/signup)
* Flutter (https://docs.flutter.dev/get-started/install) 1.12 or later.
* Basic understanding of Flutter development

## 
Implement video call
**Create Project**
Run the following code to create a new project.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/br12d60sbhfzqpp3ci38.png)

**Add ZegoUIKitPrebuiltCall as a dependency**
Run the following code in your project root directory:


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ea2wsu5jpfvt01llyppp.png)

**Add ZegoUIKitPrebuiltCall as dependency**
Run the following code in your project root directory:
flutter pub add zego_uikit_prebuilt_call

**Import the SDK**
Now in your Dart code, import the prebuilt CallKit Flutter SDK.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7dbx43cch2xt0k1me7lo.png)

Start Video Call
Use ZegoUIKitPrebuiltCall to build a Call page.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5vychqbxn5ool3i8odrg.png)

Now, you can make a call by navigating to this CallPage.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/g33igfgl44ne5q7m29o6.png)

**Add a call button**
Add a Call button, and navigate to the CallPage.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/irikyje81u7eambjrvzk.png)

**Configure your project**
Android:
If your project is created with Flutter 2.x.x, you will need to open the your_project/android/app/build.gradle file, and modify the compileSdkVersion to 33.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/eldnqd1tgj7mqnl81haa.png)

**Add app permissions.**
Open the file your_project/app/src/main/AndroidManifest.xml, and add the following code:

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/58qd55ab9qonp092x2ai.png)

 **Prevent code obfuscation.**
To prevent obfuscation of the SDK public class names, do the following:
a. In your project’s your_project > android > app folder, create a proguard-rules.pro file with the following content as shown below:


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/igkl3d338ezjwgdae6rc.png)

iOS:
To add permissions, open your_project/ios/Runner/Info.plist, and add the following code to the dict part:


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/moulxc2zeclru8goz261.png)

Conclusion
It’s way easier to make a video call now than it was five or ten years ago. Additionally, their recent popularity also makes a point. In today’s market, a simple and secure video call app will definitely find its audience.

You can download the [sample demo source code](https://github.com/DavidReloo/call_kit_demo_flutter) of this article to learn how to . If you have deeper requirements, such as streaming mix, noise reduction, censorship, etc. you can use our [Core SDK](https://www.zegocloud.com/uikits).

If you have any questions, you can always consult us 24h technical support.