uniIM/uni_modules/wrs-uts-webrtc/utssdk/app-ios/index.vue

<template>
	<view class="defaultStyles">
	</view>
</template>
<script lang="uts">
	/**
   * 引用 iOS 系统库
   * [可选实现，按需引入]
   */
	import {
		UIButton,
		UIControl
	} from "UIKit"

	/**
	 * 引入三方库
	 * [可选实现，按需引入]
	 *
	 * 在 iOS 平台引入三方库有以下两种方式：
	 * 1、通过引入三方库framework 或者.a 等方式，需要将 .framework 放到 ./Frameworks 目录下，将.a 放到 ./Libs 目录下。更多信息[详见](https://uniapp.dcloud.net.cn/plugin/uts-plugin.html#ios-平台原生配置)
	 * 2、通过 cocoaPods 方式引入，将要引入的 pod 信息配置到 config.json 文件下的 dependencies-pods 字段下。详细配置方式[详见](https://uniapp.dcloud.net.cn/plugin/uts-ios-cocoapods.html)
	 *
	 * 在通过上述任意方式依赖三方库后，使用时需要在文件中 import:
	 * 示例：import { LottieAnimationView, LottieAnimation, LottieLoopMode	} from 'Lottie'
	 */

	/**
	 * UTSiOS、UTSComponent 为平台内置对象，不需要 import 可直接调用其API，[详见](https://uniapp.dcloud.net.cn/uts/utsios.html)
	 */
	import { UTSComponent } from "DCloudUTSFoundation"
	import { RTCMTLVideoView } from "WebRTC"
	import { UTSWebRTC } from "./index.uts"
	import { expandToSuperView } from "./layout_utils.uts"

	//原生提供以下属性或方法的实现
	export default {
		data() {
			return {
				isFront: true
			};
		},
		/**
		 * 组件名称，也就是开发者使用的标签
		 */
		name: "wrs-uts-webrtc-view",
		/**
		 * 组件涉及的事件声明，只有声明过的事件，才能被正常发送
		 */
		emits: [],
		/**
		 * 属性声明，组件的使用者会传递这些属性值到组件
		 */
		props: {
			/**
			 * 字符串类型 属性：buttontext  需要设置默认值
			 */
			"userId": {
				type: String,
				default: ""
			}
		}, 
		/**
		 * 组件内部变量声明
		 */

		/**
		 * 属性变化监听器实现
		 */
		watch: {
			"userId": {
				/**
				 * 这里监听属性变化，并进行组件内部更新
				 */
				handler(newValue : String, oldValue : String) {
					this.refreshUserId()
				},
				/**
				 * 创建时是否通过此方法更新属性，默认值为false
				 */
				immediate: false
			},
		},
		/**
		 * 规则：如果没有配置expose，则methods中的方法均对外暴露，如果配置了expose，则以expose的配置为准向外暴露
		 * ['publicMethod'] 含义为：只有 `publicMethod` 在实例上可用
		 */

		methods: {
			refreshUserId() {
				if (this.userId.count > 0) {
					const supView = this.$el
					this.clearSubViews()
					let view = RTCMTLVideoView()
					view.videoContentMode = UIView.ContentMode.scaleAspectFill
					supView.addSubview(view)
					expandToSuperView(view)
					view.clipsToBounds = true
					const webRTC = UTSWebRTC.currentWebRTC
					if (webRTC != null) {
						const mediaStream = webRTC?.getMediaStream(this.userId)
						if (mediaStream != null) {
							let track = mediaStream?.videoTracks.first
							if (track != null) {
								track?.add(view)
							} else {
								console.log("video track is null")
							}
						} else {
							console.log("mediaStream is null")
						}
					} else {
						console.log("UTSWebRTC.currentWebRTC is null")
					}
				} else {
					// console.log(`userId is empty:${this.userId}`)
				}
			},
			renderRemoteVideo(userId : string) {
				this.userId = userId
				this.refreshUserId()
			},
			renderLocalVideo() {
				this.clearSubViews()
				let view = RTCMTLVideoView()
				view.videoContentMode = UIView.ContentMode.scaleAspectFill
				view.clipsToBounds = true
				const supView = this.$el
				supView.addSubview(view)
				expandToSuperView(view)
				
				const webRTC = UTSWebRTC.currentWebRTC
				if (webRTC != null) {
					const localVideoTrack = webRTC?.localVideoTrack
					if(localVideoTrack != null) {
						localVideoTrack?.add(view)
					} else { 
						console.log("localVideoTrack is null")
					}
					
				} else {
					console.log("UTSWebRTC.currentWebRTC is null")
				}
			},
			clearSubViews() {
				const supView = this.$el
				let subviews = supView.subviews
				const count = subviews.count
				for (let i : Int = 0; i < count; i++) {
					const view = subviews[i]
					view.removeFromSuperview()
				}
			},
			startCaptureLocalVideo(params : string) {
				let isFront = true
				let model = JSON.parse(params)
				if (model != null) {
					const json = model! as UTSJSONObject
					const isFrontValue = json["isFront"]
					if (isFrontValue != null) {
						isFront = isFrontValue! as boolean
					}
				}
				this.startCapture(isFront, true)
			},
			switchCamera(isFront : boolean) {
				this.startCapture(isFront, false)
			},
			stopCapture() {
				const webRTC = UTSWebRTC.currentWebRTC
				if (webRTC != null) {
					const videoCapturer = webRTC?.videoCapturer
					if (videoCapturer != null) {
						if (videoCapturer! instanceof RTCCameraVideoCapturer) {
							const capturer = videoCapturer! as RTCCameraVideoCapturer
							capturer.stopCapture()
						}
					}
				}
			},
			resumeCapture() {
				this.startCapture(this.isFront, false)
			},
			startCapture(isFront : boolean, addView : boolean) {
		
			},
			renderRemoteVideo000() {
				let view = this.$el
				const webRTC = UTSWebRTC.currentWebRTC
				if (webRTC != null) {
					// webRTC?.remoteVideoTrack?.add(view)
				}
			},
			getDevice(isFront : boolean) : AVCaptureDevice | null {
				const devices = RTCCameraVideoCapturer.captureDevices()
				const count = devices.count
				for (let i : Int = 0; i < count; i++) {
					let device = devices[i]
					if (isFront) {
						if (device.position == AVCaptureDevice.Position.front) {
							return device
						}
					} else {
						if (device.position == AVCaptureDevice.Position.back) {
							return device
						}
					}
				}
				return null
			}

			/**
			 * 内部使用的组件方法
			 */
		},


		/**
		 * 组件被创建，组件第一个生命周期，
		 * 在内存中被占用的时候被调用，开发者可以在这里执行一些需要提前执行的初始化逻辑
		 * [可选实现]
		 */
		created() {

		},
		/**
		 * 对应平台的view载体即将被创建，对应前端beforeMount
		 * [可选实现]
		 */
		NVBeforeLoad() {

		},
		/**
		 * 创建原生View，必须定义返回值类型
		 * 开发者需要重点实现这个函数，声明原生组件被创建出来的过程，以及最终生成的原生组件类型
		 * [必须实现]
		 */
		NVLoad() : UIView {
			let view = UIView()
			view.clipsToBounds = true
			return view
		},

		/**
		 * 原生View已创建
		 * [可选实现]
		 */
		NVLoaded() {
			this.refreshUserId()
			this.$emit("onLoadView")
		},
		/**
		 * 原生View布局完成
		 * [可选实现]
		 */
		NVLayouted() {

		},
		/**
		 * 原生View将释放
		 * [可选实现]
		 */
		NVBeforeUnload() { },
		/**
		 * 原生View已释放，这里可以做释放View之后的操作
		 * [可选实现]
		 */
		NVUnloaded() {

		},
		/**
		 * 组件销毁
		 * [可选实现]
		 */
		unmounted() { }

		/**
		 * 更多组件开发的信息详见：https://uniapp.dcloud.net.cn/plugin/uts-component.html
		 */
	}
</script>

<style>

</style>