RTC Engine
  • Overview
  • Web
    • Demo のクイックスタート
    • SDK クイックスタート
    • 基本機能
      • 画面共有
      • ライブブロードキャスト
      • メディアデバイス
      • 音量
      • エンコーディング構成ファイルの設定
      • ネットワーク品質の検出
      • 検出能力
    • 高度な機能
      • AI ノイズ低減の有効化
      • ミキシングを有効にします
      • ウォーターマークを有効にします
      • Enable Virtual Background
      • 美顔とエフェクトの有効化
      • データメッセージ
      • キャプチャーとレンタリングのカスタマイズ
    • インターフェースリスト
    • リリース説明
    • 対応するプラットホーム
    • Web に関するよくあるご質問
      • 複数人でのビデオ通話を最適化
      • 制限付き自動再生の処理
      • ファイアウォール制限への対応
      • その他
  • Android
    • Run Sample Code
    • Integration
    • インテグレーション
      • 7. ネットワーク品質の検出
      • 8. 画面共有の有効化
      • 9. ビデオ品質の設定
      • 10. ビデオの回転
    • Advanced Features
      • ネットワーク品質のテスト
      • キャプチャーとレンタリングのカスタマイズ
      • オーディオキャプチャーと再生のカスタマイズ
    • 顧客インターフェース
      • Overview
      • TRTCCloud
      • TRTCStatistics
      • TRTCCloudListener
      • TXAudioEffectManager
      • TXBeautyManager
      • TXDeviceManager
      • タイプ定義
      • 廃棄インタフェース
      • エラーコード
    • ソリューション
      • リアルタイムコーラス (TUIKaraoke)
        • クイックインテグレーション
        • 実施ステップ
        • 曲の同期
        • 歌詞の同期
        • 音声同期
        • ミクスストリーミングソリューション
        • TRTCKaraoke 関連インターフェース
        • よくあるご質問
    • リリース説明
  • iOS
    • Run Sample Code
    • Integration
    • インテグレーション
      • 7. ネットワーク品質の検出
      • 8. 画面共有の有効化
      • 9. ビデオ品質の設定
      • 10. ビデオの回転
    • Advanced Features
      • ネットワーク品質のテスト
      • キャプチャーとレンタリングのカスタマイズ
      • オーディオキャプチャーと再生のカスタマイズ
    • 顧客インターフェース
      • Overview
      • TRTCCloud
      • TRTCCloudDelegate
      • TRTCStatistics
      • TXAudioEffectManager
      • TXBeautyManager
      • TXDeviceManager
      • タイプ定義
      • 廃棄インタフェース
      • ErrorCode
    • ソリューション
      • クイックインテグレーション
      • 実施ステップ
      • 曲の同期
      • 歌詞の同期
      • 音声同期
      • ミクスストリーミングソリューション
      • TRTCKaraoke 関連インターフェース
      • よくあるご質問
    • リリース説明
  • macOS
    • Run Sample Code
    • Integration
    • インテグレーション
      • 7. ネットワーク品質の検出
      • 8. 画面共有の有効化
      • 9. パソコンサウンドの共有
      • 10. ビデオ品質の設定
      • 11. ビデオの回転
    • Advanced Features
      • ハードウェアデバイスのテスト
      • ネットワーク品質のテスト
      • キャプチャーとレンタリングのカスタマイズ
      • オーディオキャプチャーと再生のカスタマイズ
    • 顧客インターフェース
      • Overview
      • TRTCCloud
      • TRTCCloudDelegate
      • TRTCStatistics
      • TXAudioEffectManager
      • TXBeautyManager
      • TXDeviceManager
      • タイプ定義
      • 廃棄インタフェース
      • ErrorCode
      • リリース説明
    • リリース説明
  • Windows
    • Run Sample Code
    • Integration
    • インテグレーション
      • 7. ネットワーク品質の検出
      • 8. 画面共有の有効化
      • 9. ビデオ品質の設定
      • 10. ビデオの回転
    • Advanced Features
      • ハードウェアデバイスのテスト
      • ネットワーク品質のテスト
      • キャプチャーとレンタリングのカスタマイズ
      • オーディオキャプチャーと再生のカスタマイズ
    • 顧客インターフェース
      • Overview
      • ITRTCCloud
      • ITRTCStatistics
      • TRTCCloudCallback
      • ITXAudioEffectManager
      • ITXDeviceManager
      • タイプ定義
      • 廃棄インタフェース
      • エラーコード
    • リリース説明
  • Electron
    • インテグレーション
      • 1. インターフェースの例
      • 2. SDK のインポート
      • 3. ルームに入る
      • 4. オーディオ・ビデオストリームのサブスクリプション
      • 5. オーディオ・ビデオストリームのリリース
      • 6. ルームからの退出
      • 7. ネットワーク品質の検出
      • 8. 画面共有の有効化
      • 9. パソコンサウンドの共有
      • 10. ビデオ品質の設定
      • 11. ビデオの回転
    • 顧客インターフェース
      • Overview
      • エラーコード
  • Flutter
    • インテグレーション
      • 1. インターフェースの例
      • 2. SDK のインポート
      • 3. ルームに入る
      • 4. オーディオ・ビデオストリームのサブスクリプション
      • 5. オーディオ・ビデオストリームのリリース
      • 6. ルームからの退出
      • 7. ネットワーク品質の検出
      • 8. 画面共有の有効化
      • 9. パソコンサウンドの共有
      • 10. ビデオ品質の設定
      • 11. ビデオの回転
    • 顧客インターフェース
      • Overview
      • エラーコード
  • Unity
    • インテグレーション
      • 1. インターフェースの例
      • 2. SDK のインポート
    • 顧客インターフェース
      • Overview
      • エラーコード
  • QT
    • インテグレーション
      • 1. SDK のインポート
  • Overview
    • Overview
  • 概念
  • Features
  • 性能統計
  • 価格
    • 無料時間
    • RTC-Engine パッケージ
    • サブスクリプションパッケージ期間の課金説明
    • 従量課金
      • 音声・ビデオ時間の課金説明
      • クラウド録画の課金説明
      • ミックストランスコーディングとCDNへのリレーの課金説明
  • よくあるご質問
    • 初心者のよくあるご質問
    • マイグレーションガイド
      • Twilio Video から TRTC への移行
      • 課金
      • Features
      • UserSig
      • ファイアウォール制限
      • インストールパッケージを削減する方法
      • TRTCCalling Web 関連
      • オーディオ・ビデオの品質
      • その他
RTC Engine

10. ビデオの回転

内容紹介

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端末に表示されるビデオ画面も、元の向きを維持することができます。
ご注意:
重力センサーの自動調節のもう一つの実装ソリューションでは、各フレームのビデオ情報ごとに現在のビデオの重力方向を対応させた上で、リモートユーザー側でレンダリング方向を自動調節します。ただしこのソリューションでは、レコーディングしたビデオの向きと求めるビデオの向きの一致を維持させるために、追加でトランスコードリソースを導入する必要があるためお勧めできません。