在StackView中建立具有多个成员的视频聊天应用程序⎚

Agora的视频聊天SDK是启用多成员视频通话的最简单方法之一。 与竞争对手相比，Agora丰富的，低延迟的群聊建立在Agora的软件定义的实时网络之上，该技术利用算法来找到路由视频流呼叫的最佳方法！

在此基础教程中，您将使用Apple最新版本的全新编程语言Swift 5在iOS 12中启动并运行多成员视频聊天。 在您的应用中，您将实现以下基本功能：1）设置，2）加入频道，3）使用户静音/取消静音以及4）使用UIStackView缩放屏幕上多个成员的布局。

实现我们的关键是希望在单个视频通话中为多个成员安排视图，以便每当成员数量增加或减少时，布局就可以缩放！ 在您的实现中，将使用UIStackView的实例。

设置Agora的SDK

创建一个Agora帐户

1.导航到Agora的登录网站。

2.完成入职过程。 从** Projects> Project List **导航至仪表板。

3.复制您的应用程序ID。

4.为您的项目创建一个根目录。

如果找不到仪表板或应用程序ID，请查看Agora教程视频：

设置本地视频

配置视频可能会造成混淆，尤其是在使用模式等概念时。 但是，Agora的SDK确实非常容易。 画布就像艺术品一样，是用于UI的。

  func setupLocalVideo（）{ 
 让videoCanvas = AgoraRtcVideoCanvas（） 
  videoCanvas.uid = 0 
  videoCanvas.view = localVideo 
  videoCanvas.renderMode = .hidden 
  agoraKit.setupLocalVideo（videoCanvas） 
  } 

常量videoCanvas实例化了一个AgoraRtcVideoCanvas()实例，该实例的属性随后进行了设置。 为.uid分配0会随机分配用户ID。 将.renderMode分配.renderMode可以缩放视频的视图。 如果您从Main.storyboard调用我们的设置，则Main.storyboard的view属性将分配给localVideo属性。

最后，在viewDidLoad()调用setupLocalVideo() viewDidLoad() 。

代表扩展

您可以扩展代理的功能，实现解码方法，设置远程视频，监视脱机/联机或静音：

 扩展VideoCallViewController：AgoraRtcEngineDelegate { 
  func rtcEngine（_引擎：AgoraRtcEngineKit， 
  firstRemoteVideoDecodedOfUid uid：UInt，大小：CGSize，经过时间：Int）{ 
 如果（remoteVideo.isHidden）{ 
  remoteVideo.isHidden = false 
  } 

 让videoCanvas = AgoraRtcVideoCanvas（） 
  videoCanvas.uid = uid 
  videoCanvas.view = remoteVideo 
  videoCanvas.renderMode = .hidden 
  agoraKit.setupRemoteVideo（videoCanvas） 
  } 

 内部函数rtcEngine（_引擎：AgoraRtcEngineKit，didOfflineOfUid uid：UInt，原因：AgoraUserOfflineReason）{ 

  self.remoteVideo.isHidden = true 
  } 

  func rtcEngine（_引擎：AgoraRtcEngineKit，didVideoMuted静音：布尔，byUid：UInt）{ 

  remoteVideo.isHidden =静音 
  remoteVideoMutedIndicator.isHidden =！muted 
  } 
  } 

随着委托人功能的扩展，按钮的功能就剩下了。

纽扣

离开

设置“离开”按钮以离开频道。 这很简单，因为leaveChannel()方法是本机的。

  @IBAction func didClickHangUpButton（_ sender：UIButton）{ 
  LeaveChannel（） 
  } 

  func LeaveChannel（）{ 
  agoraKit.leaveChannel（nil） 
  hideControlButtons（） 
  UIApplication.shared.isIdleTimerDisabled = false 
  remoteVideo.removeFromSuperview（） 
  localVideo.removeFromSuperview（） 
  } 

通过将UITapGestureRecognizer实例放在视图顶部，使选择器可以单击按钮。

  func setupButtons（）{ 

  perform（#selector（hideControlButtons），使用：nil，afterDelay：8） 

 让tapGestureRecognizer = UITapGestureRecognizer（目标：自我，行动​​：#selector（VideoCallViewController.ViewTapped）） 
  view.addGestureRecognizer（tapGestureRecognizer） 
  view.isUserInteractionEnabled = true 
  } 

  func hideControlButtons（）{ 
  controlButtons.isHidden = true 
  } 

静音/取消静音

通过在我们的AgoraRtcEngineKit共享实例上调用muteLocalAudioStream()对音频进行静音/取消静音。

  @IBAction func didClickMuteButton（_发送者：UIButton）{ 
  sender.isSelected =！sender.isSelected 
  agoraKit.muteLocalAudioStream（sender.isSelected） 
  resetHideButtonsTimer（） 
  } 

多个会说话的人

在视图控制器内部，放置一个名为stackView类型的IBOutlet：

  @IBOutlet弱var stackView：UIStackView！ 

您可以利用view上的tags属性加载用于标识扩展中UIView()实例的uid ：

 让videoView = UIView（） 
  videoView.tag = Int（uid） 
  videoView.backgroundColor = UIColor.purple 
  stackView.addArrangedSubview（videoView） 

这些是会说话的头。 要在用户签名后移除会说话的头，请按以下方式实现didOfflineOfUid方法。

 内部函数rtcEngine（_引擎：AgoraRtcEngineKit，didOfflineOfUid uid：UInt，原因：AgoraUserOfflineReason）{ 
 后卫让view = stackView.arrangedSubviews.first（其中：{（view）-> Bool in 
 返回view.tag == Int（uid） 
  }）其他{返回} 
  stackView.removeArrangedSubview（视图） 
  } 

使用setupLocalVideo(uid: UInt)修改setupLocalVideo(uid: UInt) ：

 让videoView = UIView（） 
  videoView.tag = Int（uid） 
  videoView.backgroundColor = UIColor.orange stackView.addArrangedSubview（videoView） 

修改joinChannel()以调用setupLocalVideo(uid:uid) ：

 守护让_self =自我else {return} 

  DispatchQueue.main.async { 
  _self.setupLocalVideo（uid：uid） 
  } 

在extension将以下代码添加到firstRemoteVideoDecodedOfUid方法中：

  让 videoView = UIView（） 

  videoView.tag = Int（uid） 

  videoView.backgroundColor = UIColor.purple 

  让 videoCanvas = AgoraRtcVideoCanvas（） 

  videoCanvas.uid = uid 

  videoCanvas.view = videoView 

  videoCanvas.renderMode = .hidden 

  agoraKit.setupRemoteVideo（videoCanvas） 

  stackView.addArrangedSubview（videoView） 

最后，不要忘记将IBOutlet连接到情节提要。

⌘B和⌘R！

现在，您要做的就是构建并运行：andB和andR！ 瞧！ 您可能会觉得自己颠倒或侧身交谈！

怎么测试？

如果您想使用iOS应用程序自己的代码检查代码，请随时在GitHub上检查代码。 搜索talkingHeads否则可以将视图控制器代码从粘贴容器复制到您的应用程序中：https： talkingHeads 。 如果您想查看您的应用程序如何与Web一起使用，请在此处尝试我们方便的dandy Web应用程序：sidsharma27.github.io。

接下来要去哪里？

你去！ 在iPhone上运行该应用程序。 如果您想添加更多细粒度的功能，请查看我们的开发人员文档，其中涵盖了：安全密钥，统计数据，调整音量，调整音高和色调，旋转视频，设置相机焦点，共享屏幕或许多其他功能Agora iOS Video SDK原生。