画面共有 — React Native

カメラの代わりに)画面のビデオビューをソースとして使用するストリームを公開できます。

セッションに接続しているクライアントは、カメラをソースとするストリームを購読するのと同じように、画面共有ストリームを購読(および表示)することができます。

このトピックには以下のセクションが含まれます:

スクリーン共有ソースでストリームを公開する

画面共有のストリームを公開するには、 videoSource OTPublisherのプロパティ properties ~へ "screen":

<OTPublisher
  properties={{
    videoSource: 'screen',
  }}
/>

画面共有ストリームは、アプリケーションのビュー全体からビデオをキャプチャします。このため、ストリーム共有ストリームを公開するときに、ローカルクライアントで購読者を無効にしたい場合があります (購読者が公開ストリームに表示されないようにするため)。

出版に関する詳細については、以下を参照してください。 この開発者ガイド.

画面共有ストリームに登録する

カメラをソースとして使用するストリームに登録するのと同じ方法で、画面共有ビデオソースを使用するストリームに登録できます。参照 ストリームの購読.

をチェックすることで、ストリームが画面共有ストリームであることを検出できます。 videoType OTSessionのイベント・オブジェクトのプロパティ streamCreated イベントを設定する。スクリーン共有ストリームの場合、このプロパティは "screen":

<OTSession
  apiKey="the API key"
  sessionId="the session ID"
  token="the token"
  eventHandlers={{
    streamCreated: event => {
      console.log(event.videoType, 'stream created', event.streamId);
    }
  }}>
  { /* ... */ }
</OTSession>

OTSessionオブジェクトは streamPropertyChanged 他のクライアントのストリームのサイズが変更された際のイベント。これは、配信元クライアントが共有中のウィンドウ(Vonage Video WebクライアントSDKを使用するアプリ内のブラウザウィンドウなど)のサイズを変更した際に発生する可能性があります。この changedProperty イベント・オブジェクトの "videoDimensions".その stream.height そして stream.width イベントオブジェクトのこのプロパティには、動画の新しい幅と高さが格納されます。

<OTSession
  apiKey="the API key"
  sessionId="the session ID"
  token="the token"
  eventHandlers={{
    streamPropertyChanged: event => {
      console.log(event.stream.streamId, 'stream property', event.changedProperty, 'changed:', event.stream.height, event.stream.width);
    }
  }}>
  { /* ... */ }
</OTSession>

動画のサイズや videoType ストリームがUI上で対応するサブスクライバーのサイズや寸法を調整するための詳細。UI上のサブスクライバーのレイアウトをカスタマイズする方法の詳細については、以下を参照してください。 ストリームの購読.

特定の画面共有ストリームの動画パフォーマンスの最適化

ビデオ・コンテンツのヒントを設定すると、主にテキストまたはビデオ・コンテンツが含まれる画面共有ビデオの品質とパフォーマンスを向上させることができます。詳しくは 特定の状況下でビデオのパフォーマンスを向上させるビデオコンテンツのヒント設定.