anyRTC Zoom模式多人音視頻開發教程-iOS [附源碼]

應廣大開發者要求，寫一下用anyRTC多人視頻sdk來模仿zoom多人視頻樣式，如下開始正文：

GitHub地址

https://github.com/BoYuanZjq/ZoomDemo

anyRTC多人音視頻sdk提供了4中模式，其中一種模式爲zoom模式，咱們只須要在進會以前設置該種模式便可。

anyRTC SDK集成

集成sdk,是做爲一名合格的開發人員必備的技能，根據官方集成文檔集成便可。

1. pod集成

pod 'RTMeetEngine'

2. 添加必要權限

在Info.plist中添加以下權限

<key>NSCameraUsageDescription</key>
<string>項目須要訪問視頻</string>
<key>NSMicrophoneUsageDescription</key>
<string>項目須要訪問音頻</string>

3. 打開音頻可後臺運行 TARGETS->Capabilities->Background Modes->選中Audio,AirPlay,and Picture in Picture

4. 配置開發者信息

在AppDelegate.h文件中把相應的開發者信息替換一下, 配置項在官網建立應用中可查看

static NSString *developerID = @"xxx";
static NSString *token = @"xxx";
static NSString *key = @"xxx";
static NSString *appID = @"xxx";

而後在AppDelegate.m中調用配置方法便可

[AnyRTCMeetEngine initEngineWithAnyRTCInfo:developerID andAppId:appID andKey:key andToke:token];

至此，anyRTC SDK集成已經完畢，似不似如絲般順滑？接下來咱們就能夠愉快地和SDK玩耍了。

主頁面

在主界面，咱們須要檢查先Camera和Audio權限。

//受權相機
- (void)videoAuthAction
{
    [AVCaptureDevice requestAccessForMediaType:AVMediaTypeVideo completionHandler:^(BOOL granted) {
        NSLog(@"%@",granted ? @"相機准許":@"相機不許許");
    }];
}

//受權麥克風
- (void)audioAuthAction
{
    [AVCaptureDevice requestAccessForMediaType:AVMediaTypeAudio completionHandler:^(BOOL granted) {
        NSLog(@"%@",granted ? @"麥克風准許":@"麥克風不許許");
    }];
}

zoom多人視頻頁面

主頁面輸入會議號，點擊加入會議

zoom模式簡介

zoom多人視頻模式，是解決手機上同時渲染多路性能的問題而生，其中分爲三種場景

1. 駕駛模式：只接收音頻，不發送音視頻，發送音頻，根據客戶本身選擇。
2. 說話者模式：該模式，只顯示本身和當前正在說話的人，也能夠選中一我的員，進行雙人鎖定通訊。
3. 分屏模式：該模式每屏顯示4個圖像，包括本身，分屏顯示全部人。

該模式適合1~32人的大型音視頻會議，有效的解決了在服務器不合流的狀況下手機性能問題。

初始化RTMeetKit

- (void)initMeetKit {
    RTMeetOption *option = [RTMeetOption defaultOption];
    option.videoScreenOrientation =  RTC_SCRN_Auto;
    option.videoMode = AnyRTCVideoQuality_Low2;
    option.maxNum = 64;
    // 設置zoom 模式
    option.meetingType = AnyMeetingTypeZoom;
    self.meetKit = [[RTMeetKit alloc] initWithDelegate:self andOption:option];
    // 本身平臺用戶Id
    NSString *userID = [NSString stringWithFormat:@"%d",arc4random()%10];
    //加入房間
    [self.meetKit joinRTC:self.meetId andIsHoster:NO andUserId:userID andUserData:@"{}"];
    //打開網絡檢測
    [self.meetKit setNetworkStatus:YES];
    //打開音頻檢測（有人說話的音量大小）
    [self.meetKit setAudioActiveCheck:YES];
}

加入會議成功的回調中設置zoom的說話者模式

- (void)onRTCJoinMeetOK:(NSString*)strAnyRTCId {
    //預覽本身的視頻窗口
    [self.meetKit setLocalVideoCapturer:self.videoLayoutView.myVideoView];
    //設置zoom的說話者模式
    [self.meetKit setZoomModel:AnyZoomTypeSingle];
}

有人進入會議或者離開會議中把相關人員記錄或者刪除

// 有人進來
-(void)onRTCOpenVideoRender:(NSString*)strRTCPeerId withRTCPubId:(NSString *)strRTCPubId withUserId:(NSString*)strUserId withUserData:(NSString*)strUserData {
    ZMVideoView *view = [[ZMVideoView alloc] init];
    view.peerId = strRTCPeerId;
    view.pubId = strRTCPubId;
    view.userId = strUserId;
    __weak typeof(self)weakSelf = self;
    view.tapEvent = ^() {
        if (weakSelf.zoomType==AnyZoomTypeSingle) {
            weakSelf.videoLayoutView.myVideoView.isBig = NO;
        }
        // 刷新佈局
        [weakSelf.videoLayoutView layout];
    };
    //本地本身的strRTCPeerId 都爲RTCMainParticipanter
    if (![strRTCPeerId isEqualToString:@"RTCMainParticipanter"]) {
        [self.meetKit setRTCVideoRender:strRTCPubId andRender:view.videoView];
    }
    [self.videoLayoutView.remoteArray addObject:view];
}
// 有人離開
-(void)onRTCCloseVideoRender:(NSString*)strRTCPeerId withRTCPubId:(NSString *)strRTCPubId withUserId:(NSString*)strUserId {
    for (ZMVideoView *view in self.videoLayoutView.remoteArray) {
        if ([view.peerId isEqualToString:strRTCPeerId]) {
            [view removeFromSuperview];
            [self.videoLayoutView.remoteArray removeObject:view];
            break;
        }
    }
}

zoom模式有人來或者離開後的統計信息，咱們能夠在該信息中對頁面佈局作調整，好比增長一頁，或者刪除一頁，具體能夠看代碼實現

- (void)onRTCZoomPageInfo:(AnyZoomType)nZoomType allPage:(int)nAllPage currentPage:(int)nCurrentPage allRenderNum:(int)nAllRenderNum beginIndex:(int)nIndex showNum:(int)nShowNum {
  // 對頁面作變化佈局
}

不一樣模式須要的操做

- (void)changeZoomModel:(int)index {
    switch (index) {
        case 0:
        {
            //駕駛模式
            [self.meetKit setZoomModel:AnyZoomTypeDriver];
            //禁止傳輸視頻，此時能夠說話，只拉去音頻
            [self.meetKit setLocalVideoEnable:NO];
        }
            break;
        case 1:
        {
            // 單顯示模式（本地視頻打開）
            [self.meetKit setLocalVideoEnable:YES];
            // 設置單顯模式
            [self.meetKit setZoomModel:AnyZoomTypeSingle];
        }
            break;
        default:
        {
            // 設置分屏顯示
            if (self.zoomType != AnyZoomTypeNomal) {
                [self.meetKit setZoomModel:AnyZoomTypeNomal];
            }
            [self.meetKit setLocalVideoEnable:YES];
            // 設置頁碼
            [self.meetKit setZoomPage:index-2];
        }
            break;
    }
}

駕駛模式

駕駛模式根據本身需求是否把本身的音頻禁用,能夠點擊說話的時候打開禁用，取消說話的時候，打開關閉禁用

[self.meetKit setLocalAudioEnable:NO];

說話者模式

說話者模式是本身和當前說話的人顯示，若是當前會議只有本身一我的，全屏顯示本身的圖像，本地圖像以及遠程圖像大小，本身佈局決定。

點擊小屏幕能夠進行大小屏切換。大小屏佈局代碼以下：

//說話者模式佈局代碼
            UIView *singView = [self.viewsArray objectAtIndex:1];
            if (self.remoteArray.count==0) {
                if (self.myVideoView.superview) {
                    [self.myVideoView removeFromSuperview];
                }
                self.myVideoView.frame = self.frame;
                [singView addSubview:self.myVideoView];
            }else{
                CGFloat X = CGRectGetWidth(self.frame) -90 -10;
                CGFloat Y = CGRectGetHeight(self.frame)-120 -10;
                CGFloat width = 90;
                CGFloat height = 120;
                ZMVideoView *otherView = [self.remoteArray firstObject];
                if (otherView.superview) {
                    [otherView removeFromSuperview];
                }
                if (self.myVideoView.superview) {
                    [self.myVideoView removeFromSuperview];
                }
                if (!self.myVideoView.isBig) {
                    otherView.frame = self.frame;
                    [singView addSubview:otherView];
                    [singView sendSubviewToBack:otherView];
                    
                    self.myVideoView.frame = CGRectMake(X, Y, width, height);
                    [singView addSubview:self.myVideoView];
                }else{
                    self.myVideoView.frame = self.frame;
                    [singView addSubview:self.myVideoView];
                    [singView sendSubviewToBack:self.myVideoView];
                    
                    otherView.frame = CGRectMake(X, Y, width, height);
                    [singView addSubview:otherView];
                }

分屏顯示 分屏顯示每屏第一個視頻都爲本身，切換到當前模式下的時候，佈局的視圖，全有有人來了的回調裏存儲進行佈局便可。

佈局代碼以下,三分屏幕或者4分屏

// 平分顯示
            CGFloat width = CGRectGetWidth(self.frame)/2;
            CGFloat height = width*4/3;
            CGFloat X = 0;
            CGFloat Y =(CGRectGetHeight(self.frame)-2*height)/2;
            UIView *singView = [self.viewsArray objectAtIndex:self.viewIndex];
            for (int i=0;i<self.remoteArray.count;i++ ) {
                
                ZMVideoView *view = [self.remoteArray objectAtIndex:i];
                if (view.superview) {
                    [view removeFromSuperview];
                }
                // 本身本地的視圖
                if ([view.peerId isEqualToString:@"RTCMainParticipanter"]) {
                    if (self.myVideoView.superview) {
                        [self.myVideoView removeFromSuperview];
                    }
                    [singView addSubview:self.myVideoView];
                    self.myVideoView.frame = CGRectMake(X, Y, width, height);
                    if ((i+1)%2==0) {
                        X = 0;
                        Y+=height;
                    }else{
                        X = X+width;
                    }
                }else{
                    [singView addSubview:view];
                    view.frame = CGRectMake(X, Y, width, height);
                    if ((i+1)%2==0) {
                        X = 0;
                        Y+=height;
                    }else{
                        X = X+width;
                    }
                }
            }

掛斷離開

- (void)closeButtonEvent:(UIButton*)sender {
    //離開頻道，釋放資源
    [self.meetKit leaveRTC];
    [self dismissViewControllerAnimated:YES completion:nil];
}

總結

上述即爲zoom多人模式多人佈局的寫法，大體步驟我作下總結

1. 初始化引擎以前，在Controller中添加一個UIScrollView,並添加兩個視圖，第一個爲駕駛模式頁面，另一個是說話者模式頁面。

2. join成功以後，須要設置調用以下方法，設置爲AnyZoomTypeSingle模式。

- (BOOL)setZoomModel:(AnyZoomType)eType;

3. 等待onRTCZoomPageInfo 信息回調，咱們根據該回調進行頁面顯示和佈局。

其中還有一些方法，好比禁用本身的音頻和視頻，攝像頭翻轉，鏡像開關，揚聲器開關等等一些接口，根據本身的須要添加便可。