使用移动端进行视频通话时,可能发生横竖屏切换,为了提供更好的观看体验,需要根据用户使用场景,对视频旋转方向进行相应设置,防止出现视频画面发生方向颠倒等问题。
你已经集成 v3.36 或更高版本的 RTC SDK,实现了基本的音视频通话。
支持渲染功能的 SDK 详见API 参考。
App 方向:App 方向即系统 UI 方向。App 的方向取决于开发者是否锁定 UI 以及用户是否关闭屏幕自动旋转。
重力方向:通过移动端设备内置的重力传感器,获取地球的重力方向数据。
Status Bar:移动端的系统状态栏,始终位于 App 界面上方。当 App 方向改变时,系统状态栏的位置也会改变。
屏幕自动旋转开关:打开时, App 方向和系统状态栏的位置将跟随设备旋转,用户可以在移动端系统控制栏中进行操作。
UI 锁定:由开发者进行设置。UI 锁定时,即使用户打开屏幕自动旋转,也无法旋转;不锁定时,App 方向将跟随设备旋转。
采集端采集和发送的视频帧,包括对视频帧进行旋转角度的信息。接收端渲染视频时,将按照与采集端相同的方式进行旋转。
我们提供 setVideoRotationMode
,在内部采集时设置旋转模式,约定旋转方向的参考系。旋转方向的参考系可以设置为 App 方向(默认)或重力方向。
接收端可以调用setRemoteVideoCanvas
调整视频帧的渲染模式,以下以fit
填充模式为例。在该模式下,SDK 不会对采集到的图像进行裁剪。
对前置摄像头、后置摄像头均有效。
对共享屏幕和自定义视频采集无效。
接收端的视频方向与录制、合流转推中的方向一致。
此时两种旋转模式下接收端表现一致。
采集端 | 接收端 |
---|---|
此时不同旋转模式的表现如下:
图示以接收端 UI 不锁定且屏幕自动旋转开启为例。接收端 UI 锁定或关闭屏幕自动旋转时,视频画面与状态栏的相对位置保持不变。
采集端 | 接收端(采集端设置旋转模式为 App 方向) | 接收端(采集端设置旋转模式为重力方向) |
---|---|---|
// 开启视频采集 rtcVideo.startVideoCapture(); // 设置旋转模式 rtcVideo.setVideoRotationMode(VideoRotationMode.FOLLOW_APP);
// 开启视频采集 self.rtcVideo?.startVideoCapture() // 设置方向 self?.rtcVideo?.setVideoRotationMode(rotation)
当 UI 锁定或自动旋转关闭,旋转模式设置为重力方向时,镜像功能沿设备握持方向左右翻转;旋转模式设置为 App 方向时,镜像功能沿 App 方向左右翻转。镜像功能的开启和使用参看镜像。
当视频帧朝向固定为 Portrait
或 Landscape
模式以后,因为 App 方向或者重力方向变化导致视频帧发生旋转时,本端贴纸特效的位置保持不变。
参考以下项目获取完整代码。
Android | iOS | Flutter | Unity |
---|---|---|---|
setVideoRotationMode | setVideoRotationMode | setVideoRotationMode | SetVideoRotationMode |