SlideShare a Scribd company logo
1 of 78
Download to read offline
iOS 视频 APP 开发实践
⼀一个普通 iOS 码农的视频 APP 姿势
李李睿君
我今天来介绍下⼀一个普通 iOS 码农怎么做视频 APP
介绍
我今天介绍的内容是在 iOS 范围内视频 app 的开发

⼤大部分内容是去年年我在做 Remix,现在叫热猫的⼀一个视频 app 时总结的经验和套路路包括了了,AVFoundation 的介绍,视频数据处理理,以及 GPUImage 怎么⽤用,这些东⻄西,是
我们在 iOS 的知识范围内开发⼀一个视频 app 以及,可以做到什什么样
iOS 提供的姿势
AVFoundation 系统提供的原⽣生的视频、⾳音频库,我们的主⻆角
OpenGL 很⾼高档的图像处理理库
GPUImage 如果你不不想⾯面对 OpenGL,那么这是⾸首选
VideoToolbox ⾼高档玩意,⼈人⾁肉编码解码视频就靠他了了,但是很难⽤用起来
还有很多 C 库(ffmpeg 之类的)
iOS 能给我们的东⻄西

AVFoundation,应该算是我们今天的主⻆角了了,除了了 ffmpeg 以外,视频和⾳音频相关的处理理,基本都离不不开他,但是我们不不会⽤用 ffmpeg

OpenGL,图像处理理的基本库,但是⼊入⻔门的⻔门槛也很⾼高,下⾯面说的 GPUImage 也是基于 OpenGL 做的东⻄西

GPUImage,刚开始做图像处理理的时候被 OpenGL 给挡住了了,有了了他,平凡的 iOS 码农也可以做点⼩小滤镜了了

Video Toolbox,正经的⾼高档玩意,如果我们想要⼈人⾁肉编码解码,不不依赖 AV 库给的东⻄西,那就要靠他了了
AVFoundation ⾥里里⾯面有什什么
拍摄(AVCaptureDevice 相关)
播放(AVPlayer,AVAudioPlayer)
编辑(AVComposation 相关的对
象)
编码解码(AVAssetWriter,
AVAssetReader)
先介绍下,AVFoundation ⾥里里⾯面有些什什么东⻄西

AVFoundation 提供了了播放,编码解码,编辑和拍摄相关的⼀一系列列⼯工具给我们使⽤用系统原⽣生的 API 来处理理视频

另外播放这⾥里里特别说⼀一下,AVFoundation 提供了了⼀一套视频⾳音频的 API,但是如果只是单独播放和录制⾳音频,那么可以考虑使⽤用 AVAudioPlayer 和 AVAudioRecorder,这两个
东⻄西更更好⽤用
视频采集
恩,采集,其实就是拍摄了了
AVFoundation - 采集
没有特殊需求的情况下,我们⼀一般会⽤用 iOS 给的 ImagePicker 来拍照,但是当我们有特殊需求,或者对拍摄界⾯面有特殊定制的时候,那么就需要⾃自⼰己来编写拍摄时对拍摄设
备的操作了了

当然拍摄的普通少年年呢,也就是通过创建 AVCMoFOut,StillOut,PreviewLayer 来完成拍摄的操作,这样操作的结果是系统会提供给我们正常的预览窗⼝口,拍摄完成后,会
有成品的视频⽂文件和图像

采集的做法就是创建⼀一个 Capture Session,然后给他添加 Input 对象,每个 Input 对应了了实际的设备,并且可以调节参数,⽐比如画质等

之后把 Output 对象也添加进去,打开 Input 对象开始采集数据
AVFoundation - 采集
对于想要亲⼿手处理理视频数据的我们,
那么就要⽤用
AVCaptureVideoDataOutput 了了
不不过这个东⻄西,在后⾯面操作视频数据的时候会讲,这⾥里里就不不说了了
播放
AVFoundation - 核⼼心
AVAsset
AVFoundation 的核⼼心就是 Asset,也叫 AVAsset
AVFoundation - 核⼼心
AVAsset
AVURLAsset
AVAsset 有⼀一个⼦子类叫 AVURLAsset,专⻔门⽤用于处理理视频流,也就是在线播放的视频,后⾯面说道边下边播的时候就会⽤用到他了了
AVFoundation - 核⼼心
AVAsset
AVAssertTracks
时间⻓长度
Transform
Metadata
等等等……各种属性
AVAsset ⾥里里⾯面包含了了,最主要的 Tracks,以及时间⻓长度,变形矩阵,元数据,歌词,等等等各种各样的媒体信息
AVFoundation - 普通姿势播放
AVPlayer
AVPlayerItem AVAsset
AVPlayerLayer
常规的播放,那就是直接通过 AVPlayer 播放 Asset,然后把显示的内容放到 AVPlayerLater 上,就可以了了
AVFoundation - 普通姿势播放 Plus
AVPlayer
AVPlayerItem AVAsset
AVPlayerLayerAVPlayerLayer
AVPlayerLayer
AVPlayerLayer
AVPlayerLayerAVPlayerLayer
这⾥里里有个技巧,⼀一个 AVPlayer 其实是可以添加多个 PlayerLayer 的,也就是你可以放很多个画⾯面在⼀一个屏幕上同时播放,在做选择封⾯面的时候很好⽤用同步率200%,就像这
样
AVFoundation - 普通姿势播放 Plus
AVPlayer
AVPlayerItem AVAsset
AVPlayerLayerAVPlayerLayer
AVPlayerLayer
AVPlayerLayer
AVPlayerLayerAVPlayerLayer
这⾥里里有个技巧,⼀一个 AVPlayer 其实是可以添加多个 PlayerLayer 的,也就是你可以放很多个画⾯面在⼀一个屏幕上同时播放,在做选择封⾯面的时候很好⽤用同步率200%,就像这
样
来点曾经很⾼高端的——边下边播
边下边播是⼤大家的梦想,不不⽤用等待视频下载完成后才能看,也不不⽤用每次看得时候还要等待⽹网络缓冲,但是呢-,-这确是当初⼀一个噩梦开始

当初我刚开始做的时候是2015年年左右,那时候,在⽹网上找到的⽅方法就是⾃自⼰己做⼀一个 Http 服务器器
这是2015年年的搜索能看到的东⻄西

感觉妥妥的⼲干货
AVFoundation - 边下边播
AVPlayer
AVPlayerItem AVURLAsset
AVPlayerLayer
Local Http Server Video URL
很快,我们做好了了第⼀一版,似乎很好的样⼦子

事实证明我图样了了
AVFoundation - 边下边播
AVPlayer
AVPlayerItem AVURLAsset
AVPlayerLayer
Local Http Server Video URL
很快,我们做好了了第⼀一版,似乎很好的样⼦子

事实证明我图样了了
于是⼤大家遇到的问题我都遇到了了。。。

顺便便接了了当初 B 站最新出品的 ijkplayer,依然⽆无⽤用。。。

第⼀一次未下载完之前,确实⽆无法完全播放。。。原因是
于是⼤大家遇到的问题我都遇到了了。。。

顺便便接了了当初 B 站最新出品的 ijkplayer,依然⽆无⽤用。。。

第⼀一次未下载完之前,确实⽆无法完全播放。。。原因是
于是⼤大家遇到的问题我都遇到了了。。。

顺便便接了了当初 B 站最新出品的 ijkplayer,依然⽆无⽤用。。。

第⼀一次未下载完之前,确实⽆无法完全播放。。。原因是
于是⼤大家遇到的问题我都遇到了了。。。

顺便便接了了当初 B 站最新出品的 ijkplayer,依然⽆无⽤用。。。

第⼀一次未下载完之前,确实⽆无法完全播放。。。原因是
于是⼤大家遇到的问题我都遇到了了。。。

顺便便接了了当初 B 站最新出品的 ijkplayer,依然⽆无⽤用。。。

第⼀一次未下载完之前,确实⽆无法完全播放。。。原因是
AVFoundation - 边下边播
AVPlayer
AVPlayerItem AVURLAsset
AVPlayerLayer
Local Http Server Video URL
Local Proxy Server
我们不不能给 AVURLAsset ⼀一个 Http 服务器器,⽽而是要给他⼀一个代理理服务器器

当时咨询了了下安卓那边视频专家,确实是这样。。。于是。。。我们需要⼀一个代理理服务器器。。。
后来我发现,⼈人⾁肉做⼀一个完备的代理理服务器器,似乎难度有点⼤大,不不是⼀一两天能调了了妥妥的可以⽤用的啊。。。
http://www.codeproject.com/Articles/875105/
Audio-streaming-and-caching-in-iOS-using
https://github.com/renjithn/
AVAssetResourceLoader-Video-Example
后来继续研究的时候,发现原来有⼈人实现过,iOS 6 开始,系统层⾯面⽀支持了了,那就是 AVAssetResourceLoader

今年年再次搜索边下边播的时候,其实⼤大家都会⽤用了了
AVFoundation - 真・边下边播
AVURLAsset
Video URL
AVAssetResourceLoader
AVAssetResourceLoadingRequest
AVAssetResourceLoaderDelegate
iOS 6开始,提供了了 ResourceLoader 对象让我们实现

AVURLAsset 在解析到⽆无法加载的 URL 的时候,ResourceLoader 就会问他的 delegate,你会不不会解析这样的 URL 啊?

delegate 会的话,就会把所有的请求丢给他,让他处理理,delegate 处理理完成后,向 Request 填充数据,并告诉她请求成功⻦鸟

终于读懂了了 demo 后,那个夏天完美解决了了边下边播
AVFoundation - 真・边下边播
AVURLAsset
Video URL
AVAssetResourceLoader
AVAssetResourceLoadingRequest
AVAssetResourceLoaderDelegate
https://github.com/renjithn/
AVAssetResourceLoader-Video-Example
参考实现:
iOS 6开始,提供了了 ResourceLoader 对象让我们实现

AVURLAsset 在解析到⽆无法加载的 URL 的时候,ResourceLoader 就会问他的 delegate,你会不不会解析这样的 URL 啊?

delegate 会的话,就会把所有的请求丢给他,让他处理理,delegate 处理理完成后,向 Request 填充数据,并告诉她请求成功⻦鸟

终于读懂了了 demo 后,那个夏天完美解决了了边下边播
AVFoundation - 真・边下边播
AVURLAsset
Video URL
AVAssetResourceLoader
AVAssetResourceLoadingRequest
AVAssetResourceLoaderDelegate
https://github.com/renjithn/
AVAssetResourceLoader-Video-Example
参考实现:
iOS 6开始,提供了了 ResourceLoader 对象让我们实现

AVURLAsset 在解析到⽆无法加载的 URL 的时候,ResourceLoader 就会问他的 delegate,你会不不会解析这样的 URL 啊?

delegate 会的话,就会把所有的请求丢给他,让他处理理,delegate 处理理完成后,向 Request 填充数据,并告诉她请求成功⻦鸟

终于读懂了了 demo 后,那个夏天完美解决了了边下边播
视频剪辑
接下来我介绍下 iOS 下的视频编辑
以前,⼈人们⽤用剪⼑刀和胶⽔水剪辑影⽚片

后来,我们有了了电脑,但是原理理是⼀一样的,就不不⽤用剪⼑刀和胶⽔水了了

后⾯面所说的视频编辑,很类似今天电脑上视频剪辑软件的操作,只是我们要⽤用代码实现
以前,⼈人们⽤用剪⼑刀和胶⽔水剪辑影⽚片

后来,我们有了了电脑,但是原理理是⼀一样的,就不不⽤用剪⼑刀和胶⽔水了了

后⾯面所说的视频编辑,很类似今天电脑上视频剪辑软件的操作,只是我们要⽤用代码实现
以前,⼈人们⽤用剪⼑刀和胶⽔水剪辑影⽚片

后来,我们有了了电脑,但是原理理是⼀一样的,就不不⽤用剪⼑刀和胶⽔水了了

后⾯面所说的视频编辑,很类似今天电脑上视频剪辑软件的操作,只是我们要⽤用代码实现
以前,⼈人们⽤用剪⼑刀和胶⽔水剪辑影⽚片

后来,我们有了了电脑,但是原理理是⼀一样的,就不不⽤用剪⼑刀和胶⽔水了了

后⾯面所说的视频编辑,很类似今天电脑上视频剪辑软件的操作,只是我们要⽤用代码实现
AVFoundation - 视频编辑
AVAsset
回到核⼼心 Asset,⼀一开始说了了,Asset 是 AV 中所有编辑的基础,他确实是
AVFoundation - 视频编辑
AVAsset
AVComposition
AVMutableComposition
从 Asset 继承出两个类,⼀一个是 AVComxxxxxxx,另⼀一个是他的可变继承

之前⼀一直是⽤用 Asset,现在我们来看看 Asset ⾥里里⾯面有些什什么东⻄西
AVFoundation - 视频编辑
发现官⽅方⽂文档的图画得很精美。。。我就不不去⾼高仿了了。。。

这⾥里里,上⾯面是 AVAsset 的结构,下⾯面是 AVMutableComposition 的结构和对应到 Asset 中的结构

Asset 是由多个不不同类型的 Asset Track 组成,每种 track 有⾃自⼰己的类型,⽐比如视频的,⾳音频的,我们以前看 VCD,可以选原声还是中⽂文配⾳音就是靠在视频⾥里里⾯面添加了了多个⾳音
频 track,播放的时候进⾏行行切换

Asset 是已经完成合成了了的资源,⽐比如视频,⾳音频⽂文件,在线的视频流

Composition 则是多个 Asset 进⾏行行了了组合拼接得到的结果

MutableComposition 就是 Composition 的可变对象,视频编辑的主⻆角
AVFoundation - 视频编辑
CompositionTrack 中有记录如何操作 video 的对象,那就是 CompositionLayerInstruction,instruction 是⼀一个数组,告诉 VideoComposition 如何操作各段视屏,包括位
移,旋转,以及动画,这⾥里里动画是可以叠加在视频上的动画,这⾥里里做动画需要 Core Animation 的知识,⽔水印就靠这个了了
AVFoundation - 视频编辑
处理理⾳音频,我们可以使⽤用 AudioMixInputParameters 来操作 AudioComposition,来实现⾳音量量⼤大⼩小的变化,在⾳音轨时间缩放的时候,调节 audio pitch 算法
AVFoundation - 视频编辑
最终,完成所有的视频⾳音频的剪贴后,我们就把他们放到 AssetExportSession 中去,输出实际的视频⽂文件了了

但是要注意的是,就算不不输出⽂文件,只有 Composition 也是可以播放的,这就是为什什么很多剪辑 app 在剪辑完成后,都能很快的可以预览

导出时,只需要配置好 Asset,VideoComposition 等东⻄西给 Asset ExportSession,那就可以按照我们想要的形式导出了了
demo
来看看视频采集,和编辑的 demo
Core Video —— 介绍
这⼀一节开始,我们将进⼊入⼀一半 iOS,⼀一半视频开发的世界
Core Video - 视频数据
⼤大家还记得这个图嘛

视频数据的处理理,在 Core Video 的框架下,Core Video 框架在 AVFoundation 框架下

使⽤用 Core Video 将会真正的进⼊入视频开发的领域,我们会离开 iOS 提供的 Objective-C ⻛风格的 API,转⽽而使⽤用 C API
Core Video - 视频数据
CMSampleBuffer
CVPixelBuffer
CVImageBuffer
包含了了压缩或者未压缩的各种类型的 buffer
在内存中的图像
在显存中的图像
CMSB 包含了了各种类型的 Buffer,所以他其实也可以包含图⽚片,图⽚片在⾥里里⾯面是⼀一个 CVImageBuffer

CVPixelBuffer 和 CVImageBuffer 两个最⼤大的区别是 CVPB 是在内存中的图像,CVIB 是放在显存中的,他们在相互拷⻉贝会发⽣生内存数据和显存数据的交换,下⾯面我介绍下他
们的⼀一些基础知识
Core Video - Pixel Format
32位 ARGB (k32ARGBPixelFormat)
32位 BGRA (k32BGRAPixelFormat)
各种 YUV(常⽤用 YUV 411)
Core Video - 视频数据
CVImageBuffer/CVPixelBuffer
Width,Height Data Size
Bytes Per Row Base Address
buffer 数据中存放了了图像的基本信息,包括宽⾼高,数据⼤大⼩小,每⾏行行的 Byte 数,以及最重要的,Base Address——实际数据存放位置
Core Video - Bitmap 格式 BGRA和
ARGB
图⽚片来源:http://neareal.com/470/
RGB 相关的格式,就是 32ARGB 和 32BGRA,这两种都是常⽤用的格式,计算机内位图就是使⽤用这两个格式,这个格式的意思是,每个像素总⻓长度是32位,每⼋八位代表⼀一个
分量量,分别是 Alpha,Red,Green,Blue,他们两个的区别就是排列列顺序的不不⼀一样

为什什么要搞两个呢,不不⽤用⼀一个解决?

有说法是,BGRA 在磁盘上读取更更快,并且实际上视频和图⽚片保存的格式就是BGRA,只是我们拿到的时候,系统转化成了了 RGB

上⾯面是⼀一个讲解图像构造的⽹网站找到的,他画得很好。。。

每个像素都是四个分量量组成,有4个 byte,⼀一个图⽚片,每⾏行行就按照 BGRABGRABGRA 的顺序填充到了了内存和磁盘上

但是,我们可以看实际取到的数据每⾏行行后⾯面都会有很多个0,但是图⽚片上没有那么多空⽩白的区域,那是因为内存中存储的每⾏行行像素个数并不不是图⽚片的宽度,⽽而是上⼀一⻚页⾥里里⾯面说
道的 Bytes Per Row,为了了读写快速⽽而对⻬齐
Core Video - YUV 是神码
Y:明亮度
U:⾊色度
V:浓度
YUV 是编码颜⾊色空间的⼀一个种类
Y’UV,YUV,YCbCr,YPbPr 都可以
叫做 YUV
YUV 是⼀一种颜⾊色编码⽅方案,通过分离Y,U,V 三个分量量来对颜⾊色进⾏行行编码

YCbCr 是⼀一种颜⾊色空间,分别表示蓝⾊色和红⾊色的浓度偏移量量

PbPr 是⾼高清电视⽤用的,因为 SDTV 和 HDTV
Core Video - 为什什么⽤用 YUV
YUV 是⼴广播电视中常⽤用的颜⾊色编码⽅方式,因为在彩⾊色电视刚出来的时候,使⽤用 YUV 中的 UV 忽略略,保留留 Y,那么就和⿊黑⽩白电视⽤用的是⼀一样的信号了了,这样⼴广播电视公司只需
要传输 YUV 信号,⿊黑⽩白,彩⾊色电视就都能正常使⽤用
你™在逗我?我这是 iPhone,不不是电视啊
怪我咯
Core Video - 为什什么⽤用 YUV
因为⼈人眼对亮度更更加敏敏感,所以我们可以减少 UV 分
量量的采样,减少数据⼤大⼩小
Core Video - 为什什么⽤用 YUV
	 444采样中,Y:U:V=4:4:4,每⼀一个Y对应⼀一个
UV,⽔水平和垂直⽅方向都保持原数据;
	 422采样中,Y:U:V=4:2:2,每两个Y共⽤用⼀一个
UV,⽔水平⽅方向采⽤用2:1采样,垂直⽅方向保持原数
据;
	 411采样中,Y:U:V=4:1:1,每四个Y共⽤用⼀一个
UV,⽔水平⽅方向采⽤用4:1采样,垂直⽅方向保持原数
据;
	 420采样中,Y:UV=4:2或Y:U:V=4:1:1,每四个Y共
⽤用⼀一个UV,⽔水平⽅方向和垂直⽅方向都采⽤用2:1采样。
图⽚片来源:http://www.codernote.top/blog/info/119
说到底还是为了了压缩数据相⽐比 RGBA 每个像素怎么都要 32 bit,YUV 在 UV 上可以省掉很多空间

所以 YUV ⽤用在数据存储上,RGB ⽤用在显示上,后⾯面我们视频播放器器输出格式就使⽤用了了 BGRA 的格式
Core Video - ⼈人⾁肉播放器器
x.mp4
AVPlayerItem AVPlayer
AVPlayerItemVideoOutput
CVPixelBuffer
CADisplay
Link
⾸首先,我们有⼀一个视频,然后创建 Player Item

然后,创建 Player,点了了播放以后,Output 就会开始源源不不断的输出视频 buffer

这时候,我们使⽤用 DisplayLink 来询问 Output 当前的时间点有⽊木有可以显示的新 buffer 啊?

有的话 DisplayLink 就会把它转化成我们要的图⽚片,输出到特定的 View 上
Core Video - ⼈人⾁肉播放器器 Plus
去年年看到过腾讯对⼩小视频的优化,刚好和我那时候研究的⽅方向是⼀一样的,⼈人⾁肉解码播放
demo
我们来看看⼩小视频播放器器的 demo
GPUImage
接下来说说我们不不会 OpenGL 的 iOS ⼩小伙伴能对图像处理理最为⽅方便便的⼯工具了了,GPUImage
GPUImage - 介绍
优点
相对来说友好的 Objective-C 接⼝口(看看 OpenGL 就知道他真的很友好了了)
开箱即⽤用的⼀一⼤大套滤镜,以及⽅方便便我们预览的 showcase
录制—加⼯工—输出⽂文件,⼀一条⻰龙服务
缺点
没办法处理理多声道,并且⼀一处理理就挂
有时候会有莫名的崩溃
GPUImageToneCurveFilter
GPUImage ⾃自带滤镜之⼀一
可以加载 Photoshop 创建的 ACV ⽂文件
(⾊色彩曲线⽂文件)
每个 ACV 都可以成为⼀一个单独的⻛风格
化滤镜
⽽而且 GPUImage 的滤镜可以叠加,多
叠⼏几个,⼜又是不不同的滤镜了了
GPUImageFilter - 简单原理理
texture GPUImageFilter
这⾥里里,我们⽤用到纹理理了了,也就是 texture,在 OpenGL 中⼀一个 texture 就是⼀一个图⽚片,或是能够表示图⽚片的数组
GPUImageFilter - ⾃自定义
其实有 GPUImage 的话,只要我们会 shader 语⾔言就可以⾃自定义更更多滤镜了了,但是我们不不太会。。。所以就先找个实验下

去 shadertoy 找了了个看上去不不是很复杂的滤镜。。。可以看他基本⽊木有⽤用到外部的输⼊入,输出的 texture 也只有⼀一个视频,很符合我们的需求
GPUImageFilter - ⾃自定义
先把 shader 代码,考上来,run 这个滤镜

shader language 有点接近 c 语⾔言,但是他有他⾃自⼰己的变量量定义的⽅方式

⽐比如 highp 是定义精度的,vec4 定义⼀一个4维的点
GPUImageFilter - ⾃自定义
先把 shader 代码,考上来,run 这个滤镜

shader language 有点接近 c 语⾔言,但是他有他⾃自⼰己的变量量定义的⽅方式

⽐比如 highp 是定义精度的,vec4 定义⼀一个4维的点
GPUImageFilter - ⾃自定义
先把 shader 代码,考上来,run 这个滤镜

shader language 有点接近 c 语⾔言,但是他有他⾃自⼰己的变量量定义的⽅方式

⽐比如 highp 是定义精度的,vec4 定义⼀一个4维的点
GPUImageFilter - ⾃自定义
加上精度之后可以了了,不不过效果还不不是太好,需要后⾯面继续调整优化
GPUImageFilter - ⾃自定义
加上精度之后可以了了,不不过效果还不不是太好,需要后⾯面继续调整优化
GPUImageTwoInputFilter
GPUImage ⾃自带滤镜之⼀一
可以输⼊入两个 texture,正常的滤镜会
把待处理理的图像作为⼀一个 texture
我们可以添加⾃自⼰己的 texture 来⾃自定义
更更⾼高级的滤镜
GPUImageTwoInputFilter 是⾃自定义⾃自⼰己材质滤镜的基础

刚刚我们⾃自定义的滤镜,只能输⼊入⼀一个图⽚片,也就是我们需要处理理的图⽚片
GPUImageTwoInputFilter
GPUImage ⾃自带滤镜之⼀一
可以输⼊入两个 texture,正常的滤镜会
把待处理理的图像作为⼀一个 texture
我们可以添加⾃自⼰己的 texture 来⾃自定义
更更⾼高级的滤镜
texture1
texture2
GPUImageTwoInputFilter 是⾃自定义⾃自⼰己材质滤镜的基础

刚刚我们⾃自定义的滤镜,只能输⼊入⼀一个图⽚片,也就是我们需要处理理的图⽚片
GPUImageTwoInputFilter
GPUImage ⾃自带滤镜之⼀一
可以输⼊入两个 texture,正常的滤镜会
把待处理理的图像作为⼀一个 texture
我们可以添加⾃自⼰己的 texture 来⾃自定义
更更⾼高级的滤镜
texture1
texture2
GPUImageTwoInputFilter 是⾃自定义⾃自⼰己材质滤镜的基础

刚刚我们⾃自定义的滤镜,只能输⼊入⼀一个图⽚片,也就是我们需要处理理的图⽚片
GPUImageTwoInputFilter
GPUImage ⾃自带滤镜之⼀一
可以输⼊入两个 texture,正常的滤镜会
把待处理理的图像作为⼀一个 texture
我们可以添加⾃自⼰己的 texture 来⾃自定义
更更⾼高级的滤镜
texture1
texture2
GPUImageTwoInputFilter 是⾃自定义⾃自⼰己材质滤镜的基础

刚刚我们⾃自定义的滤镜,只能输⼊入⼀一个图⽚片,也就是我们需要处理理的图⽚片
demo
看看 gpuimage 的 demo
GPUImageFilter - ⼈人⾁肉播放器器 Advanced
x.mp4
AVPlayerItem AVPlayer
AVPlayerItemVideoOutput
CVPixelBuffer
CADisplay
Link
Filter
刚才的⼈人⾁肉播放器器⼤大家还记不不记得

现在我们知道了了 CVPixelBuffer 如何操作和处理理了了,那我们接下来就可以给视频加效果了了
CVPixelBuffer 的⽤用途
AVPlayerItemVideoOutput,播放时实时图像处理理
AVCaptureVideoDataOutput,拍摄时实时图像处理理
AVAssetWriterInputPixelBufferAdaptor,导出视频时对视频进⾏行行处理理
前⾯面介绍了了两个对 buffer 的使⽤用地⽅方,还有最后⼀一个地⽅方,那就是 AVAssetWriterInputPixelBufferAdaptor,这个是在视频导出的时候,我们需要⾃自定义输出的 pixel buffer
如何处理理时使⽤用的,对于导出,推荐⼤大家使⽤用 SDAVAssetExportSession,对 原来的 export session 做了了⽐比较好的包装,也⽀支持格式,样式⾃自定义,composition
instructions,和处理理 pixel buffer 的代理理
demo
增加滤镜的 播放器器的 demo 和导出的 demo
推荐的道具们
AVFoundation,所有基本的视频操作都在⾥里里⾯面
Core Video,提供了了视频数据操作的⼯工具
GPUImage,为我等不不懂 OpenGL 的⼈人⼴广开滤镜⼤大⻔门
SDAVAssetExportSession,导出视频⼀一条⻰龙服务
SCRecorder,录制和预览的好道具
iOS 内所有视频的基础
这只是刚踏⼊入了了 iOS 视频处理理的⻔门⼝口
接下来你还有很多⼤大坑要踩
因为我们现在做的所有的操作,除了了 GPUImage 的部分,都在 CPU 上,在 CPU 上进⾏行行图像处理理的效率是很低的,所以更更多⼈人去学习使⽤用了了 OpenGL
继续深⼊入?
如何显示图像——OpenGL
如何处理理图像——Shader Language
如何编码解码视频——Video Toolbox / ffmpeg
如何直播——librtmp
建议⼤大家⼀一步⼀一步学⼀一学上⾯面的东⻄西,可以从根本上解决很多问题,并且这是上⾯面的内容除了了 VideoToolbox 以外都是独⽴立于平台的⼯工具
看了了这么多,还不不快⽤用新姿势开始挣钱?
看了了这么多,还不不快⽤用新姿势开始挣钱?

More Related Content

Viewers also liked

Principios y roles scrum 20170303
Principios y roles scrum 20170303Principios y roles scrum 20170303
Principios y roles scrum 20170303Open Source Pyme
 
A survey on energy efficient with task consolidation in the virtualized cloud...
A survey on energy efficient with task consolidation in the virtualized cloud...A survey on energy efficient with task consolidation in the virtualized cloud...
A survey on energy efficient with task consolidation in the virtualized cloud...eSAT Journals
 
Игра-конференция «Звёздный час» для учащихся 8–9 классов
Игра-конференция «Звёздный час» для учащихся 8–9 классовИгра-конференция «Звёздный час» для учащихся 8–9 классов
Игра-конференция «Звёздный час» для учащихся 8–9 классовDROFA-VENTANA
 
Market structures and price determination
Market structures and price determinationMarket structures and price determination
Market structures and price determinationHarinadh Karimikonda
 
How To Help Leaders Effectively Manage Today’s Human Capital
How To Help Leaders Effectively Manage Today’s Human CapitalHow To Help Leaders Effectively Manage Today’s Human Capital
How To Help Leaders Effectively Manage Today’s Human CapitalClearCompany
 

Viewers also liked (6)

Principios y roles scrum 20170303
Principios y roles scrum 20170303Principios y roles scrum 20170303
Principios y roles scrum 20170303
 
A survey on energy efficient with task consolidation in the virtualized cloud...
A survey on energy efficient with task consolidation in the virtualized cloud...A survey on energy efficient with task consolidation in the virtualized cloud...
A survey on energy efficient with task consolidation in the virtualized cloud...
 
Игра-конференция «Звёздный час» для учащихся 8–9 классов
Игра-конференция «Звёздный час» для учащихся 8–9 классовИгра-конференция «Звёздный час» для учащихся 8–9 классов
Игра-конференция «Звёздный час» для учащихся 8–9 классов
 
Market structures and price determination
Market structures and price determinationMarket structures and price determination
Market structures and price determination
 
(1)hidrologia.clase 1 power point
(1)hidrologia.clase 1 power point(1)hidrologia.clase 1 power point
(1)hidrologia.clase 1 power point
 
How To Help Leaders Effectively Manage Today’s Human Capital
How To Help Leaders Effectively Manage Today’s Human CapitalHow To Help Leaders Effectively Manage Today’s Human Capital
How To Help Leaders Effectively Manage Today’s Human Capital
 

Similar to iOS 视频 app 开发实践

移动互联网上的微视频处理与分发
移动互联网上的微视频处理与分发移动互联网上的微视频处理与分发
移动互联网上的微视频处理与分发drewz lin
 
Make an i os application
Make an i os applicationMake an i os application
Make an i os applicationfroooo
 
Take Advantage of UIWebView for iOS Native App Developers
Take Advantage of UIWebView for iOS Native App DevelopersTake Advantage of UIWebView for iOS Native App Developers
Take Advantage of UIWebView for iOS Native App DevelopersRyan Chung
 
Zoom taiwan launch
Zoom taiwan launchZoom taiwan launch
Zoom taiwan launchRobertZoom
 
Zoom taiwan launch ppt 11192014
Zoom taiwan launch ppt 11192014Zoom taiwan launch ppt 11192014
Zoom taiwan launch ppt 11192014RobertZoom
 
多媒体元素的网页呈现
多媒体元素的网页呈现多媒体元素的网页呈现
多媒体元素的网页呈现mazhenglu
 
PIXNET iOS SDK @OSDC 2014
PIXNET iOS SDK @OSDC 2014PIXNET iOS SDK @OSDC 2014
PIXNET iOS SDK @OSDC 2014Cloud Sung
 
2011/08/20跨平台行動應用程式使用者介面開發—以titanium mobile為例
2011/08/20跨平台行動應用程式使用者介面開發—以titanium mobile為例2011/08/20跨平台行動應用程式使用者介面開發—以titanium mobile為例
2011/08/20跨平台行動應用程式使用者介面開發—以titanium mobile為例Justin Lee
 
容器驅動開發 - .NET Conf 2017 @ 台中
容器驅動開發 - .NET Conf 2017 @ 台中容器驅動開發 - .NET Conf 2017 @ 台中
容器驅動開發 - .NET Conf 2017 @ 台中Andrew Wu
 
EOS_2015_Fall Team6 - One to Ten App Design Toolkit
EOS_2015_Fall  Team6 - One to Ten App Design ToolkitEOS_2015_Fall  Team6 - One to Ten App Design Toolkit
EOS_2015_Fall Team6 - One to Ten App Design Toolkitnctusee
 
影片編碼與分享
影片編碼與分享影片編碼與分享
影片編碼與分享Andy Juang
 
20141212 html5 及微軟跨平台佈局 long
20141212 html5 及微軟跨平台佈局   long20141212 html5 及微軟跨平台佈局   long
20141212 html5 及微軟跨平台佈局 longMeng-Ru (Raymond) Tsai
 

Similar to iOS 视频 app 开发实践 (12)

移动互联网上的微视频处理与分发
移动互联网上的微视频处理与分发移动互联网上的微视频处理与分发
移动互联网上的微视频处理与分发
 
Make an i os application
Make an i os applicationMake an i os application
Make an i os application
 
Take Advantage of UIWebView for iOS Native App Developers
Take Advantage of UIWebView for iOS Native App DevelopersTake Advantage of UIWebView for iOS Native App Developers
Take Advantage of UIWebView for iOS Native App Developers
 
Zoom taiwan launch
Zoom taiwan launchZoom taiwan launch
Zoom taiwan launch
 
Zoom taiwan launch ppt 11192014
Zoom taiwan launch ppt 11192014Zoom taiwan launch ppt 11192014
Zoom taiwan launch ppt 11192014
 
多媒体元素的网页呈现
多媒体元素的网页呈现多媒体元素的网页呈现
多媒体元素的网页呈现
 
PIXNET iOS SDK @OSDC 2014
PIXNET iOS SDK @OSDC 2014PIXNET iOS SDK @OSDC 2014
PIXNET iOS SDK @OSDC 2014
 
2011/08/20跨平台行動應用程式使用者介面開發—以titanium mobile為例
2011/08/20跨平台行動應用程式使用者介面開發—以titanium mobile為例2011/08/20跨平台行動應用程式使用者介面開發—以titanium mobile為例
2011/08/20跨平台行動應用程式使用者介面開發—以titanium mobile為例
 
容器驅動開發 - .NET Conf 2017 @ 台中
容器驅動開發 - .NET Conf 2017 @ 台中容器驅動開發 - .NET Conf 2017 @ 台中
容器驅動開發 - .NET Conf 2017 @ 台中
 
EOS_2015_Fall Team6 - One to Ten App Design Toolkit
EOS_2015_Fall  Team6 - One to Ten App Design ToolkitEOS_2015_Fall  Team6 - One to Ten App Design Toolkit
EOS_2015_Fall Team6 - One to Ten App Design Toolkit
 
影片編碼與分享
影片編碼與分享影片編碼與分享
影片編碼與分享
 
20141212 html5 及微軟跨平台佈局 long
20141212 html5 及微軟跨平台佈局   long20141212 html5 及微軟跨平台佈局   long
20141212 html5 及微軟跨平台佈局 long
 

iOS 视频 app 开发实践