Willy's Fish教學筆記』

 Agora 是一款能夠 Real-Time 即時溝通的工具

不論是多人遊戲、直播、通話…等，都能使用 Agora

想知道詳情的可以看這兩篇

Android Agora 介紹、入門教學、實作範例 Real-Time 直播、視訊、通話、互動遊戲 ( 一 ) 』Willy's Fish教學筆記

Android Agora 介紹、入門教學、實作範例 Real-Time 直播、視訊、通話、互動遊戲 ( 二 ) 』Willy's Fish教學筆記

( 建議先看過會比較好懂這一篇 )

而今天要講的是螢幕分享

如果是像 Line 那樣的一般通話的確是用不到螢幕分享

但若是像視議會議那種類型的 app 應該就會有此需求

可惜 Agora 並沒有一個特定的 method 可以做到這件事

所以只用 Agora 的 SDK 是沒辦法做到螢幕分享的

我們需要配合 Android 原生的錄製螢幕功能

將畫面錄下來之後

再利用 Agora 的 SDK 傳到目標端

其實和我們一開始做的視訊是一樣的功能

只是視訊是由 camera 補捉畫面

而螢幕分享是由 錄製 來取得畫面

那麼我們要怎麼去實作這一功能呢？

一、確認權限

<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-permission android:name="android.permission.CAMERA" />

別忘了在 Android 6 之後要再次讓 user 手動確認權限唷

二、ScreenShareModule

再來就是 init ScreenShareModule

private final ScreenShare.IStateListener mListener 
                          = new ScreenShare.IStateListener() {
    @Override
    public void onError(int error) {
        Log.e(LOG_TAG, "error happened: " + error);
    }

    @Override
    public void onTokenWillExpire() {
        Log.d(LOG_TAG, "Screen share service token will expire");
        //Replace the token with your valid token
        mSSInstance.renewToken(null); 
    }
};

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

。。。

    mSSInstance = ScreenShare.getInstance();
    mSSInstance.setListener(mListener);

    initAgoraEngineAndJoinChannel();
}

先提一下 ScreenShareModule

這是 Agora 將 Android 原生的螢幕錄製包起來的一個 Module

官方提供的 sample code 裡面有

而這段 code 就是建立一個 Listener 去監聽 Error or Token 的狀態而己

之後會用到這個 ScreenShare 做事

最後一行的 initAgoraEngineAndJoinChannel 則是我們的下一步

三、建立 Agora Engine 和加入頻道

private void initAgoraEngineAndJoinChannel() {
    initializeAgoraEngine();
    setupVideoProfile();
    setupLocalVideo();
    joinChannel();
}

這一段就不用再說啦，前一篇都有完整提到

請看這裡，點我看前一篇唷!!!

不過還有一些不同的地方

我在這邊給大家解釋一下

setupVideoProfile 的部份：

主要的差異在這裡

VideoEncoderConfiguration.ORIENTATION_MODE.ORIENTATION_MODE_FIXED_PORTRAIT

首先是螢幕的方向設定值為固定直立

mRtcEngine.setClientRole(Constants.CLIENT_ROLE_BROADCASTER)

再來是設定 role，表示我們是發送畫面出去的一端

Constants.CHANNEL_PROFILE_COMMUNICATION

最後記得要做 setChannelProfile 喔，本例是設為COMMUNICATION

setupLocalVideo 的部份：

VideoCanvas.RENDER_MODE_FIT

等比例填滿螢幕，長 or 寬不足的地方以黑色填充

另外還有 setupRemoteview 在這段 code 沒看到

但也不難，和上篇一樣的做法即可

到這裡為止，畫面的設定都已經好了

再來就是要如何運用一開始 init 的 ScreenShare 來開始分享了

四、開始分享螢幕

public void onScreenSharingClicked(View view) {
。。。
    if (button.isSelected()) {
        mSSInstance.start(getApplicationContext()
                , getResources().getString(R.string.agora_app_id)
                , null
                , getResources().getString(
                                     R.string.label_channel_name)
                , Constant.SCREEN_SHARE_UID
                , mVEC);
        。。。
    } else {
        mSSInstance.stop(getApplicationContext());
        。。。
   }
}

這是一個點擊後，可以開始 or 結束分享的 method 

可以看到包裝成 ScreenShare 後，在使用上滿方便的

將需要的 parameters 傳進去即可使用

以下為 parameters 的內容

public void start(Context context
, String appId
, String token
, String channelName
, int uid
, VideoEncoderConfiguration vec)

看名字應該都知道作用了

其中要注意的是 channelName & uid 在之後的配對接收上會使用到

參數的詳解在上一篇也有提到喔

最後說說 VideoEncoderConfiguration 這個參數

這是我們在 setupVideoProfile 就 init 好的影像設定

剛剛都有照著步驟的話，將其帶進來即可

做到這裡影像都送出去了，那接收端要怎麼接收呢？

有用 Web 接收的朋友們，記得要加

mRtcEngine.enableWebSdkInteroperability(true);

詳請參考上一篇的 Join a Channel

五、資源釋放

@Override
protected void onDestroy() {
    super.onDestroy();

    leaveChannel();
    RtcEngine.destroy();
    mRtcEngine = null;
    mSSInstance.stop(getApplicationContext());
}

最後記得把不用的資源釋放出來

以免造成 OOM 的 issue

下一章會講如何接收畫面，請點下方連結

Android Agora 介紹、入門教學、實作範例 sample --- 螢幕分享 Screen Sharing --- 接收畫面 ( 二 ) 』Willy's Fish教學筆記

資料來源：

https://docs.agora.io/en/Video/screensharing_android?platform=Android

https://developer.android.com/reference/android/media/projection/MediaProjection

https://github.com/AgoraIO/Advanced-Video/tree/master/Screensharing/Agora-Screen-Sharing-Android#agora-screen-sharing-android