Call Kit
  • iOS
  • Android
  • Web
  • Flutter : Dart
  • React Native
  • Overview
  • Quick start
    • Quick start
    • Quick start (with call invitation)
  • Customize the call
    • Overview
    • Set avatar for users
    • Add custom components to the call
    • Configure layouts
    • Hide the label on the user view
    • Implement an audio-only call
    • Customize the menu bar
    • Set a hangup confirmation dialog
    • Call invitation config
    • Calculate call duration
  • Enhance the call
    • Screen sharing
    • Minimize video call window
    • Advanced beauty effects
  • Migration guide
  • Troubleshooting call invitations

Quick start

Last updated:2023-07-17 11:17

Integrate the SDK

Add ZegoUIKitPrebuiltCall as dependencies

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 Call Kit SDK.

import 'package:zego_uikit_prebuilt_call/zego_uikit_prebuilt_call.dart';

Using the ZegoUIKitPrebuiltCall in your project

  • Go to ZEGOCLOUD Admin Console, get the appID and appSign of your project.
  • Specify the userID and userName for connecting the Call Kit service.
  • Create a callID that represents the call you want to make.
  • userID and callID can only contain numbers, letters, and underlines (_).
  • Users that join the call with the same callID can talk to each other.
class CallPage extends StatelessWidget {
  const CallPage({Key? key, required this.callID}) : super(key: key);
  final String callID;

  Widget build(BuildContext context) {
    return ZegoUIKitPrebuiltCall(
      appID: yourAppID, // Fill in the appID that you get from ZEGOCLOUD Admin Console.
      appSign: yourAppSign, // Fill in the appSign that you get from ZEGOCLOUD Admin Console.
      userID: 'user_id',
      userName: 'user_name',
      callID: callID,
      // You can also use groupVideo/groupVoice/oneOnOneVoice to make more types of calls.
      config: ZegoUIKitPrebuiltCallConfig.oneOnOneVideoCall() 
        ..onOnlySelfInRoom = () => Navigator.of(context).pop(),

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

Configure your project

  • Android:
  1. If your project is created with Flutter 2.x.x:

a. Modify the compileSdkVersion to 33 in the your_project/android/app/build.gradle file.


b. Modify the minSdkVersion in the same file:

minSdkVersion 21


  1. Set the Kotlin & Gradle versions:

a. Modify the kotlin version to >= 1.8.0 and the gradle classpath version to 7.3.0 in the your_project/android/app/build.gradle file:

buildscript {
    ext.kotlin_version = '1.8.0'
    repositories {

    dependencies {
        classpath ''
        classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"

        // support notification
        classpath ''

b. Make the gradle version >= 7.0: In the your_project/android/gradle/wrapper/ file, modify the distributionUrl to https\://



  1. Add app permissions. Open the file your_project/app/src/main/AndroidManifest.xml, and add the following code:
    <uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
    <uses-permission android:name="android.permission.RECORD_AUDIO" />
    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
    <uses-permission android:name="android.permission.CAMERA" />
    <uses-permission android:name="android.permission.BLUETOOTH" />
    <uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
    <uses-permission android:name="android.permission.READ_PHONE_STATE" />
    <uses-permission android:name="android.permission.WAKE_LOCK" />
  1. 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 file with the following content as shown below:

-keep class **.zego.** { *; }

b. Add the following config code to the release part of the your_project/android/app/build.gradle file.

proguardFiles getDefaultProguardFile('proguard-android.txt'), ''


  • iOS:
  1. Add app permissions.

a. Open the your_project/ios/Podfile file, and add the following to the post_install do |installer| part:

# Start of the permission_handler configuration
target.build_configurations.each do |config|
  config.build_settings['GCC_PREPROCESSOR_DEFINITIONS'] ||= [
# End of the permission_handler configuration

b. Open the your_project/ios/Runner/Info.plist file, and add the following to the dict part:

    <string>We require camera access to connect</string>
    <string>We require microphone access to connect</string>
2. Disable Build Libraries for Distribution
  1. Open the your_project > iOS > Runner.xcworkspace file.

  2. Select your target project, and follow the notes on the following image to disable the Build Libraries for Distribution.

Run & Test

Now you have finished all the steps!

You can simply click the Run or Debug to run and test your App on your device.


Custom prebuilt UI


Page Directory