anyRTC Zoom模式多人音视频开发教程-iOS [附源码]

时间 2019-12-06

标签 anyrtc zoom 模式多人音视频开发教程 ios 源码栏目 iOS 繁體版

原文原文链接

应广大开发者要求，写一下用anyRTC多人视频sdk来模仿zoom多人视频样式，如下开始正文：git

GitHub地址

https://github.com/BoYuanZjq/ZoomDemogithub

anyRTC多人音视频sdk提供了4中模式，其中一种模式为zoom模式，咱们只须要在进会以前设置该种模式便可。服务器

anyRTC SDK集成

集成sdk,是做为一名合格的开发人员必备的技能，根据官方集成文档集成便可。网络

1. pod集成app

pod 'RTMeetEngine'

2. 添加必要权限dom

在Info.plist中添加以下权限ide

<key>NSCameraUsageDescription</key>
<string>项目须要访问视频</string>
<key>NSMicrophoneUsageDescription</key>
<string>项目须要访问音频</string>

3. 打开音频可后台运行 TARGETS->Capabilities->Background Modes->选中Audio,AirPlay,and Picture in Picture 布局

4. 配置开发者信息性能

在AppDelegate.h文件中把相应的开发者信息替换一下, 配置项在官网建立应用中可查看3d

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多人视频模式，是解决手机上同时渲染多路性能的问题而生，其中分为三种场景

驾驶模式：只接收音频，不发送音视频，发送音频，根据客户本身选择。
说话者模式：该模式，只显示本身和当前正在说话的人，也能够选中一我的员，进行双人锁定通讯。
分屏模式：该模式每屏显示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多人模式多人布局的写法，大体步骤我作下总结

初始化引擎以前，在Controller中添加一个UIScrollView,并添加两个视图，第一个为驾驶模式页面，另一个是说话者模式页面。
join成功以后，须要设置调用以下方法，设置为AnyZoomTypeSingle模式。

- (BOOL)setZoomModel:(AnyZoomType)eType;

等待onRTCZoomPageInfo 信息回调，咱们根据该回调进行页面显示和布局。

其中还有一些方法，好比禁用本身的音频和视频，摄像头翻转，镜像开关，扬声器开关等等一些接口，根据本身的须要添加便可。