ビデオ通話で話している人(アクティブスピーカー)を検知しよう!
こんにちは、あるいは、こんばんは。
今回はビデオ通話でのアクティブスピーカーの表示についてお話します!
前提
agoraの使用
説明
どのように検知すればいいのか、、
WebSDKの機能「ボリュームインジケータ」を使用します☆彡
こちらを設定することで、
会話中の全てのユーザーの話す音量を2秒ごとに報告してくれます。
音量はの範囲は0~100までの整数で、
公式では60を超えるユーザーが話していると説明されていますが、
使用している感覚としてはもう少し低め(55くらい)でもいいかな。と思います。
それでは設定方法ですが、
まずはボリュームインジケータの有効化を行います!
タイミングとしては、ビデオ通話の設定が一通り完了したあとに以下を実施します。
client.enableAudioVolumeIndicator();
これだけです。
あとは、以下を設定すれば、2秒ごとに音量を取得してくれます。
client.on("volume-indicator", volumes => {
volumes.forEach((volume, index) => {
// volume.level:0~100の音量数値
});
})
例えば、以下のように記載することで音量ごとの処理を表現できます!
client.on("volume-indicator", volumes => {
volumes.forEach((volume, index) => {
if (volume.level >= 55) {
// 音量55以上の場合の処理を記載
}
});
})
これで、アイコンの枠のデザインを変更することや、
手を挙げているマークを表示するなどいろいろできます!
会話中の音量をログに残しておいて誰が一番発言して、誰が一番静かだったかもわかっちゃいますね👀
今回は以上となります。
ありがとうございました!