ビデオの回転

内容紹介

Tencent Real-Time Communication(TRTC)は、携帯電話のライブストリーミングのような縦画面による変化に乏しいユーザーエクスペリエンスとは異なり、横画面と縦画面という2つのユースケースを両立させることが必要です。このため、横画面と縦画面の処理ロジックを対応させる必要があります。ここでは主に、次の事項についてご説明します:
縦画面モードを実装する方法。例:WeChatのビデオ通話は典型的な縦画面体験モードです。
横画面モードを実装する方法。例:多人数インタラクティブオーディオビデオルームApp(XYLink(小魚易連)など)は多くの場合、横画面モードを採用しています。
ローカル画面およびリモート画面の回転方向およびフィルモードをカスタマイズする方法。




サポートしているプラットフォーム

iOS
Android
Mac OS
Windows
Electron
Web端末
×

縦画面モード

WeChatのビデオ通話のような体験モードを実装したい場合は、2つの作業を行ってください:

1. アプリのUIインターフェースを縦画面に設定する

iOSプラットフォーム
Androidプラットフォーム
XCodeのGeneral>Deployment Info>Device Orientationで直接設定することができます:


Appdelegateの supportedInterfaceOrientationsForWindowメソッドを実装することにより、設定することもできます:
- (UIInterfaceOrientationMask)application:(UIApplication *)application
supportedInterfaceOrientationsForWindow:(UIWindow *)window
{

return UIInterfaceOrientationMaskPortrait ;

}

説明:
CSDNに掲載されている、iOSの縦横画面の回転およびその基本的な適用方法という記事に、iOSプラットフォームで画面の向きに関する開発工程の一部を詳細に説明しています。
Androidプラットフォームでは、activityのscreenOrientation属性をportraitに指定することで、そのインターフェースを縦画面モードに指定することができます:
<activity android:name=".trtc.TRTCMainActivity" android:launchMode="singleTask" android:windowSoftInputMode="adjustPan"
android:screenOrientation="portrait" />


2. SDKで使用する縦画面解像度の設定

TRTCCloudを使用したsetVideoEncoderParamインターフェースにビデオコーデックパラメータを設定する場合は、resModeをTRTCVideoResolutionModePortraitに指定します。 サンプルコードは次のとおりです。
iOS
Android
TRTCVideoEncParam* encParam = [TRTCVideoEncParam new];
encParam.videoResolution = TRTCVideoResolution_640_360;
encParam.videoBitrate = 600;
encParam.videoFps = 15;
encParam.resMode = TRTCVideoResolutionModePortrait; //解像度モードを縦画面モードに設定

[trtc setVideoEncoderParam: encParam];

TRTCCloudDef.TRTCVideoEncParam encParam = new TRTCCloudDef.TRTCVideoEncParam();
encParam.videoResolution = TRTCCloudDef.TRTC_VIDEO_RESOLUTION_640_360;
encParam.videoBitrate = 600;
encParam.videoFps = 15;
encParam.videoResolutionMode = TRTCCloudDef.TRTC_VIDEO_RESOLUTION_MODE_PORTRAIT; //解像度モードを縦画面モードに設定
trtc.setVideoEncoderParam(encParam);


横画面モード

アプリに横画面のユーザーエクスペリエンスを提供する場合、縦画面モードと同様の作業を行う必要がありますが、手順1と2のパラメータに対応する調整を行うだけでOKです。 特に手順2では、TRTCVideoEncParamのresMode値は次のとおりとなります:
iOSプラットフォームではTRTCVideoResolutionModeLandscapeと指定してください。
AndroidプラットフォームではTRTC_VIDEO_RESOLUTION_MODE_LANDSCAPEと指定してください。

カスタマイズ制御

TRTC SDKにより提供された多数のインターフェース関数は、ローカルおよびリモートの画面の回転方向およびフィルモードをコントロールできます:
インターフェース関数
機能の役割
備考説明
setLocalViewRotation
ローカルプレビュー画面での時計回りの回転角度
時計回りの回転を90度、180度、270度という3方向でサポート
setLocalViewFillMode
ローカルプレビュー画面のフィルモード
トリミングか黒枠を残すか
setRemoteViewRotation
リモートビデオ画面での時計回りの回転角度
時計回りの回転を90度、180度、270度という3方向でサポート
setRemoteViewFillMode
リモートビデオ画面のフィルモード
トリミングか黒枠を残すか
setVideoEncoderRotation
エンコーダーを設定して出力した画面の時計回りの回転角度
時計回りの回転を90度、180度、270度という3方向でサポート




GSensorMode

画面の回転はレコーディングやCDN Relayed live streamingの調節に関するさまざまな項目に影響することを考慮すると、TRTC SDKはシンプルな重力センサーの自動調節機能を提供するだけであるので、TRTCCloudのsetGSensorModeインターフェースを介してオンにすることができます。
この機能は、現在180度の上下回転の自動調節のみをサポートしています。つまり、ユーザー自身の携帯電話が上下180度逆さまになっている場合、相手が見る画面の向きが変わらないように維持します(90度または270度回転への適応はまだサポートしていません)。この自動調節はエンコーダーの方向調整に基づいて実装されているため、レコーディングしたビデオやH5端末に表示されるビデオ画面も、元の向きを維持することができます。
ご注意:
重力センサーの自動調節のもう一つの実装ソリューションでは、各フレームのビデオ情報ごとに現在のビデオの重力方向を対応させた上で、リモートユーザー側でレンダリング方向を自動調節します。ただしこのソリューションでは、レコーディングしたビデオの向きと求めるビデオの向きの一致を維持させるために、追加でトランスコードリソースを導入する必要があるためお勧めできません。