屏幕共享

功能介绍

在视频会话中为了提高沟通效率，可以将自己的屏幕内容分享给其他参与方观看。还支持在屏幕上进行标注，以及授权其他参与方进行远程控制。当屏幕共享者开启标注后，组件就进入标注模式。此时，房间内所有用户都可以进行标注，并观看他人标注的内容。
使用场景如下：

• 视频会议场景中，屏幕共享可以将讲话者本地的文件、数据、网页、PPT 等画面分享给其他与会人；
• 在线课堂场景中，屏幕共享可以将老师的课件、笔记、讲课内容等画面展示给学生观看。

共享端

1.权限声明

使用uni-app启动屏幕共享必须进行如下配置，如果uni-app仅作为观看端可不配置

• 安卓平台，在uni-app项目根目录下，创建AndroidManifest.xml文件，复制下面的配置

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" 
  package="io.dcloud.nativeresouce">
    <application>
        <activity
            android:name="com.rtc.screencapture.PermissionActivity"
            android:configChanges="orientation|uiMode|screenLayout|screenSize|smallestScreenSize|locale|fontScale|keyboard|keyboardHidden|navigation"
            android:launchMode="singleTop"
            android:screenOrientation="sensor" >
        </activity>
        <service android:name="com.rtc.screencapture.ScreenCaptureService"
            android:exported="false"
            android:enabled="true"
            android:foregroundServiceType="mediaProjection" />
    </application>
</manifest>

• iOS平台,如果需要屏幕共享共享功能，请配置rtcsdk-plugin目录下的ios-extension.json文件，具体配置如下

{
 "ScreenShareUpload.appex": {
   "identifier": "主工程bundleId.ScreenShareUpload",  
   "profile": "自己开发者账号创建的配置文件名，例如iosRTCSDKUniPluginScreenShareUploadadhoc.mobileprovision",   
   "frameworks": ["CloudroomReplayKitExt.framework","libc++.tbd”, “ReplayKit.framework"], 
   "plists": {"CFBundleDisplayName”: “这里可配置录制进程名称，默认为ScreenShareUpload"},
   "entitlements": {
     "com.apple.security.application-groups": "group.主工程bundleId"
   }
 }
}

2.创建屏幕共享观看组件

使用可视化UI组件进行屏幕共享显示和操作

• 使用组件

<rtcsdk-screen-view style="width: 750rpx;height:300rpx" />

相关API请参考：

• 屏幕共享组件

3.开始共享

• 接口调用：

//设置屏幕共享参数:帧率8，其他採用系統默认參數
const cfg = RTCSDK.getScreenShareCfg();
// 共享帧率
cfg.maxFps = 8;
// 共享码率
cfg.maxBps = 2000 * 1000;
// 配置共享参数
RTCSDK.setScreenShareCfg(cfg);

// 开始共享
RTCSDK.startScreenShare({
	title: "uni-app Demo",// 通知标题文字
	contentText: "正在进行屏幕共享"	// 通知内容
});

• 回调通知：

// 开启结果
RTCSDK.on("startScreenShareRslt", ({ sdkErr }) => {
	if (sdkErr == 0){
		//开启屏幕共享成功
    } else {
        //开启屏幕共享失败
    }
})

相关API请参考：

• setScreenShareCfg
• startScreenShare
• startScreenShareRslt
• notifyScreenShareStarted

4.停止共享

• 接口调用：

//主动停止屏幕共享
RTCSDK.stopScreenShare();

• 回调通知：

//主动停止屏幕共享的结果
RTCSDK.on("stopScreenShareRslt", ({ sdkErr }) => {
	if(sdkErr === 0) {
		//结束屏幕共享成功
	}
})

相关API请参考：

• stopScreenShare
• stopScreenShareRslt

观看端

1.创建屏幕共享观看组件

使用可视化UI组件进行屏幕共享显示和操作

• 使用组件

<rtcsdk-screen-view v-if="isMediaLayout" style="width: 750rpx;height:300rpx" />

相关API请参考：

• 屏幕共享组件

2.通知开始共享

• 回调通知：

//收到屏幕共享开启通知的处理，显示屏幕共享组件
RTCSDK.on("notifyScreenShareStarted", ({ userID }) => {
	this.isMediaLayout = true;
})
//收到屏幕共享结束通知的处理，销毁屏幕共享组件
RTCSDK.on("notifyScreenShareStopped", ({ userID }) => {
	this.isMediaLayout = false;
})
//收到屏幕共享标注开启通知
RTCSDK.on("notifyScreenMarkStarted", () => {

})
//收到屏幕共享标注结束通知
RTCSDK.on("notifyScreenMarkStopped", () => {

})

相关API请参考：

• notifyScreenMarkStarted
• notifyScreenMarkStopped
• notifyScreenShareStarted
• notifyScreenShareStopped