Skip to main content

You are viewing Agora Docs forBetaproducts and features. Switch to Docs

Android
iOS
Web
Electron

Classroom SDK & Proctor SDK

This page introduces how to add Flexible Classroom into your app.

Understand the tech

Module introduction

The source code of Flexible Classroom contains the following packages:

  • app: (Optional) This module contains code for the classroom login interface and a client-side token generator and shows how to call APIs to join a flexible classroom. This module is an open-source project available on GitHub and for reference only.
  • Specifications defined for the login interface (such as the length requirement of the user name and the room name and character restrictions) do not apply to all apps – make sure to define them according to your business requirements.
  • The client-side token generator provided by Agora is only for rapid testing. When your app goes live, to ensure security, you must deploy a server-side token generator and generate tokens on your server. For details, see Secure authentication with tokens.
    • AgoraEduUIKit: (Optional) This module contains code for the classroom UI. It shows how to call APIs to aggregate and update UI data based on Flexible Classroom APIs and data callbacks. This module is an open-source project available on GitHub. You can develop your classroom UI based on this module.
    • AgoraClassSDK: (Optional) This module provides methods to configure the SDK, launch a flexible classroom, register ext apps, and the activity implementation of each teaching scenario. This module is an open-source project available on GitHub. Agora recommends integrating this module.
    • AgoraEduCore: (Required) The core module of Flexible Classroom. Since v2.0.0, this module is closed-source, and you can import this module only by adding a remote dependency.
    • AgoraCloudScene: (Optional) The cloud classroom module of the Flexible Classroom. Depends on the AgoraEduCore cloud classroom UI implementation of the module.

    Integrated education scenario

    If you use the default UI of Flexible Classroom, take the following steps to add remote dependencies and integrate the whole Flexible Classroom through Maven:

    1. Add the following library to your project's build.gradle file:


      _6
      repositories {
      _6
      maven { url 'https://jitpack.io' }
      _6
      google()
      _6
      mavenCentral()
      _6
      maven { url 'https://s01.oss.sonatype.org/content/repositories/snapshots/' }
      _6
      }

    2. Add the following dependencies in the project's build.gradle file to import the following modules: AgoraEduUIKit, AgoraClassSDK, and AgoraEduCore:


      _6
      dependencies {
      _6
      ...
      _6
      implementation "io.github.agoraio-community:AgoraEduCore:{VERSION}"
      _6
      implementation "io.github.agoraio-community:AgoraEduUIKit:{VERSION}"
      _6
      implementation "io.github.agoraio-community:AgoraClassSDK:{VERSION}"
      _6
      }

      For example, for v2.8.20:


      _5
      dependencies {
      _5
      implementation "io.github.agoraio-community:AgoraEduCore:2.8.20"
      _5
      implementation "io.github.agoraio-community:AgoraEduUIKit:2.8.20"
      _5
      implementation "io.github.agoraio-community:AgoraClassSDK:2.8.20"
      _5
      }

      To use Flexible Classroom versions equal to or earlier than 2.7.0, also add the hyphenate dependency inside the dependencies block in the project's build.gradle file:


      _4
      dependencies {
      _4
      ...
      _4
      implementation "io.github.agoraio-community:hyphenate:{VERSION}"
      _4
      }

      Information
      Click here to view the latest version of Flexible Classroom.
    3. After version 2.8.70, the following code needs to be initialized in the Application onCreate method:


      _1
      AgoraSDKInitUtils.initSDK(this);

    4. To launch a classroom, call AgoraClassroomSDK.launch. Sample code:


      _40
      // Before starting the classroom, you need to dynamically apply for `Manifest.permission.RECORD_AUDIO` and `Manifest.permission.CAMERA` permissions
      _40
      fun startClassRoom() {
      _40
      val appId = "" // Your app ID
      _40
      val rtmToken = "" // Your signaling Token
      _40
      val userName = "Tom" // Your user name
      _40
      val roomName = "MyRoom" // Your room name
      _40
      val roomType = RoomType.SMALL_CLASS.value // Class type: 0: One-on-one, 2: Large class, 4: Small class
      _40
      val roleType = AgoraEduRoleType.AgoraEduRoleTypeStudent.value // Role: 1: Teacher role, 2: Student role
      _40
      val roomUuid = HashUtil.md5(roomName).plus(roomType).lowercase()
      _40
      val userUuid = HashUtil.md5(userName).plus(roleType).lowercase()
      _40
      val roomRegion = AgoraEduRegion.cn // Area
      _40
      val duration = 1800L // Class duration
      _40
      _40
      val config = AgoraEduLaunchConfig(
      _40
      userName,
      _40
      userUuid,
      _40
      roomName,
      _40
      roomUuid,
      _40
      roleType,
      _40
      roomType,
      _40
      rtmToken,
      _40
      null,
      _40
      duration
      _40
      )
      _40
      _40
      config.appId = appId
      _40
      config.region = roomRegion
      _40
      // Set large window video area parameters (large stream)
      _40
      config.videoEncoderConfig = EduContextVideoEncoderConfig(
      _40
      FcrStreamParameters.HeightStream.width,
      _40
      FcrStreamParameters.HeightStream.height,
      _40
      FcrStreamParameters.HeightStream.frameRate,
      _40
      FcrStreamParameters.HeightStream.bitRate
      _40
      )
      _40
      _40
      AgoraClassroomSDK.setConfig(AgoraClassSdkConfig(appId))
      _40
      AgoraClassroomSDK.launch(this, config, AgoraEduLaunchCallback { event ->
      _40
      Log.e("agora", ":launch-Class status:" + event.name)
      _40
      })
      _40
      }

      You can set the video parameters of the large and small windows by setting FcrStreamParameters, where:

      • Small stream mode: When in the stage area, switch to the small stream mode. This parameter indicates the video parameters in the stage area.
      • Large stream mode: When in the large window area, switch to the large stream mode. This parameter indicates the video parameters in the large window.

      _17
      public class FcrStreamParameters {
      _17
      // Small stream
      _17
      public static class LowStream {
      _17
      public static int width = 320;
      _17
      public static int height = 240;
      _17
      public static int frameRate = 15;
      _17
      public static int bitRate = 200;
      _17
      }
      _17
      _17
      // Large stream
      _17
      public static class HeightStream {
      _17
      public static int width = 640;
      _17
      public static int height = 480;
      _17
      public static int frameRate = 15;
      _17
      public static int bitRate = 600;
      _17
      }
      _17
      }

    5. Set up dark mode

      Because switching to the dark mode requires restarting the Activity, in order to be compatible with all mobile phone models, it is recommended to set the theme directly in Application#onCreate. Refer to the following sample code:


      _7
      void setDarkMode() {
      _7
      // Add the logic of whether to enable the dark mode here
      _7
      boolean isDarkMode = ""
      _7
      if (isDarkMode) {
      _7
      SkinUtils.INSTANCE.setNightMode(true);
      _7
      }
      _7
      }

    6. To prevent code obfuscation, add the following in the /Gradle Scripts/proguard-rules.pro file:


      _3
      -keep class io.agora.**{*;}
      _3
      -keep class com.agora.**{*;}
      _3
      -keep class com.hyphenate.**{*;}

    Integrated cloud classroom

    If you use the default UI of Flexible Classroom Cloud Classroom, take the following steps to add remote dependencies and integrate the whole Flexible Classroom through Maven:

    1. Add the following code to the build.gradle file in the project root directory:


      _6
      repositories {
      _6
      maven { url 'https://jitpack.io' }
      _6
      google()
      _6
      mavenCentral()
      _6
      maven { url 'https://s01.oss.sonatype.org/content/repositories/snapshots/' }
      _6
      }

    2. Add the following dependencies to the build.gradle file in the project root directory. Import AgoraCloudScene and AgoraEduCore module:


      _4
      dependencies {
      _4
      implementation "io.github.agoraio-community:AgoraEduCore:{VERSION_NUMBER}"
      _4
      implementation "io.github.agoraio-community:AgoraCloudScene:{VERSION_NUMBER}"
      _4
      }

      For example, for version 2.8.70:


      _4
      dependencies {
      _4
      implementation "io.github.agoraio-community:AgoraEduCore:2.8.70"
      _4
      implementation "io.github.agoraio-community:AgoraCloudScene:2.8.70"
      _4
      }

      Information
      Click here to view the latest version of Flexible Classroom.
    3. In the Application onCreate method, initialize the following:


      _1
      AgoraSDKInitUtils.initSDK(this)

    4. Call AgoraOnlineClassroomSDK.launch to start the class. The parameters of AgoraOnlineClassroomSDK and AgoraClassroomSDK are the same. Refer to the following sample code:


      _40
      // Before starting the classroom, you need to dynamically apply for `Manifest.permission.RECORD_AUDIO` and `Manifest.permission.CAMERA` permissions
      _40
      fun startClassRoom() {
      _40
      val appId = "" // Your app ID
      _40
      val rtmToken = "" // Your signaling Token
      _40
      val userName = "Tom" // Your user name
      _40
      val roomName = "MyRoom" // Your room name
      _40
      val roomType = RoomType.SMALL_CLASS.value // Class type: 4: Small classes
      _40
      val roleType = AgoraEduRoleType.AgoraEduRoleTypeStudent.value // The role only supports 2: Student role
      _40
      val roomUuid = HashUtil.md5(roomName).plus(roomType).lowercase()
      _40
      val userUuid = HashUtil.md5(userName).plus(roleType).lowercase()
      _40
      val roomRegion = AgoraEduRegion.cn // Area
      _40
      val duration = 1800L // Class duration
      _40
      _40
      val config = AgoraEduLaunchConfig(
      _40
      userName,
      _40
      userUuid,
      _40
      roomName,
      _40
      roomUuid,
      _40
      roleType,
      _40
      roomType,
      _40
      rtmToken,
      _40
      null,
      _40
      duration
      _40
      )
      _40
      _40
      config.appId = appId
      _40
      config.region = roomRegion
      _40
      // Set large window video area parameters (large stream)
      _40
      config.videoEncoderConfig = EduContextVideoEncoderConfig(
      _40
      FcrStreamParameters.HeightStream.width,
      _40
      FcrStreamParameters.HeightStream.height,
      _40
      FcrStreamParameters.HeightStream.frameRate,
      _40
      FcrStreamParameters.HeightStream.bitRate
      _40
      )
      _40
      _40
      AgoraOnlineClassroomSDK.setConfig(AgoraOnlineClassSdkConfig(appId))
      _40
      AgoraOnlineClassroomSDK.launch(this, config, AgoraEduLaunchCallback { event ->
      _40
      Log.e("agora", ":launch-class status:" + event.name)
      _40
      })
      _40
      }

    5. To prevent code obfuscation, add the following in the /Gradle Scripts/proguard-rules.pro file:


      _2
      -keep class io.agora.**{*;}
      _2
      -keep class com.agora.**{*;}

    Information
    Cloud Classroom does not support dark mode yet.

    Integration considerations

    Third-party libraries

    No matter which method you choose, the third-party libraries Flexible Classroom uses may conflict with the third-party libraries on which your project depends. You can use exclude to resolve this conflict or change the version that your project depends on.

    vundefined