みなさん、こんにちは。私は @小曾学习です。Shengwang の RTE 開発者コミュニティの著者です。
iOS プラットフォームに音声通話とビデオ通話を実装し、音声通話とビデオ通話に仮想背景を追加する場合は、この記事を参照してください。Swift 言語を使用し、Acoustics SDK を統合してオーディオとビデオの呼び出しを実装し、enableVirtualBackground インターフェイスを呼び出して仮想背景を追加します.友人、急いで Xiao Zeng と練習してください.
この記事は主に、Agora iOS SDK を統合し、簡単なオーディオとビデオのデモを実現し、デモで仮想背景機能を実現することを目的としています。また、仮想背景画像のインポート時に発生するいくつかの問題や、関連する API の呼び出し姿勢も含まれます。ステップバイステップに従うと、独自のオーディオとビデオのデモを実現できます. 質問がある場合は、コメントするか、プライベートメッセージを残すこともできます.
01 下準備
iOS プラットフォームのオーディオとビデオのデモを実装する前に、次の準備が必要です。
• Xcode
• Shengwang アカウントを登録し、Shengwang APPID、一時的なトークンを申請します。詳細については、 Shengwang プラットフォームの使用を開始するを参照してください。
Shengwang アカウントをまだ持っていない場合は、記事の最後にあるリンクから無料で登録できます。各アカウントには、1 か月あたり 10,000 分の無料割り当てがあります。個人的な学習/デバッグであれば、時間は十分にあります。
クライアントがチャネルに参加するときにユーザーを認証するために主に使用され、24 時間有効な一時トークンに注意してください。
Xiao Zeng の個人的な開発およびテスト環境は次のとおりです。
• MacBook Pro
• Xcode: v 14.2
• SoundNet SDK: 4.1.1、SDK のダウンロードについては、この記事の最後にあるリファレンスを参照してください
• Apple Developer Account
02 戦闘
この演習では、オーディオとビデオの呼び出しを実装し、enableVirtualBackground インターフェイスを呼び出して仮想背景機能を追加する手順を順を追って説明します。
2.1 プロジェクトを作成する
(1) iOS プロジェクトを作成する
Xcode を開く——新しい Xcode プロジェクトを作成する——iOS モジュールの下の APP を選択すると、次のインターフェイスが表示されます。 、Apple Developers の公式 Web サイトにアクセスして、無料で登録できます。
(2) [次へ] をクリックすると、次のインターフェイスが表示されます. デモが iOS 13.0 以上をサポートしていることを示す最小展開数を 13.0 として選択します. バーチャル バックグラウンド機能は iOS 13 以上のみをサポートすることに注意してください.
(3) メディア デバイスのアクセス許可を追加する
[情報] 列をクリックし、カメラとマイクのアクセス許可を追加し、[+] 記号をクリックして [プライバシー - カメラの使用方法の説明]、[プライバシー - マイクの使用方法の説明] をそれぞれ選択します。権限を追加しないと、デモをクリックしたときにクラッシュの問題が発生します。
(4) ターミナルを開き、ルート ディレクトリ VideoCall_ios に入り、コマンド pod init を入力して実行します。このとき、ディレクトリに Podfile ファイルが生成されます。Podfile ファイルを編集し、統合されたサウンド ネットワーク sdk を示して入力しますpod 'AgoraRtcEngine_iOS','4.1.1’。
pod init
open -e Podfile
(5) SDKのインストール
ターミナルにルートディレクトリを入力し、コマンドpod installを入力して実行すると、cocoapodsを介してAcoustics SDK が自動的にダウンロードされます. Pod installation complete!と表示されたら、インストールが成功したことを意味します.ルート ディレクトリに追加の{project}.xcworkspaceファイルがあり、このファイルでは、プロジェクト ファイルと、インストールしたばかりの Pod 依存ライブラリが同時に読み込まれ、2 つが関連付けられます。さらに操作を行うには、Xcode でファイルを開きます。
2.2 音声通話とビデオ通話を実現する
このセクションでは主に、Agora Video SDK を使用して、iOS プラットフォームでオーディオとビデオの呼び出しを実装する方法を紹介します。次のコード実装は、ViewController.swiftファイルに入力されます。
(1) SoundNet キットのインポート
import AgoraRtcKit
//自3.0.0版本起，AgoraRtcEngineKit 类名更换为 AgoraRtcKit
(2) 基本的なユーザー インターフェイスを作成し、インターフェイスを初期化します。
ViewControllerクラスでユーザー インターフェイスを作成し、初期化する
class ViewController: UIViewController{
// 定义本地视图变量
var localView: UIView!
// 定义远端视频变量
var remoteView: UIView!
// 定义 agoraKit
var agoraKit: AgoraRtcEngineKit!
// 设置视频窗口布局
override func viewDidLayoutSubviews(){
super.viewDidLayoutSubviews()
remoteView.frame = self.view.bounds
localView.frame = CGRect(x: self.view.bounds.width - 180, y:0, width: 180, height: 230)
}
func initView(){
// 初始化远端视频窗口。
remoteView = UIView()
self.view.addSubview(remoteView)
// 初始化本地视频窗口。
localView = UIView()
self.view.addSubview(localView)
}
(3) AgoraRtcEngineKitの初期化
ViewController クラスで、AgoraRtcEngineKit オブジェクトをインスタンス化します。
//初始化引擎
func initializeAgoraEngine(){
let config = AgoraRtcEngineConfig()
// 在这里输入你的 App ID.
config.appId = "24bbaca4116c4b11b81cdf4cffdf41"
// 调用 AgoraRtcEngineDelegate
agoraKit = AgoraRtcEngineKit.sharedEngine(with: config, delegate: self)
}
(4) チャンネルに参加する
チャネルへの参加は、音声通話とビデオ通話を実装するために必要な手順であり、 agoraKit.joinChannel(byToken:channelId:info:uid:joinSuccess:)メソッドを呼び出す必要があります。
注: YOUR_TOKEN は、SoundWeb の公式 Web サイトで生成したトークンであり、YOUR_CHANNEL_IDは、自分で定義したチャネル ID です. チャネルは、リアルタイムのオーディオおよびビデオ データを送信する専用のチャネルとして理解できます. uidはチャンネル内のユーザー ID です。0 は、自動生成されたユーザー ID を使用することを意味します。
func joinChannel(){
let option = AgoraRtcChannelMediaOptions()
// 在视频通话场景下，将频道场景设置为 liveBroadcasting
option.channelProfile = .liveBroadcasting
// 设置用户角色为主播
option.clientRoleType = .broadcaster
// 使用临时 token 加入频道，在这里传入你的项目的 token 和频道名。
agoraKit?.joinChannel(byToken: "007eJxTYezdV5FYj92Eh4WVzc+Yfl9sd4XNOyPb1it1+3nGPwt4rMBiZJCUlJieaGBqaJZskGRomWRgmp6SZJKelAUlDI/PFnAIpDYGMDDtmv2BkZIBAEJ+FoSo1L52BAQBbtCAO", channelId: "zeng", uid: 0, mediaOptions: option)
}
(5) ローカル ビデオ キャプチャとプレビューを有効にする
agoraKit.enableVideo()を呼び出してビデオ キャプチャを有効にし、agoraKit.enableAudio()を呼び出してオーディオ キャプチャを有効にし、agoraKit.startPreview()を呼び出してローカル プレビューを開始します。
func setupLocalVideo(){
// 启用视频模块
agoraKit?.enableVideo()
agoraKit?.enableAudio()
// 开始本地预览
agoraKit?.startPreview()
let videoCanvas = AgoraRtcVideoCanvas()
videoCanvas.uid = 0
videoCanvas.renderMode = .hidden
videoCanvas.view = localView
// 设置本地视图
agoraKit?.setupLocalVideo(videoCanvas)
}
(6)チャンネルから退出する
func leaveChannel() {
// Step 1, release local AgoraRtcVideoCanvas instance
agoraKit.setupLocalVideo(nil)
// Step 2, leave channel and end group chat
agoraKit.leaveChannel(nil)
AgoraRtcEngineKit.destroy()
}
(7) リモートユーザービデオの設定
クラス拡張機能を実装するには、extension キーワードを使用します。
extension ViewController: AgoraRtcEngineDelegate{
// 监听 didJoinedOfUid 回调
// 远端主播加入频道时，会触发该回调
func rtcEngine(_ engine: AgoraRtcEngineKit, didJoinedOfUid uid: UInt, elapsed: Int){
let videoCanvas = AgoraRtcVideoCanvas()
videoCanvas.uid = uid
//渲染模式 采用hidden
videoCanvas.renderMode = .hidden
videoCanvas.view = remoteView
// 设置远端视图
agoraKit?.setupRemoteVideo(videoCanvas)
}
}
(8) ビューを読み込んで画面をレンダリングする
ViewController クラスにviewDidLoad関数を実装する
override func viewDidLoad() {
super.viewDidLoad()
// 当加载视图后，你可以进行其他其他设置。
// 初始化视频窗口函数
initView()
// 当调用声网 API 时，以下函数会被调用
initializeAgoraEngine()
setupLocalVideo()
joinChannel()
}
(9) デモを実行する
実行ボタンをクリックし、適切なテスト マシンを選択して、デモを実行します。デバッグには実際の iPhone 13 を使用します。
デモを開始するときは、最初に APP を信頼する必要があります。[設定] - [一般] - [VPN とデバイスの管理] - [APP を信頼する] に移動します。
2.3 バーチャル背景機能の実現
The SoundNet Video SDK provides the enableVirtualBackground interface. 仮想背景機能を使用すると、カスタム背景画像を使用して、ローカル ユーザーの元の背景画像を置き換えたり、背景をぼかすことができます。仮想背景機能を正常に有効にすると、チャネル内のすべてのユーザーがカスタマイズされた背景を見ることができます。
enableVirtualBackgroundメソッドは、 enableVideoまたは startPreviewの後に呼び出されることに注意してください。また、このメソッドは仮想背景動的ライブラリAgoraVideoSegmentationExtension.xcframeworkに依存しており、この動的ライブラリが削除された場合、この機能は正常に有効にできません。動的ライブラリは、Pods ディレクトリで表示できます。
enableVirtualBackgroundメソッドでは、3 つのパラメーターを渡す必要があります。
enable: 仮想背景を有効にするかどうかを示します。値は true または false です。
backData: カスタム背景画像を示します
segData: 背景画像の処理プロパティを示します
具体的な実装は次のとおりです。
(1) 背景画像のアップロード
プロジェクトを右クリック - 「VideoCall_ios」にファイルを追加 - プロジェクトに追加する画像を選択します。カスタム背景画像は PNG および JPG 形式をサポートしていることに注意してください。
画像を追加した後、画像を右クリックして [File Inspector] を表示し、インターフェイスの右側で画像の [タイプ] を [データ] に変更します。デフォルト値が選択されている場合、カスタム背景は有効になりません。
(2) ロジックコードの実装
setupLocalVideo関数とagoraKit?.startPreview()メソッドの後に、仮想背景を追加し、Bundle.main.path()メソッドを使用してテキスト ファイルを開きます。
let source = AgoraVirtualBackgroundSource()
source.backgroundSourceType = .img
source.source = Bundle.main.path(forResource: "test", ofType: "png")
agoraKit.enableVirtualBackground(true, backData: source, segData: nil)
その中で、agoraKit.enableVirtualBackground()は戻り値があり、0 は呼び出しが成功したことを意味し、0 未満の場合は呼び出しが失敗したことを意味します。特定の戻り値の情報については、enableVirtualBackgroundを参照してください。
(3) デモ表示
デモを実行した後、ビデオの背景がカスタム画像に置き換えられました
03 まとめ
この記事では主に、Swift 言語、統合された Acoustics SDK を使用してオーディオとビデオの呼び出しを実装し、enableVirtualBackground インターフェイスを呼び出して仮想背景を追加する方法について説明します。プロジェクトの構築からインターフェイスの呼び出し、デモ操作まで詳しく解説されており、遭遇した問題も詳しく解説されています。不明な点がある場合は、 Shengwang の公式 Web サイトでクイック スタートを参照できます。(注: この記事のデモ ソース コードは、個人の github に配置されています)
参考文献
• csdn