【如何快速的开发一个完整的iOS直播app】(采集篇)

效果

为了采集效果图,我也是豁出去了,请忽略人物,关注技术。

忽略本人.png

基本知识介绍

  • AVFoundation: 音视频数据采集需要用AVFoundation框架.
  • AVCaptureDevice:硬件设备,包括麦克风、摄像头,通过该对象可以设置物理设备的一些属性(例如相机聚焦、白平衡等)
  • AVCaptureDeviceInput:硬件输入对象,可以根据AVCaptureDevice创建对应的AVCaptureDeviceInput对象,用于管理硬件输入数据。
  • AVCaptureOutput:硬件输出对象,用于接收各类输出数据,通常使用对应的子类AVCaptureAudioDataOutput(声音数据输出对象)、AVCaptureVideoDataOutput(视频数据输出对象)
  • AVCaptionConnection:当把一个输入和输出添加到AVCaptureSession之后,AVCaptureSession就会在输入、输出设备之间建立连接,而且通过AVCaptureOutput可以获取这个连接对象。
  • AVCaptureVideoPreviewLayer:相机拍摄预览图层,能实时查看拍照或视频录制效果,创建该对象需要指定对应的AVCaptureSession对象,因为AVCaptureSession包含视频输入数据,有视频数据才能展示。
  • AVCaptureSession: 协调输入与输出之间传输数据
    • 系统作用:可以操作硬件设备
    • 工作原理:让App与系统之间产生一个捕获会话,相当于App与硬件设备有联系了, 我们只需要把硬件输入对象和输出对象添加到会话中,会话就会自动把硬件输入对象和输出产生连接,这样硬件输入与输出设备就能传输音视频数据。
    • 现实生活场景:租客(输入钱),中介(会话),房东(输出房),租客和房东都在中介登记,中介就会让租客与房东之间产生联系,以后租客就能直接和房东联系了。

捕获音视频步骤:官方文档

  • 1.创建AVCaptureSession对象
  • 2.获取AVCaptureDevicel录像设备(摄像头),录音设备(麦克风),注意不具备输入数据功能,只是用来调节硬件设备的配置。
  • 3.根据音频/视频硬件设备(AVCaptureDevice)创建音频/视频硬件输入数据对象(AVCaptureDeviceInput),专门管理数据输入。
  • 4.创建视频输出数据管理对象(AVCaptureVideoDataOutput),并且设置样品缓存代理(setSampleBufferDelegate)就可以通过它拿到采集到的视频数据
  • 5.创建音频输出数据管理对象(AVCaptureAudioDataOutput),并且设置样品缓存代理(setSampleBufferDelegate)就可以通过它拿到采集到的音频数据
  • 6.将数据输入对象AVCaptureDeviceInput、数据输出对象AVCaptureOutput添加到媒体会话管理对象AVCaptureSession中,就会自动让音频输入与输出和视频输入与输出产生连接.
  • 7.创建视频预览图层AVCaptureVideoPreviewLayer并指定媒体会话,添加图层到显示容器layer中
  • 8.启动AVCaptureSession,只有开启,才会开始输入到输出数据流传输。
// 捕获音视频
- (void)setupCaputureVideo
{
    // 1.创建捕获会话,必须要强引用,否则会被释放
    AVCaptureSession *captureSession = [[AVCaptureSession alloc] init];
    _captureSession = captureSession;

    // 2.获取摄像头设备,默认是后置摄像头
    AVCaptureDevice *videoDevice = [self getVideoDevice:AVCaptureDevicePositionFront];

    // 3.获取声音设备
    AVCaptureDevice *audioDevice = [AVCaptureDevice defaultDeviceWithMediaType:AVMediaTypeAudio];

    // 4.创建对应视频设备输入对象
    AVCaptureDeviceInput *videoDeviceInput = [AVCaptureDeviceInput deviceInputWithDevice:videoDevice error:nil];
    _currentVideoDeviceInput = videoDeviceInput;

    // 5.创建对应音频设备输入对象
    AVCaptureDeviceInput *audioDeviceInput = [AVCaptureDeviceInput deviceInputWithDevice:audioDevice error:nil];

    // 6.添加到会话中
    // 注意“最好要判断是否能添加输入,会话不能添加空的
    // 6.1 添加视频
    if ([captureSession canAddInput:videoDeviceInput]) {
        [captureSession addInput:videoDeviceInput];
    }
    // 6.2 添加音频
    if ([captureSession canAddInput:audioDeviceInput]) {
        [captureSession addInput:audioDeviceInput];
    }

    // 7.获取视频数据输出设备
    AVCaptureVideoDataOutput *videoOutput = [[AVCaptureVideoDataOutput alloc] init];
    // 7.1 设置代理,捕获视频样品数据
    // 注意:队列必须是串行队列,才能获取到数据,而且不能为空
    dispatch_queue_t videoQueue = dispatch_queue_create("Video Capture Queue", DISPATCH_QUEUE_SERIAL);
    [videoOutput setSampleBufferDelegate:self queue:videoQueue];
    if ([captureSession canAddOutput:videoOutput]) {
        [captureSession addOutput:videoOutput];
    }

    // 8.获取音频数据输出设备
    AVCaptureAudioDataOutput *audioOutput = [[AVCaptureAudioDataOutput alloc] init];
    // 8.2 设置代理,捕获视频样品数据
    // 注意:队列必须是串行队列,才能获取到数据,而且不能为空
    dispatch_queue_t audioQueue = dispatch_queue_create("Audio Capture Queue", DISPATCH_QUEUE_SERIAL);
    [audioOutput setSampleBufferDelegate:self queue:audioQueue];
    if ([captureSession canAddOutput:audioOutput]) {
        [captureSession addOutput:audioOutput];
    }

    // 9.获取视频输入与输出连接,用于分辨音视频数据
    _videoConnection = [videoOutput connectionWithMediaType:AVMediaTypeVideo];

    // 10.添加视频预览图层
    AVCaptureVideoPreviewLayer *previedLayer = [AVCaptureVideoPreviewLayer layerWithSession:captureSession];
    previedLayer.frame = [UIScreen mainScreen].bounds;
    [self.view.layer insertSublayer:previedLayer atIndex:0];
    _previedLayer = previedLayer;

    // 11.启动会话
    [captureSession startRunning];
}

// 指定摄像头方向获取摄像头
- (AVCaptureDevice *)getVideoDevice:(AVCaptureDevicePosition)position
{
    NSArray *devices = [AVCaptureDevice devicesWithMediaType:AVMediaTypeVideo];
    for (AVCaptureDevice *device in devices) {
        if (device.position == position) {
            return device;
        }
    }
    return nil;
}

#pragma mark - AVCaptureVideoDataOutputSampleBufferDelegate
// 获取输入设备数据,有可能是音频有可能是视频
- (void)captureOutput:(AVCaptureOutput *)captureOutput didOutputSampleBuffer:(CMSampleBufferRef)sampleBuffer fromConnection:(AVCaptureConnection *)connection
{
    if (_videoConnection == connection) {
        NSLog(@"采集到视频数据");
    } else {
        NSLog(@"采集到音频数据");
    }
}

视频采集额外功能一(切换摄像头)

  • 切换摄像头步骤

    • 1.获取当前视频设备输入对象
    • 2.判断当前视频设备是前置还是后置
    • 3.确定切换摄像头的方向
    • 4.根据摄像头方向获取对应的摄像头设备
    • 5.创建对应的摄像头输入对象
    • 6.从会话中移除之前的视频输入对象
    • 7.添加新的视频输入对象到会话中
// 切换摄像头
- (IBAction)toggleCapture:(id)sender {

    // 获取当前设备方向
    AVCaptureDevicePosition curPosition = _currentVideoDeviceInput.device.position;

    // 获取需要改变的方向
    AVCaptureDevicePosition togglePosition = curPosition == AVCaptureDevicePositionFront?AVCaptureDevicePositionBack:AVCaptureDevicePositionFront;

    // 获取改变的摄像头设备
    AVCaptureDevice *toggleDevice = [self getVideoDevice:togglePosition];

    // 获取改变的摄像头输入设备
    AVCaptureDeviceInput *toggleDeviceInput = [AVCaptureDeviceInput deviceInputWithDevice:toggleDevice error:nil];

    // 移除之前摄像头输入设备
    [_captureSession removeInput:_currentVideoDeviceInput];

    // 添加新的摄像头输入设备
    [_captureSession addInput:toggleDeviceInput];

    // 记录当前摄像头输入设备
    _currentVideoDeviceInput = toggleDeviceInput;

}

视频采集额外功能二(聚焦光标)

  • 聚焦光标步骤

    • 1.监听屏幕的点击
    • 2.获取点击的点位置,转换为摄像头上的点,必须通过视频预览图层(AVCaptureVideoPreviewLayer)转
    • 3.设置聚焦光标图片的位置,并做动画
    • 4.设置摄像头设备聚焦模式和曝光模式(注意:这里设置一定要锁定配置lockForConfiguration,否则报错)
// 点击屏幕,出现聚焦视图
- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event
{
    // 获取点击位置
    UITouch *touch = [touches anyObject];
    CGPoint point = [touch locationInView:self.view];

    // 把当前位置转换为摄像头点上的位置
    CGPoint cameraPoint = [_previedLayer captureDevicePointOfInterestForPoint:point];

    // 设置聚焦点光标位置
    [self setFocusCursorWithPoint:point];

    // 设置聚焦
    [self focusWithMode:AVCaptureFocusModeAutoFocus exposureMode:AVCaptureExposureModeAutoExpose atPoint:cameraPoint];
}

/**
 *  设置聚焦光标位置
 *
 *  @param point 光标位置
 */
-(void)setFocusCursorWithPoint:(CGPoint)point{
    self.focusCursorImageView.center=point;
    self.focusCursorImageView.transform=CGAffineTransformMakeScale(1.5, 1.5);
    self.focusCursorImageView.alpha=1.0;
    [UIView animateWithDuration:1.0 animations:^{
        self.focusCursorImageView.transform=CGAffineTransformIdentity;
    } completion:^(BOOL finished) {
        self.focusCursorImageView.alpha=0;

    }];
}

/**
 *  设置聚焦
 */
-(void)focusWithMode:(AVCaptureFocusMode)focusMode exposureMode:(AVCaptureExposureMode)exposureMode atPoint:(CGPoint)point{

    AVCaptureDevice *captureDevice = _currentVideoDeviceInput.device;
    // 锁定配置
    [captureDevice lockForConfiguration:nil];

    // 设置聚焦
    if ([captureDevice isFocusModeSupported:AVCaptureFocusModeAutoFocus]) {
        [captureDevice setFocusMode:AVCaptureFocusModeAutoFocus];
    }
    if ([captureDevice isFocusPointOfInterestSupported]) {
        [captureDevice setFocusPointOfInterest:point];
    }

    // 设置曝光
    if ([captureDevice isExposureModeSupported:AVCaptureExposureModeAutoExpose]) {
        [captureDevice setExposureMode:AVCaptureExposureModeAutoExpose];
    }
    if ([captureDevice isExposurePointOfInterestSupported]) {
        [captureDevice setExposurePointOfInterest:point];
    }

    // 解锁配置
    [captureDevice unlockForConfiguration];
}

结束语

后续还会更新更多有关直播的资料,希望做到教会每一个朋友从零开始做一款直播app,并且Demo也会慢慢完善.
Demo点击下载

  • 由于FFMPEG库比较大,大概100M。
  • 本来想自己上传所有代码了,上传了1个小时,还没成功,就放弃了。
  • 提供另外一种方案,需要你们自己导入IJKPlayer库

    具体步骤:

  • 下载Demo后,打开YZLiveApp.xcworkspace问题

打开YZLiveApp.xcworkspace问题

  • pod install就能解决

Snip20160830_12.png

  • 下载jkplayer库,点击下载
  • 把jkplayer直接拖入到与Classes同一级目录下,直接运行程序,就能成功了

拖入ijkplayer到与Classes同一级目录下.png

  • 注意不需要打开工程,把jkplayer拖入到工程中,而是直接把jkplayer库拷贝到与Classes同一级目录下就可以了。
  • 错误示范:不要向下面这样操作

Snip20160830_14.png

推荐拓展阅读

著作权归作者所有

文/袁峥Seemygo(简书作者)
原文链接:http://www.jianshu.com/p/c71bfda055fa
著作权归作者所有,转载请联系作者获得授权,并标注“简书作者”。

时间: 2024-12-16 12:12:29

【如何快速的开发一个完整的iOS直播app】(采集篇)的相关文章

如何快速的开发一个完整的iOS直播app(原理篇)

前言 大半年没写博客了,但我一直关注着互联网的动向,最近会研究很多东西,并分享,今年移动直播行业的兴起,诞生了一大批网红,甚至明星也开始直播了,因此不得不跟上时代的步伐,由于第一次接触的原因,因此花了很多时间了解直播,整理了直播的原理,当前只是原理篇,后续会持续发布实战篇,教你从零开始搭建一个完整的iOS直播app,希望能帮助到更多的人更快的了解直播. 一.个人见解(直播难与易) 直播难:个人认为要想把直播从零开始做出来,绝对是牛逼中的牛逼,大牛中的大牛,因为直播中运用到的技术难点非常之多,视频

【如何快速的开发一个完整的iOS直播app】(播放篇)

前言 在看这篇之前,如果您还不了解直播原理,请查看上篇文章如何快速的开发一个完整的iOS直播app(原理篇) 开发一款直播app,集成ijkplayer成功后,就算完成直播功能一半的工程了,只要有拉流url,就能播放直播啦 本篇主要讲解的是直播app中,需要用到的一个很重要的开源框架ijkplayer,然后集成这个框架可能对大多数初学者还是比较有难度的,所以本篇主要教你解决集成[ijkplayer]遇见的各种坑. 很多文章,可能讲解的是如何做,我比较注重讲解为什么这样做,大家有什么不明白,还可以

【如何快速的开发一个完整的 iOS 直播 app】(美颜篇)

来源:袁峥Seemygo 链接:http://www.jianshu.com/p/4646894245ba 前言 在看这篇之前,如果您还不了解直播原理,请查看这篇文章如何快速的开发一个完整的iOS直播app(原理篇) 开发一款直播app,美颜功能是很重要的,如果没有美颜功能,可能分分钟钟掉粉千万,本篇主要讲解直播中美颜功能的实现原理,并且实现美颜功能. 利用GPUImage处理直播过程中美颜的流程 采集视频 => 获取每一帧图片 => 滤镜处理 => GPUImageView展示 美颜原

【如何快速的开发一个完整的iOS直播app】(原理篇)

一.个人见解(直播难与易) 直播难:个人认为要想把直播从零开始做出来,绝对是牛逼中的牛逼,大牛中的大牛,因为直播中运用到的技术难点非常之多,视频/音频处理,图形处理,视频/音频压缩,CDN分发,即时通讯等技术,每一个技术都够你学几年的. 直播易:已经有各个领域的大牛,封装好了许多牛逼的框架,我们只需要用别人写好的框架,就能快速的搭建一个直播app,也就是传说中的站在大牛肩膀上编程. 二.了解直播 热门直播产品 映客,斗鱼,熊猫,虎牙,花椒等等 直播效果图 直播效果.jpeg 1.一个完整直播ap

php怎么做网站?如何用PHP开发一个完整的网站?

1.PHPer应具备的知识 (1)PHP知识: 熟练掌握基础函数,PHP语句(条件.循环),数组(排序.读取),函数(内部 构造),运算(数学 逻辑),面向对象(继承 接口 封装 多态静态属性)等. 了解Cookie或者Session一种机制 了解一种模板操作机制和使用 手头收藏一些好的常用类或方法,能提高我们的开发的速度.如:分页.上传.字符过滤.数据库操作.生成HTML.文件操作等. (2)HTML知识 (3)JavaScript事件处理 (4)数据库知识:SQL语句"增删改查"

如何快速搭建一个完整的移动直播系统?

移动直播行业的火热会在很长一段时间内持续,通过和各行业的整合,从而成为具有无限可能性的行业.主要因为以下三个原因: 第一,移动直播的UGC生产模式比PC端的直播更明显,人人都有设备,随时随地开播,完全顺应了互联网时代的开放性原则,能刺激更多人去创造和传播优质内容. 第二,网络带宽和速度在逐渐提高,网络成本在逐渐下降,为移动直播提供一个极佳的发展环境.文字.声音.视频.游戏等都会在移动直播中呈现,创造出更加丰富的用户体验.直播可以以SDK的形式接入到自己的应用中,比如,教育领域中的课后辅导完全可以

开发一个完整的JavaScript组件

作为一名开发者,大家应该都知道在浏览器中存在一些内置的控件:Alert,Confirm等,但是这些控件通常根据浏览器产商的不同而形态各异,视觉效果往往达不到UI设计师的要求.更重要的是,这类内置控件的风格很难与形形色色的各种风格迥异的互联网产品的设计风格统一.因此,优秀的前端开发者们各自开发自己的个性化控件来替代浏览器内置的这些控件.当然,这类组件在网络上已经有不计其数相当优秀的,写这篇文章的目的不是为了说明我开发的这个组件有多优秀,也不是为了炫耀什么,只是希望通过这种方式,与更多的开发者互相交

【原创】开发一个完整的JavaScript组件

作为一名开发者,大家应该都知道在浏览器中存在一些内置的控件:Alert,Confirm等,但是这些控件通常根据浏览器产商的不同而形态各异,视觉效果往往达不到UI设计师的要求.更重要的是,这类内置控件的风格很难与形形色色的各种风格迥异的互联网产品的设计风格统一.因此,优秀的前端开发者们各自开发自己的个性化控件来替代浏览器内置的这些控件.当然,这类组件在网络上已经有不计其数相当优秀的,写这篇文章的目的不是为了说明我开发的这个组件有多优秀,也不是为了炫耀什么,只是希望通过这种方式,与更多的开发者互相交

[转]开发一个完整的JavaScript组件

原创:http://www.admin10000.com/document/5961.html 作为一名开发者,大家应该都知道在浏览器中存在一些内置的控件:Alert,Confirm等,但是这些控件通常根据浏览器产商的不同而形态各异,视觉效果往往达不到UI设计师的要求.更重要的是,这类内置控件的风格很难与形形色色的各种风格迥异的互联网产品的设计风格统一.因此,优秀的前端开发者们各自开发自己的个性化控件来替代浏览器内置的这些控件.当然,这类组件在网络上已经有不计其数相当优秀的,写这篇文章的目的不是