原生内核

最近更新时间:2025-09-02 16:57:22

我的收藏

开发环境要求

Android SDK:API 21+ (Android 5.0+)
NDK:27.0.12077973+
Java:11+
Kotlin:支持

前置准备

您已 注册腾讯云 账号,并完成 实名认证

步骤一:创建新的应用

1. 登录 实时互动-教育版 控制台,进入左侧导航栏的概览,选择新建应用
2. 若尚未创建应用,则默认进入“创建应用”界面,输入应用名称,例如 TestLCIC。

若您已创建应用,可前往应用管理中,选择使用已有应用即可。

说明:
移动端需要购买旗舰版或企业尊享版后方可接入。若需创建商用应用,可根据业务需求在 购买页 创建对应版本的应用。
应用名称只允许下划线、数字或中英文字符。

步骤二:获取 SDKAppId 和密钥(SecretKey)

1. 进入 应用管理 > 应用配置,获取应用 ID(SDKAppId)。
2. 进入 访问管理(CAM)控制台 获取密钥,若无密钥,需要在 API 密钥管理中进行新建,具体可参见 访问密钥管理




步骤三:获取进入课堂所需参数

1. 通过调用云 API 接口 RegisterUser 注册用户,可以获取到对应的用户 ID(userId)信息。
2. 通过云 API 接口 LoginUser 登录,可以获取到用户鉴权 token 信息。
3. 通过云 API 接口 CreateRoom 创建课堂,可以获取到课堂号(classId)信息。
字段
类型
必填
含义
备注
userid
string
用户名。
通过 RegisterUser 接口获取。
classid
string
课堂 ID。
通过 CreateRoom 接口创建返回获取。
token
string
后台鉴权参数。
通过 LoginUser 接口获取。
role
string
进入课堂角色,默认空。
可选参数 supervisor(巡课/内容审查) ,只有已注册应用内巡课用户才有权限。
lng
string
语言参数,默认 zh-CN。
当前支持中文(简体)、中文(繁体) 、English、韩语、日语、阿拉伯语、越南语。可拼接相应参数,展示对应语种。参数:zh-CN、zh-TW、en-US、ka、ja、ar、vi。
location
boolean
是否上报经纬度位置信息。
默认 false 不上报。
layout
string
页面布局。
默认顶部布局(top),当前仅视频文档模式有效,支持双排布局(double)、右侧布局(right)、左侧布局(left)、三分布局(three)。
boardColor
string
白板颜色。
白板颜色设置,默认为:#182E25 ,支持 Hex 格式,也支持 rgba(0, 0, 0, .3)设置。
noEndClass
boolean
禁用下课。
助教进房时带上这个参数,在助教点击退出时,将隐藏「下课」,仅展示「离开」按钮。

快速跑通

根据下面的步骤您可以快速跑通项目, 具体代码也可以参见 Demo

步骤一:导入 SDK

1. 在您的 Android 项目中的 settings.gradle中添加:
maven("https://storage.googleapis.com/download.flutter.io")
maven("https://android.qcloudclass.com/repo")
2. 在您的Android项目中的build.gradle文件中添加依赖,并且设置compileSdk
compileSdk = 35

implementation("com.qcloudclass.tcic_client_module:flutter_release:1.0")
implementation("com.qcloudclass:tcic:1.0.9")
implementation("io.flutter:flutter_embedding_release:1.0.0-18b71d647a292a980abb405ac7d16fe1f0b20434")
3. 在您的AndroidManifest.xml 中的application 添加 tools:replace="android:allowBackup"
<application
android:allowBackup="true"
android:dataExtractionRules="@xml/data_extraction_rules"
android:fullBackupContent="@xml/backup_rules"
tools:replace="android:allowBackup" // 添加这一行
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:roundIcon="@mipmap/ic_launcher_round"
android:supportsRtl="true"
android:theme="@style/Theme.Tcic_android_simple_demo"
tools:targetApi="31">
... 其他代码

步骤二:权限配置

android/app/src/main/AndroidManifest.xml 中添加以下权限:
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
<uses-permission android:name="android.permission.BLUETOOTH" />
<uses-permission android:name="android.permission.CAMERA" />
<uses-feature android:name="android.hardware.camera.autofocus" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>

步骤三:初始化 SDK

在您的页面首次进入的时候需要初始化 TCIC SDK,您可以根据您的实际业务来处理。
TCICManager.initialize(context);

步骤四:设置回调事件

如果您需要监听课堂相关的事件,可添加相关回调,同初始化一样,您只需要添加一次即可。
TCICManager.setCallback(object : TCICManager.TCICCallback {
override fun onJoinedClassSuccess() {
Log.d(TAG, "onJoinedClassSuccess called from Flutter")
runOnUiThread {
Toast.makeText(ctx, "加入课堂成功", Toast.LENGTH_SHORT).show()
}
}

override fun afterExitedClass() {
Log.d(TAG, "afterExitedClass called from Flutter")
runOnUiThread {
Toast.makeText(ctx, "已退出课堂,关闭页面", Toast.LENGTH_SHORT).show()
TCICManager.closeTCICActivity();
}
}

override fun onJoinedClassFailed() {
Log.d(TAG, "onJoinedClassFailed called from Flutter")
runOnUiThread {
Toast.makeText(ctx, "加入课堂失败", Toast.LENGTH_SHORT).show()
}
}

override fun onKickedOffClass() {
Log.d(TAG, "onKickedOffClass called from Flutter")
runOnUiThread {
Toast.makeText(ctx, "被踢出课堂", Toast.LENGTH_SHORT).show()
}
}

override fun onMemberJoinedClass(data: Map<*, *>) {
Log.d(TAG, "onMemberJoinedClass: $data")
runOnUiThread {
Toast.makeText(
ctx,
"成员加入: $data",
Toast.LENGTH_SHORT
).show()
}
}

override fun onMemberLeaveClass(data: Map<*, *>) {
Log.d(TAG, "onMemberLeaveClass: $data")
runOnUiThread {
Toast.makeText(
ctx,
"成员离开: $data",
Toast.LENGTH_SHORT
).show()
}
}

override fun onRecivedMessage(message: Map<*, *>) {
Log.d(TAG, "onRecivedMessage: $message")
runOnUiThread {
Toast.makeText(
ctx,
"收到消息: $message",
Toast.LENGTH_SHORT
).show()
}
}

override fun onError(errorCode: String, errorMsg: String) {
Log.e(TAG, "onError: $errorCode - $errorMsg")
runOnUiThread {
Toast.makeText(
ctx,
"错误: $errorMsg",
Toast.LENGTH_SHORT
).show()
}
}
})

步骤五:进入课堂页面

在前置准备中,您已了解如何获取 token、userId 等进入课堂的必要参数,您只需要根据您的实际业务,填入这些参数即可。
@Composable
fun Greeting(name: String, modifier: Modifier = Modifier) { val context = LocalContext.current

// 这里用 Column 来垂直排列文本和按钮
androidx.compose.foundation.layout.Column(modifier = modifier) {
Button(onClick = {
val token = "";
val classId = ""
val userId = ""
val role = 1 /// 用户角色,0: 学生,1: 老师, 3: 助教, 4: 巡课
val config = TCICConfig(token, classId, userId, role);
TCICManager.setConfig(config);
// 打开activity
context.startActivity(TCICManager.getTCICIntent(context));
}) {
Text(text = "点击我进房")
}
}
}

步骤六:页面自定义 view

您同时可以自定义课堂中的某些部分,例如 Header 组件, Message 组件的消息体等;例如自定义 Header 组件 Left 部分。下文以构造Header 组件部分为例。

创建 viewCreator

public class HeaderLeftViewCreator implements NativeViewCreator {

@Override
public View createView(Context context, int id, Object args) {
// 水平布局:文本 + info 图标
LinearLayout layout = new LinearLayout(context);
layout.setOrientation(LinearLayout.HORIZONTAL);
layout.setGravity(Gravity.CENTER_VERTICAL);
layout.setBackgroundColor(Color.TRANSPARENT);

// 创建文本
TextView textView = new TextView(context);
String text = "Header Left 原生View";
textView.setText(text);
textView.setTextSize(12); // 12px
textView.setTextColor(Color.WHITE);
textView.setGravity(Gravity.CENTER_VERTICAL);

LinearLayout.LayoutParams textParams = new LinearLayout.LayoutParams(
LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
textView.setLayoutParams(textParams);
layout.addView(textView);

// 创建 info 图标
ImageView infoIcon = new ImageView(context);
infoIcon.setImageResource(android.R.drawable.ic_menu_info_details); // 使用系统 info 图标
infoIcon.setColorFilter(Color.WHITE); // 设置图标颜色为白色

// 在 createView 里
LinearLayout.LayoutParams iconParams = new LinearLayout.LayoutParams(
dp2px(context, 32), dp2px(context, 32)); // 32dp x 32dp
iconParams.setMargins(8, 0, 0, 0); // 左边距 8px
infoIcon.setLayoutParams(iconParams);
layout.addView(infoIcon);

return layout;
}
// dp 转 px 工具
private int dp2px(Context context, float dp) {
return (int) (dp * context.getResources().getDisplayMetrics().density + 0.5f);
}

@Override
public void disposeView(View view) {
// 可以在这里处理 View 的清理工作
// 例如取消监听器、释放资源等
}
}

将 View Creator 注册到 SDK

所有组件的配置以及自定义配置都只需要在 TCICConfig 中进行配置即可。
val headerComponentConfig = TCICHeaderComponentConfig();
headerComponentConfig.setHeaderLeftBuilder(::HeaderLeftViewCreator)
val token = "";
val classId = ""
val userId = ""
val role = 1 /// 用户角色,0: 学生,1: 老师, 3: 助教, 4: 巡课
val config = TCICConfig(token, classId, userId, role);
config.headerComponentConfig = headerComponentConfig;
TCICManager.setConfig(config);
context.startActivity(TCICManager.getTCICIntent(context));
这样您就获得了一个自定义 `Header` 组件的页面。

其他

TCICCallback 接口

public interface TCICCallback {
/**
* 加入课堂成功
*/
void onJoinedClassSuccess();
/**
* 退出课堂后
*/
void afterExitedClass();
/**
* 加入课堂失败
*/
void onJoinedClassFailed();
/**
* 被踢出课堂
*/
void onKickedOffClass();
/**
* 成员加入课堂
* @param userId 用户信息
*/
void onMemberJoinedClass(Map userId);
/**
* 成员离开课堂
* @param userId 用户信息
*/
void onMemberLeaveClass(Map userId);
/**
* 收到消息
* @param messageJson 消息内容
*/
void onRecivedMessage(Map messageJson);
/**
* 发生错误
* @param errorCode 错误代码
* @param errorMsg 错误信息
*/
void onError(String errorCode, String errorMsg);
}

头部组件配置 (TCICHeaderComponentConfig)

TCICHeaderComponentConfig headerConfig = new TCICHeaderComponentConfig();

// 设置左侧视图
headerConfig.setHeaderLeftBuilder(new HeaderLeftViewCreator());

// 设置头部视图
headerConfig.setHeaderBuilder(new HeaderViewCreator());

// 设置头部操作视图
headerConfig.setHeaderActionsBuilder(new HeaderActionCreator());

// 设置右侧视图
headerConfig.setHeaderRightBuilder(new HeaderRightViewCreator());

消息组件配置

TCICMessageComponentConfig messageConfig = new TCICMessageComponentConfig();

// 设置消息头部视图
messageConfig.setMessageHeaderBuilder(new MessageHeaderViewCreator());

// 设置消息气泡视图
messageConfig.setMessageBubbleBuilder(new MessageBubbleViewCreator());

// 设置消息项视图
messageConfig.setMessageItemBuilder(new MessageItemViewCreator());

// 设置消息行视图
messageConfig.setMessageRowBuilder(new MessageRowViewCreator());

音视频组件配置

TCICVideoComponentConfig videoConfig = new TCICVideoComponentConfig();

// 设置视频操作视图
videoConfig.setVideoActionBuilder(new VideoActionViewCreator());

// 设置视频浮动视图
videoConfig.setVideoFloatBuilder(new VideoFloatViewCreator());

自定义视图

public class CustomViewCreator implements NativeViewCreator {
@Override
public View createView(Context context) {
// 创建自定义视图
View customView = LayoutInflater.from(context).inflate(R.layout.custom_view, null);
return customView;
}
}

注册自定义视图

TCICManager.registerNativeViewCreator("custom_view_type", new CustomViewCreator());

// 检查视图是否已注册
boolean isRegistered = TCICManager.isViewCreatorRegistered("custom_view_type");

// 获取所有已注册的视图类型
List<String> registeredTypes = TCICManager.getRegisteredViewCreators();

技术支持

如果您在使用过程中遇到问题,可以通过以下方式获取技术支持: