IOS技术分享| anyRTC 互动白板场景实现

前言

互动白板提供一整套完整的互动白板解决方案，客户端 SDK 覆盖 iOS、Android、Web 等主流平台，同时提供完整的服务端配套功能，可用于在线教育、在线会议、协作办公、在线互动娱乐等场景。

方案优势

超低延时

我们自研引擎和算法，减少传输冗余数据，白板操作延迟低至 100 ms，节约带宽资源的同时，打造真正无感知的实时互动体验。

服务部署于全球多个节点，通过就近接入、智能路由等控制策略，给不同地域的用户带来同样顺畅的体验。

支持多平台，集成简单

互动白板 SDK 覆盖 Web、Android、iOS 等主流平台，几行代码即可快速接入。

灵活组合

互动白板 SDK 作为独立、可自定义的白板产品，灵活易用，可满足不同场景的需求:

可与音视频SDK、信令SDK等产品搭配使用，丰富应用的功能，详见anyRTC 文档。

平台支持

平台	体验	源码
Web	在线体验	ARBoard-Web（Github 开源项目）
Android	前往下载	ARBoard-Android（Github 开源项目）
iOS	App Store 下载	ARBoard-iOS（Github 开源项目）

新春献礼，钜惠来袭

详见 anyRTC 官网

互动白板

效果预览

App Store 体验

点击下载互动白板

源码下载

点击跳转 Github

开发环境

开发工具：Xcode13
开发语言：Swift
实现：互动白板相关。

核心代码

实例化白板对象

    func initializeBoard() {boardKit = ARBoardKit(engineWithAppId: AppID, delegate: self)let boardView = boardKit.getBoardRenderView()boardView.frame = view.boundsview.insertSubview(boardView, at: 0)boardKit.joinChannel(byToken: nil, channelId: channelId, uid: localUid) { [weak self] _, _ inboardKit.setDrawEnable(true)self?.isJoin = trueprint("joinChannel")}}

白板菜单

    @objc func didClickMenu() {view.endEditing(true)if isJoin {menuVc.view.frame = CGRect(x: isMenuOn ? 0 : -288, y: 0, width: ARScreenWidth, height: ARScreenHeight - (isFullScreen() ? 88 : 64))isMenuOn.toggle()if isMenuOn {view.addSubview(menuVc.view)addChild(menuVc)}UIView.animate(withDuration: 0.2) {self.menuVc.view.x = self.isMenuOn ? 0 : -288} completion: { _ inif !self.isMenuOn {self.menuVc.view.removeFromSuperview()self.menuVc.removeFromParent()}}} else {print("Join Channel first")}}

白板操作

func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {let menuItem = menus[indexPath.section].rows[indexPath.row]if menuItem.identifier.count != 0 {guard let toolVc = storyboard?.instantiateViewController(withIdentifier: menuItem.identifier) else { return }toolVc.modalPresentationStyle = .overCurrentContextif toolVc is ARColorViewController {let colorVc = toolVc as! ARColorViewControllercolorVc.colorIndex = indexPath.row}present(toolVc, animated: false, completion: nil)return}if indexPath.section == 0 {if indexPath.row == 6 {/// 撤销boardKit.undo()} else if indexPath.row == 7 {/// 重做boardKit.redo()} else if indexPath.row == 8 {/// 清空涂鸦boardKit.clear(false)} else if indexPath.row == 9 {/// 清空涂鸦和背景boardKit.clear(true)} else if indexPath.row == 10 {/// 重置boardKit.reset()}} else if indexPath.section == 1 {if indexPath.row == 0 {/// 新增boardKit.addBoard()} else if indexPath.row == 1 {/// 删除boardKit.deleteBoard()} else if indexPath.row == 2 {/// 上一页boardKit.preBoard()} else if indexPath.row == 3 {/// 下一页boardKit.nextBoard()}}}

白板回调

extension ARBoardViewController: ARBoardDelegate {func board(_ boardKit: ARBoardKit, didOccurError errorCode: ARBoardErrorCode) {/// 发生错误回调Logger.log(message: "didOccurError errorCode = \(errorCode.rawValue)", level: .error)}func board(_ boardKit: ARBoardKit, addBoard boardIds: [Any], fileId: String) {/// 添加白板页的回调Logger.log(message: "addBoard boardIds = \(boardIds) fileId = \(fileId) ", level: .info)}func board(_ boardKit: ARBoardKit, deleteBoard boardIds: [Any], fileId: String) {/// 删除白板页的回调Logger.log(message: "deleteBoard boardIds = \(boardIds) fileId = \(fileId)", level: .info)}func board(_ boardKit: ARBoardKit, gotoBoard fileId: String, boardId: String) {/// 白板页切换的回调Logger.log(message: "gotoBoard fileId = \(fileId) boardId = \(boardId)", level: .info)}func board(_ boardKit: ARBoardKit, scaleChannge boardId: String, scale: CGFloat) {/// 白板缩放的回调Logger.log(message: "scaleChannge boardId = \(boardId) scale = \(scale)", level: .info)}func board(_ boardKit: ARBoardKit, connectionChangedTo state: ARBoardConnectionStateType, reason: ARBoardConnectionChangedReason) {/// 网络状态回调Logger.log(message: "connectionChangedTo state = \(state.rawValue) reason = \(reason.rawValue)", level: .info)}func board(_ boardKit: ARBoardKit, undoStateChange enable: Bool) {/// 当前白板页是否可撤销Logger.log(message: "undoStateChange enable = \(enable)", level: .info)}func board(_ boardKit: ARBoardKit, redoStateChange enable: Bool) {/// 当前白板页是否可重做Logger.log(message: "redoStateChange enable = \(enable)", level: .info)}
}

结束语

互动白板目前还存在一些待完善的功能点，体验或集成过程中有不足之处，欢迎大家指出~

IOS技术分享| anyRTC 互动白板场景实现相关推荐

开源demo| anyRTC 互动白板发布，助力实时互动场景
上网课时会有白板板书.开视频会议时会有PPT展示进行演讲.语聊开黑时会有你猜我画游戏来供用户进行游戏互动-,互动白板已经渗透进我们生活的各个方面.白板是否好用,关系到实时互动的质量,更能影响应用的推广 ...
web技术分享| web的白板工具栏封装
最近做白板项目,最重要的工具栏模块在网上搜了搜都没找到想要的,狠下心自己原生封装一个. 最终效果展示: 使用白板 SDK 使用 anyRTC 的白板SDK 项目地址:https://demos.any ...
IOS技术分享| 互动连麦场景实现
前言 anyRTC 提供互动连麦的场景,演示了如何通过 anyRTC云服务,并配合 anyRTC RTC SDK.anyRTC RTM SDK,快速实现连麦社交的场景. 方案选择: RTC实时互动客 ...
技术分享| anyRTC服务单端口设计
传统的CDN比如RTMP直播,是基于tcp的服务,并不存在端口过多的情况:而RTC服务大多数用的是udp端口,这种Udp模式有很多的优点,但是相比于RTMP直播服务器单端口走天下,RTC服务动则要开几 ...
ios技术分享| iOS 发布 framework 到 Cocoapods 以及常见问题
前言 CocoaPods 是一个用来管理 Xcode 依赖库的项目,通过 CocoaPods,我们可以直观集中和自动化地管理我们项目的第三方库. 本篇文章讲述如何将 framework 发布到 Co ...
互动白板的技术基础和发展
点击上方"LiveVideoStack"关注我们作者 | 伍双策划 | 包研.Alex 编辑 | Alex 互动白板年终盘点 #005# 最近互动白板「Miro」获得4亿美元 ...
iOS技术周报－第28期
iOS技术周报第28期访问iOS wiki(www.ios-wiki.com)获得更多内容. 欢迎大家投递关于iOS的新闻.技术.代码等文章,@吴发伟Ted即可. 关注微信公众账号:iOS技术分享 ...
【线上分享】互动协作白板与音视频实时同步技术实践
在线教育不同于线下教学,内容与互动更多是通过电子白板的方式呈现,互动白板已逐渐成为在线教育产品不可或缺的组成部分.而在实际应用中,受网络环境影响,设备性能.教学方式差异等多种条件的约束,仍存在白板与音 ...
视频会议直播中实现Web实时互动白板功能｜Demo分享
超级白板功能概述即构超级白板(ZegoSuperBoard),基于即构亿级海量用户的实时信令网络,提供完整的多人实时在线白板互动协同服务,包括:白板涂鸦.实时轨迹同步.文档共享.文件转码.白板录制与 ...