logo
On this page

Running Example Code Guide

2026-03-05

Prepare environment

Please ensure that the development environment meets the following technical requirements:

  • iOS 12.0 or above, with an iOS device or simulator that supports audio and video (using a real device is recommended)
  • Android version not lower than 4.4, with an Android device or simulator that supports audio and video (using a real device is recommended). If using a real device, enable the "Allow Debugging" option.
  • Windows: Windows 8 or above.
  • macOS: macOS 11.0 or above.
  • Web: Chrome 58 or above, Firefox 56 or above, Safari 11 or above, Opera 45 or above, QQ Browser Windows 10.1 or above/macOS 4.4 or above, 360 Secure Browser Speed Mode.
  • Linux: Debian 10 or above, Ubuntu 20.04 LTS, 22.04 LTS, 24.04 LTS.
  • Flutter 2.0 or above, please refer to Flutter Get Started.
  • The device is connected to the Internet.

Configure development environment:

  • Android Studio: Select "Preferences > Plugins", search for the "Flutter" plugin to download, and configure the downloaded Flutter SDK path in the plugin.

  • VS Code: Search for the "Flutter" extension in the app store and download it.

    After configuring the Flutter environment in any of the above development environments, run flutter doctor in the command line (terminal), and complete the relevant undownloaded dependencies according to the prompts.

Prerequisites

You have already created a project in the ZEGOCLOUD Console and applied for a valid AppID and AppSign.

Warning

The SDK also supports Token authentication. If you need to upgrade the authentication method, please refer to How to upgrade from AppSign authentication to Token authentication.

Get example source code

Example source code directory structure

The following directory structure is the file structure of the flutter_dart subdirectory. The file paths involved below are all relative to this directory.

.
├─ README.md
├─ README_zh.md
├─ VERSION.txt
├─ android
├─ ios
├─ lib
│    ├─ home
│    │    ├─ global_setting_page.dart      # Settings interface
│    │    └─ home_page.dart                # Main page
│    ├─ main.dart
│    ├─ topics
│    │    ├─ AudioAdvanced                 # Advanced audio features
│    │    ├─ BestPractices                 # Best practices
│    │    ├─ CommonFunctions               # Common functions
│    │    ├─ OtherFunctions                # Other functions
│    │    ├─ QuickStart                    # Quick start
│    │    ├─ StreamAdvanced                # Stream publishing and playing advanced
│    │    └─ VideoAdvanced                 # Advanced video features
│    └─ utils
├─ pubspec.yaml                            # Flutter project file
├─ resources
└─ test

Run example code

iOS/Android:

  • Android Studio

    1. Decompress the downloaded "ZegoExpressDemo_flutter_dart.zip" archive to extract the "flutter_dart" folder.
    2. Open Android Studio, select "Open an exitsting Android Studio project", and open the "flutter_dart" folder.
    3. Connect an Android or iOS device to the computer.
    4. In the upper right corner of Android Studio, click the "Run" button to run the example app.
  • VS Code

    1. Decompress the downloaded "ZegoExpressDemo_flutter_dart.zip" archive to extract the "flutter_dart" folder.
    2. Open VS Code, select "File > Open", and open the "flutter_dart" directory.
    3. In the file manager on the left side of VS Code, find "lib/main.dart" and double-click to open it.
    4. Connect an Android or iOS device to the computer.
    5. Select "Run > Run without Debugging" to run the example app.
Warning

The example source code lacks the "appID" and "appSign" required for SDK initialization. Please fill in the AppID and AppSign obtained in Prerequisites of this article into the "lib/keycenter.dart" file correctly, otherwise the example source code cannot run normally.

Web:

  • VS Code

    1. Decompress the downloaded "ZegoExpressDemo_flutter_dart.zip" archive to extract the "flutter_dart" folder.
    2. Open VS Code, select "File > Open", and open the "flutter_dart" directory.
    3. Select "Terminal > New Terminal" to start a new terminal based on the current directory.
    4. Run flutter run -d chrome --web-renderer html in the terminal to run the example demo.
Warning
  • The example source code lacks the "appID" required for SDK initialization. Please fill in the AppID obtained in Prerequisites of this article into the "lib/keycenter.dart" file correctly, otherwise the example source code cannot run normally. Web does not support AppSign authentication. Avoid bringing AppSign into the production build of the online environment to prevent leakage.
  • Only supports SSL-enabled web servers (HTTPS). The web service domain name of the local debugging tool can use localhost or 127.0.0.1.
  • The Web platform only supports token authentication.
  • Temporary token acquisition method For the convenience of developers, ZEGO Console provides a function to generate temporary tokens. Developers can directly obtain temporary tokens to use. For details, please refer to Console - Development Assistance - Temporary Token. However, in the developer's own online environment, be sure to generate tokens through their own server.
class KeyCenter {
  static final KeyCenter instance = KeyCenter._internal();
  KeyCenter._internal();

  // Developers can obtain AppID from the console: https://console.zego.im/account/login
  // For example 123456789
  int appID = ;

  // Only required when running on non-Web platforms
  // AppSign only meets simple authentication requirements
  // If you need to upgrade to a more secure authentication method, please refer to [How to upgrade Express from AppSign authentication to Token authentication?](/faq/express-token-upgrade?product=ExpressVideo&platform=all)
  // Developers can obtain AppSign from the console: https://console.zego.im/account/login
  // For example "abcdefghijklmnopqrstuvwxyz0123456789abcdegfhijklmnopqrstuvwxyz01"
  String appSign = '';

  // Only required when running on Web platforms
  // Developers can obtain Token from the console: https://console.zego.im/account/login
  // Note: The userID used to generate the Token must be the same as the userID filled in above
  // For example "04AAAAAxxxxxxxxxxxxxx"
  String token = '';

  // For internal testing on Web (no need to fill in this value, ignore it)
  String tokenServer = '';
}

Notes

When running the example app on an iOS real device, you need to switch to your own Apple development certificate

  1. Use Xcode to open ios/Runner.xcworkspace in the project directory.

  2. Log in to your Apple ID account.

    1. Open Xcode, select "Xcode > Preference" in the upper left corner, click the "Account" tab, click the "+" sign in the lower left corner, and select to add an Apple ID.

    2. Enter your Apple ID and password to log in.

  3. Modify the developer certificate and Bundle Identifier.

    1. Open Xcode and click the project "Runner" on the left.

    2. In the "General" tab, change "Bundle Identifier".

    3. Click the "Signing & Capabilities" tab and select your own developer certificate in "Team".

Experience Video Call features

Run the project on a real device. After successful operation, you can see the local video image.

For convenience, ZEGO provides a Web platform for debugging. On this page, enter the same AppID and RoomID, enter different UserIDs, and corresponding Token, you can join the same room to communicate with real devices. When the video call starts successfully, you can hear the remote audio and see the remote video image.

Previous

Common Error Codes

Next

Integrating SDK