Windows、iOS、Android デバイスでの画面共有 - ApsaraVideo Live

Alibaba Cloud は、リアルタイム音声・映像 (ARTC) SDK に基づいて、Windows、iOS、および Android を実行する異なるデバイスでの画面共有を実装しています。このトピックでは、ARTC SDK を使用して、少ないコードで画面共有を実装する方法について説明します。

ソリューションの概要

場合によっては、ストリーマーはライブストリーミング中に画面を共有したい場合があります。ARTC SDK は、画面共有のベストプラクティスを提供します。開発者は ARTC SDK の関連メソッドを呼び出して、画面共有を実装できます。これには、少量のコードのみが必要です。ARTC SDK は、Windows、iOS、および Android デバイスをサポートしています。

以下のセクションでは、ARTC SDK を使用して Windows、iOS、および Android で画面共有を実装する方法について説明します。

I. Windows

1. 画面共有

1.1 画面共有の開始

/*
* 画面の一部を共有します。
*/
/*
* 画面の一部を共有します。
*/
      RECT rc;
      ::GetWindowRect(::GetDesktopWindow(), &rc);

      AliEngineScreenShareRegion screenRegion;
      screenRegion.originX = (float)rc.left;
      screenRegion.originY = (float)rc.top;
      screenRegion.width = (float)(rc.right - rc.left);
      screenRegion.height = (float)(rc.bottom - rc.top);

      AliEngineScreenShareConfig config;

      config.isShareByRegion = false;
      config.shareRegion = screenRegion;
      
      mpEngine->StartScreenShareByScreenRegion(screenRegion, config);

1.2 画面共有の停止

mpEngine->StopScreenShare();

2. マルチウィンドウ共有

2.1 共有可能なすべてのウィンドウまたはデスクトップを列挙する

/*
 デスクトップまたはウィンドウを示す AliEngineScreenShareDesktop または AliEngineScreenShareWindow に mScreenShareType を設定できます。
*/

mScreenShareType = AliEngineScreenShareDesktop ; (or mScreenShareType = AliEngineScreenShareWindow ;)

/*
 mSourceId 以前に選択された ID。次のコードは、ComboBox リストにデータを入力します。
*/

mCurrentSourceList = mEngine->GetScreenShareSourceInfo(mScreenShareType);
  if (nullptr != mCurrentSourceList)
  {
      for (size_t i = 0; i < mCurrentSourceList->GetCount(); i++) {
        AliEngineScreenSourcInfo info = mCurrentSourceList->GetSourceInfo(i);

        /*
        * アプリケーション自体のウィンドウを共有したくない場合は、sourceIsSelf を使用して他のウィンドウと区別します。
        */
        info.sourceIsSelf 
        CString s = AliStringToCString(info.sourceName);
        lb->AddString(s);
        if (mSourceId == info.sourceId) {
          lb->SetCurSel(i);
        }
      }
      
      /*
      * デフォルトでは、最初のウィンドウまたはデスクトップが選択されています。ウィンドウまたはデスクトップの ID と名前が記録されます。
      */
      if (mSourceId.isEmpty() && lb->GetCount() > 0)
      {
        lb->SetCurSel(0);
        AliEngineScreenSourcInfo info = mCurrentSourceList->GetSourceInfo(0);
        mSourceId = info.sourceId;
        mSourceTitle = info.sourceName;
      }
  }

2.2 対応するウィンドウまたはデスクトップを共有する

msSourceId は、共有ウィンドウまたはデスクトップの ID で、上記の列挙メソッドから取得できます。
screenShareSource は構成を示します。

AliEngineScreenShareRegion  shareRegion ;
shareRegion.originX = 0.f;
shareRegion.originY = 0.f;
shareRegion.width = 640.f;
shareRegion.height = 480.f;
            
screenShareSource.isShareByRegion = true ;
screenShareSource.shareRegion =  shareRegion;

/*
* デスクトップを共有します。
*/
mpEngine->StartScreenShareByDesktopId(atol(msSourceId.c_str()), screenShareSource);

/*
* ウィンドウを共有します。
*/
mpEngine->StartScreenShareByWindowId(atol(msSourceId.c_str()), screenShareSource);

/*
* 共有ウィンドウまたはデスクトップの表示範囲を取得します。
*/
AliEngineScreenShareRegion region;
		mEngine->GetDesktopRegion(mSourceId, mSourceTitle, region);
		CString resolutionMsg;
		resolutionMsg.Format(_T("Resolution: %d x %d"), region.width, region.height);
		((CStatic*)GetDlgItem(IDC_STATIC_SCREEN_SOURCE_RESOLUTION))->SetWindowTextW(resolutionMsg);
		((CEdit*)GetDlgItem(IDC_EDIT_SHARE_REGION_X))->SetWindowTextW(std::to_wstring(mScreenShareSource.shareRegion.originX).c_str());
		((CEdit*)GetDlgItem(IDC_EDIT_SHARE_REGION_Y))->SetWindowTextW(std::to_wstring(mScreenShareSource.shareRegion.originY).c_str());
		((CEdit*)GetDlgItem(IDC_EDIT_SHARE_REGION_X2))->SetWindowTextW(std::to_wstring(mScreenShareSource.shareRegion.width).c_str());
		((CEdit*)GetDlgItem(IDC_EDIT_SHARE_REGION_Y2))->SetWindowTextW(std::to_wstring(mScreenShareSource.shareRegion.height).c_str());
	}

2.3 対応するウィンドウまたはデスクトップの共有を停止する

mpEngine->StopScreenShare();

II. iOS

1. アクセス方法

iOS で画面共有を実装するには、元のホストアプリケーションに基づいて App Extension を作成し、App Extension で AliScreenShare.framework を使用する必要があります。
新しく作成した App Extension をホストアプリケーションに埋め込み、App Extension に同じ App Groups を構成します。ホストアプリケーションに App Groups が構成されていない場合は、ホストアプリケーションのプロファイルに App Groups 機能を追加します。
ホストアプリケーションと App Extension のバンドル ID のプレフィックスは同じで、同じ開発証明書で署名されている必要があります。

2. ウィンドウまたはオーディオを共有する

    AliRtcScreenShareMode mode = AliRtcScreenShareNone;

 /*
 * ビジネス要件に基づいて、オーディオを共有するかどうかを指定します。
 */
    if (ctrl.shareVideo) {
      mode |= AliRtcScreenShareVideo;
    }
    
    if (ctrl.shareAudioApp) {
      mode |= AliRtcScreenShareAudioApp;
    }
    
    [strongSelf.engine startScreenShare:kAppGroup mode:mode];
    [strongSelf.engine setAudioShareAppVolume:ctrl.appPublishVolume];

3. ウィンドウまたはオーディオの共有を停止する

[strongSelf.engine stopScreenShare];

4. 設定を変更する

/* 関連するメソッドを呼び出し、パラメーター値を変更します。 */
if (ctrl.enablePublishScreenTrackConfig) {
   [strongSelf.engine setPublishVideoStreamAttribute:AliRtcVideoTrackScreen attr:@"range=mpu"];
} else {
    [strongSelf.engine setPublishVideoStreamAttribute:AliRtcVideoTrackScreen attr:@""];
}

/* 画面トラックを再公開します。この操作は、アップストリーミングを停止した後にのみ実行できます。 */
[strongSelf.engine stopScreenShare];

AliRtcScreenShareMode mode = AliRtcScreenShareNone;

if (ctrl.shareVideo) {
   mode |= AliRtcScreenShareVideo;
}

if (ctrl.shareAudioApp) {
   mode |= AliRtcScreenShareAudioApp;
}

[strongSelf.engine startScreenShare:kAppGroup mode:mode];
[strongSelf.engine setAudioShareAppVolume:ctrl.appPublishVolume];

III. Android

1. ウィンドウまたはオーディオを共有する

if (config.permitScreen && config.permitAudioShare) {
    mScreenShareMode = AliRtcEngine.AliRtcScreenShareMode.AliRtcScreenShareAllMode;
} else if (config.permitScreen) {
    mScreenShareMode = AliRtcEngine.AliRtcScreenShareMode.AliRtcScreenShareOnlyVideoMode;
} else if (config.permitAudioShare) {
    mScreenShareMode = AliRtcEngine.AliRtcScreenShareMode.AliRtcScreenShareOnlyAudioMode;
}
      
mAliRtcEngine.startScreenShare(null, mScreenShareMode);

2. ウィンドウまたはオーディオの共有を停止する

pubScreenCaptureResult = mAliRtcEngine.stopScreenShare();