当前位置：首页 > news >正文

实现鸿蒙（HarmonyOS）视频聊天、屏幕分享

news 2026/5/12 10:47:26

　随着搭配原生鸿蒙（HarmonyOS）系统的电脑和手机越来越普及，之前实现的安卓版视频聊天屏幕分享的Demo，现在有必要实现一个鸿蒙版了，该鸿蒙版的Demo可以与之前的安卓版和PC版互通的。

　现在，我们来看看具体的实现过程，文末有Demo源码可以下载。

一. 开发环境

开发工具：DevEco Studio 6.0

开发语言：ArkTS

测试手机：华为 Mate 60 Pro

HarmonyOS：6.0.0

screenshot_20260130_142928

二．功能介绍

鸿蒙手机端登录成功后，运行的主界面如下图所示：

IMG_1768891881_009

1. 视频聊天

（1）每个登录的用户都可向其他任意在线用户发送视频聊天请求。

（2）当收到来自其他在线用户的视频聊天邀请时，可接受或拒绝对方的请求。

（3）当接受其他在线用户的视频聊天邀请时，即可开启视频聊天。

2. 屏幕分享

（1）每个登录的用户都可向其他任意在线用户发送屏幕分享请求；当对方未响应时，可主动取消屏幕分享请求。

（2）当收到来自其他在线用户请求屏幕分享时，可接受或拒绝对方的请求。

（3）当发送方收到其他在线用户同意屏幕分享时，即可观看对方的屏幕。

三．具体实现

下面我们讲一下Demo中核心的代码实现，

1.自定义消息类型 InformationTypes

export enum informationType{/*** 视频请求* */VideoRequest = 0,/***  对方同意连接摄像头* */VideoResult = 1,/***  通知对方 挂断 视频连接* */CloseVideo = 2,/***  通知好友 网络原因，导致 视频中断* */NetReasonCloseVideo = 3,/*** 通知对方(忙线中) 挂断 视频连接* */BusyLine = 4,/*** 远程桌面请求* */DesktopRequest = 5,/***  回复远程桌面请求的结果* */DesktopResult = 6,/*** 主动取消远程桌面请求* */CancelDesktop = 7,/*** 对方（主人端）主动断开远程桌面* */OwnerCloseDesktop = 8,/*** 客人端断开远程桌面连接* */GuestCloseDesktop = 9
}

2. 发送视频请求

（1）当发起视频聊天时，将显示视频聊天窗口,并发送视频连接请求

//获取到多媒体管理器
@State multimediaManager: IMultimediaManager = MultimediaManagerFactory.GetSingleton();
Button("请求视频会话").type(ButtonType.Normal).borderRadius(5).backgroundColor("#DBDCDE").fontColor(Color.Black).fontWeight(300)
.onClick(()=>{
if(!this.pathStack) return;
//发送视频连接请求 
this.multimediaManager.sendCustomizedMessage(this.connectID,informationType.VideoRequest,[],'')
//跳转到视频请求页面
this.pathStack.pushPath({ name:"video" ,param:this.connectID})
})

（2）连接自己的摄像头，预览自己的视频

//只需要在模板层调用这个组件，就会连接到自己的摄像头
CameraPreview()

（3）当发送聊天邀请时，将显示视频邀请窗口

IMG_1768892392_012

3. 回复对方视频请求

（1）当收到对方的视频聊天邀请时，将显示视频邀请窗口

IMG_1768892490_013

（2）发送回复视频聊天请求消息

//同意对方的视频邀请
//connectID - 对方的IDthis.multimediaManager.sendCustomizedMessage(this.connectID,informationType.VideoResult,[1],'')//拒绝对方的视频邀请
this.multimediaManager.sendCustomizedMessage(this.connectID,informationType.CloseVideo,[],'')

4. 收到对方视频请求的回复

//设置收到来自服务器或其它客户端的自定义消息
this.multimediaManager.setCustomizedMessageListener((srcUserID: string, msgType: number, msg: number[], tag: string)=>{//对方回复视频请求的结果if(msgType == informationType.VideoResult){const res = new Stream(msg)const bool = res.readBoolean()if(bool){//当对方回复同意时，将连接到对方的麦克风和摄像头，开始视频聊天会话this.isAnswer = true;}else{//否则直接挂断this.promptAction.showToast({message: `对方挂断`,duration: 1000})this.isAnswer = false;this.isOnVideo = false;this.connect2me = false;this.pageStack.removeByName("video")}}})

当对方回复同意时，将连接到对方的麦克风和摄像头，开始视频聊天会话：

 if(this.isAnswer){this.cameraConnector = new CameraConnector()this.microphoneConnector = new MicrophoneConnector()//设置摄像头的索引this.multimediaManager.setCameraDeviceIndex(this.switchCamera?1:0)//开始连接对方摄像头this.cameraConnector.beginConnect(this.connectID)//开始连接对方麦克风this.microphoneConnector.beginConnect(this.connectID)//启动定时器计时this.timer()}