说明:
SDK 支持将原生的
UIView 嵌入到课堂 UI 中。1. 创建 Native View
继承
TCICViewFactory 并实现视图构建逻辑:import Foundationimport UIKitimport tcic_iosimport Flutterclass MyHeaderLeftView: TCICViewFactory {override init(messenger: FlutterBinaryMessenger) {super.init(messenger: messenger)}override func createNativeView(frame: CGRect, viewId: Int64, args: Any?) -> UIView {let view = UIView(frame: frame)view.backgroundColor = .bluelet label = UILabel(frame: CGRect(x: 0, y: 0, width: 180, height: 48))label.text = "My Header Left View From iOS"label.textColor = .whitelabel.textAlignment = .centerview.addSubview(label)return view}}
2. 将 Native View 注册到 SDK
在配置
TCICConfig 时,将自定义 View 传入对应的 ComponentConfig 中:let headerConfig = TCICHeaderComponentConfig()let headerLeftBuilder: TCICHeaderComponentConfig.HeaderBuilder = {return MyHeaderLeftView(messenger: TCICManager.shared.Tengine.binaryMessenger)}headerConfig.headerLeftBuilder = headerLeftBuilder // 绑定 BuilderheaderConfig.headerLeftBuilderWidth = 200 // 设置宽度headerConfig.headerLeftBuilderHeight = 40 // 设置高度let config = TCICConfig(token: "YOUR_TOKEN",classId: "YOUR_CLASS_ID",userId: "YOUR_USER_ID",role: 1,headerComponentConfig: headerConfig)TCICManager.shared.setConfig(config)
API 参考
TCICConfig 配置类
基础配置
public class TCICConfig {let token: String // 用户认证令牌let classId: String // 课程 IDlet userId: String // 用户 IDlet role: Int // 用户角色let langConfig: String? // 语言配置let isLatestBackend: Bool // 是否使用最新后端环境let isTestBackend: Bool // 是否使用测试后端环境}
组件配置
public class TCICConfig {let headerComponentConfig: TCICHeaderComponentConfig? // 头部组件配置let messageComponentConfig: TCICMessageComponentConfig? // 消息组件配置let videoComponentConfig: TCICVideoComponentConfig? // 视频组件配置let fontConfig: TCICFontConfig? // 字体配置let settingComponentConfig: TCICSettingComponentConfig? // 设置组件配置let whiteBoardComponentConfig: TCICWhiteBoardComponentConfig? // 白板组件配置let membersComponentConfig: TCICMembersComponentConfig? // 成员组件配置}
回调配置 (TCICCallback)
public class TCICCallback {/// 加入课堂成功回调public var onJoinedClassSuccessBlock: (() -> Void)?/// 退出课堂回调public var afterExitedClassBlock: (() -> Void)?/// 加入课堂失败回调public var onJoinedClassFailedBlock: (() -> Void)?/// 被踢出课堂回调public var onKickedOffClassBlock: (() -> Void)?/// 成员加入课堂回调 (参数为用户信息字典)public var onMemberJoinedClassBlock: (([String: Any]) -> Void)?/// 成员离开课堂回调 (参数为用户信息字典)public var onMemberLeaveClassBlock: (([String: Any]) -> Void)?/// 收到消息回调 (参数为消息内容字典)public var onReceivedMessageBlock: (([String: Any]) -> Void)?/// 发生错误回调 (参数为: 错误代码, 错误信息)public var onErrorBlock: ((String, String) -> Void)?}
组件配置系统
头部组件配置 (TCICHeaderComponentConfig)
let headerConfig = TCICHeaderComponentConfig()// 设置左侧视图headerConfig.headerLeftBuilder = {return MyHeaderLeftView(messenger: TCICManager.shared.flutterEngine.binaryMessenger)}headerConfig.headerLeftBuilderWidth = 200headerConfig.headerLeftBuilderHeight = 40// 设置头部主视图headerConfig.headerBuilder = { ... }headerConfig.headerBuilderWidth = 300headerConfig.headerBuilderHeight = 50// 设置头部操作视图headerConfig.headerActionsBuilder = { ... }headerConfig.headerActionsBuilderWidth = 150headerConfig.headerActionsBuilderHeight = 40// 设置右侧视图headerConfig.headerRightBuilder = { ... }headerConfig.headerRightBuilderWidth = 200headerConfig.headerRightBuilderHeight = 40
消息组件配置 (TCICMessageComponentConfig)
let messageConfig = TCICMessageComponentConfig()// 设置消息头部视图messageConfig.messageHeaderBuilder = { ... }messageConfig.messageHeaderBuilderWidth = 200messageConfig.messageHeaderBuilderHeight = 30// 设置消息气泡视图messageConfig.messageBubbleBuilder = { ... }messageConfig.messageBubbleBuilderWidth = 250messageConfig.messageBubbleBuilderHeight = 80// 设置消息项视图messageConfig.messageItemBuilder = { ... }messageConfig.messageItemBuilderWidth = 300messageConfig.messageItemBuilderHeight = 60// 设置消息行视图messageConfig.messageRowBuilder = { ... }messageConfig.messageRowBuilderWidth = 350messageConfig.messageRowBuilderHeight = 40
音视频组件配置 (TCICVideoComponentConfig)
let videoConfig = TCICVideoComponentConfig()// 设置视频操作视图videoConfig.videoActionBuilder = {return MyVideoActionView(messenger: TCICManager.shared.flutterEngine.binaryMessenger)}videoConfig.videoActionBuilderWidth = 200videoConfig.videoActionBuilderHeight = 50// 设置视频浮动视图videoConfig.videoFloatBuilder = {return MyVideoFloatView(messenger: TCICManager.shared.flutterEngine.binaryMessenger)}videoConfig.videoFloatBuilderWidth = 120videoConfig.videoFloatBuilderHeight = 80