在上一篇Agora iOS SDK-開始聊天介紹了如何使用Agora SDK進(jìn)行一對一的聊天，這篇主要介紹下如何使用Agora iOS進(jìn)行多人聊天江掩，需要實現(xiàn)的功能：
- 隨著加入人數(shù)的變化，而顯示不同的UI抽兆，主要是分屏
- 在多屏顯示的情況下蹭沛，點擊一個小窗排截，會放大顯示該聊天窗
- 前篇實現(xiàn)的聊天功能
實現(xiàn)上面所說的功能:分屏，最好的方式是使用瀑布流布局挠蛉，這樣可以滿足分屏的需要祭示。
瀑布流
分屏顯示最好的方式是采用瀑布流，這樣比較方便的能夠適應(yīng)UI的變化谴古。
瀑布流的實現(xiàn)方式比較多质涛，常用的方式是使用UICollectionView實現(xiàn)，自定義一個UICollectionViewLayout掰担。UICollectionViewLayout是向UICollectionView提供布局信息汇陆，也包括對于視圖的布局信息。需要重載UICollectionViewLayout的以下方法：
- collectionViewContentSize 返回內(nèi)容的大小
- (UICollectionViewLayoutAttributes *)layoutAttributesForItemAtIndexPath:(NSIndexPath *)indexPath 根據(jù)位置反饋cell對應(yīng)的布局屬性
- (NSArray<UICollectionViewLayoutAttributes *> *)layoutAttributesForElementsInRect:(CGRect)rect 恩敌，Cell的布局方式
- prepareLayout 初始化方法
具體的實現(xiàn)可以參考https://github.com/LD1314/LDWaterflowLayout瞬测，該demo中也會使用該實現(xiàn)。
有了一個已經(jīng)實現(xiàn)的瀑布流之后，下面就可以實現(xiàn)分屏了月趟。需要引入LDWaterflowLayout灯蝴。
動態(tài)聊天窗
新建一個ViewController類，命名為MutilChatViewController孝宗，用來做分屏顯示的需求穷躁，在Agora SDK中一個遠(yuǎn)程視頻的顯示只和該用戶的uid有關(guān)，所以使用的數(shù)據(jù)源只需要簡單定義為包含uid即可因妇，定義為：
public var dataArray:Array<UInt>?=Array<UInt>();
在Agora的委托AgoraRtcEngineDelegate中當(dāng)一個用戶加入聊天之后會觸發(fā)它的一個方法问潭，實現(xiàn)該方法，把用戶的uid加入dataArray中:
func rtcEngine(_ engine: AgoraRtcEngineKit!, didJoinedOfUid uid: UInt, elapsed: Int) {
if(!(dataArray?.contains(uid))!){
dataArray?.append(uid)
collectionView.reloadData()
}
}
對于瀑布流的實現(xiàn)需要MutilChatViewController繼承:
- UIViewController
- UICollectionViewDataSource
- LDWaterflowLayoutDelegate
其中LDWaterflowLayoutDelegate就是瀑布流的委托婚被，重寫它的兩個方法就可以實現(xiàn)分屏:
- columnCount(in waterflowLayout: LDWaterflowLayout!) -> CGFloat
該方法用來指定一行顯示幾個元素狡忙，這里采用比較簡單的方式當(dāng)只有一個1個用戶的時候就顯示在一行，2個用戶的時候就在一行顯示2個元素...4個用戶的時候就顯示為2行... - waterflowLayout(_ waterflowLayout: LDWaterflowLayout!, heightForItemAt index: UInt, itemWidth: CGFloat) -> CGFloat
該方法用來設(shè)定每個元素的高度址芯，也是采用比較簡單的方式灾茁，只用1行的時候高度為300，有2行的時候高度為150谷炸，3行的時候高度為100北专。
把分屏的布局寫好之后，就可以在每一個UICollectionViewCell上播放聊天視頻了旬陡。
播放聊天視頻
新建一個類ChatCell它繼承了UICollectionViewCell拓颓，在ChatCell中有兩個組件：videoView: UIView!和labelUser: UILabel!，前者用來顯示用戶視頻描孟，后者用來顯示用戶信息驶睦，videoView布局在整個ChatCell上，隨著ChatCell的變化而變化画拾。
要在ChatCell中播放聊天視頻啥繁，必須在ChatCell持有AgoraRtcEngineKit的變量，因此需要ChatCell聲明AgoraRtcEngineKit的變量青抛，并且在實例化ChatCell之后給該變量賦值：
public var agora :AgoraRtcEngineKit!
之前說過播放遠(yuǎn)程用戶的只需要實例化一個AgoraRtcVideoCancas之后再把uid賦值給它就可以了旗闽，而播放本地視頻也是類似的方法，還需要區(qū)分一個用戶是自己還是遠(yuǎn)程用戶蜜另，因此需要傳入當(dāng)前用戶的uid适室，在ChatCell中定義方法用來播放視頻:
func setUid(uid:UInt,localUid:UInt){
labelUser.text=String(uid)
let videoCanvas = AgoraRtcVideoCanvas()
videoCanvas.uid=uid
videoCanvas.view=videoView
videoCanvas.renderMode = .render_Fit
if(uid != localUid){
agora.setupRemoteVideo(videoCanvas)
}else{
agora.setupLocalVideo(videoCanvas)
}
}
這樣在多人聊天的時候就能使用分屏的方式播放用戶聊天視頻了，如果想放大某一個用戶的視頻該怎么辦呢举瑰？
放大顯示
當(dāng)用戶點擊某一個UICollectionViewCell的時候捣辆，希望對應(yīng)的視頻能夠放大顯示。因為一個視頻的播放只能顯示在一個view上面此迅，所以必須在點擊一個UICollectionViewCell的時候把它的播放顯示移除掉汽畴，在放大區(qū)域播放該聊天視頻旧巾，為了預(yù)留足夠空間顯示放大的時候，還需要調(diào)整UICollextionViewCell的高度忍些，給放大顯示預(yù)留出足夠的空間鲁猩。
因此首先我們在MutilChatViewController中新增一個顯示放大區(qū)域的view：
@IBOutlet weak var remoteView: UIView!
在放大視頻的時候，不知道用戶是需要放大自己的視頻罢坝，還是放大遠(yuǎn)程用戶的視頻廓握，因此首先要記錄下用戶自己的uid，在點擊的時候拿到用戶的uid嘁酿，再判斷是顯示本地視頻還是遠(yuǎn)程用戶的視頻隙券，放大視頻方法：
func setupVideo(uid:UInt){
if(self.remoteView.isHidden){
self.remoteView.isHidden=false
}
let videoCanvas=AgoraRtcVideoCanvas()
videoCanvas.uid=uid
videoCanvas.view=remoteView
videoCanvas.renderMode = .render_Fit
if(uid==localUid){
agoraKit.setupLocalVideo(videoCanvas)
}else{
agoraKit.setupRemoteVideo(videoCanvas)
}
}
當(dāng)用戶觸發(fā)點擊事件的時候使用變量isSelect記錄用戶的點擊行為，如果用戶有點擊行為的時候闹司，在判斷Cell高度的時候就返回和Cell寬度一樣的值（這里只是在demo的情況做的考慮娱仔，如果實際使用中還要根據(jù)Cell的個數(shù)進(jìn)行顯示高度的考慮）,判斷高度方法：
func waterflowLayout(_ waterflowLayout: LDWaterflowLayout!, heightForItemAt index: UInt, itemWidth: CGFloat) -> CGFloat {
let count:Int=(dataArray?.count)!
if(self.isSelect!){
return itemWidth
}
....
}
這樣就可以在用戶點擊某一個Cell的時候進(jìn)行放大顯示的處理，在上一篇文章中游桩，介紹了使用reportAudioVolumeIndicationOfSpeakers監(jiān)聽是誰在說話拟枚，如果真實的項目中，在每一個Cell中可以做一個小廣播众弓，在某一個用戶說話的時候，可以通過小廣播的變化進(jìn)行標(biāo)識隔箍。
這里使用Agora SDK做了一個簡短的demo谓娃，后續(xù)的還會繼續(xù)完善，利用Agora SDK模仿Housparty的功能實現(xiàn)比較簡單蜒滩，先要產(chǎn)品化還有很多的東西要做滨达，在這里先做一個簡單的總結(jié)吧！
Agora SDK使用總結(jié)
Agora提供了高質(zhì)量的視頻通信SDK俯艰，覆蓋了主流的操作系統(tǒng)捡遍，集成效率也比較高，而且還支持多個模式的視頻通話竹握，包括聊天画株，會議，直播等功能啦辐。SDK中API設(shè)計基本能夠滿足大部分的開發(fā)需要谓传，而且隱藏了底層開發(fā)，這樣對于應(yīng)用層的開發(fā)者來說十分友好芹关。非常適合有視頻聊天開發(fā)需求的開發(fā)者续挟。在視頻領(lǐng)域創(chuàng)業(yè)大爆發(fā)的今天，建議更多的想要從事該領(lǐng)域的開發(fā)者可以嘗試下侥衬。
在使用Agora iOS SDK的過程中有兩個建議希望廠商可以考慮下:
- 支持 Cocoapods诗祸，不支持Cocoapods需要在集成的時候在依賴上面花費時間跑芳，而且以后升級也不是太容易。
- 希望可以提供基礎(chǔ)UI的SDK直颅，就像友盟的分享SDK一樣博个，提供一套可用的帶UI的SDK，當(dāng)然還要允許用戶定制际乘，這樣應(yīng)用層的開發(fā)者集成效率會更高坡倔。
參考文檔:https://docs.agora.io/cn/user_guide/API/ios_api.html
demo地址:https://github.com/jjz/agora-swift
