GIF + 视频采集 + GPUImage + 视频编码
播放 Gif 图
需要使用
ImageIO
框架 思路:
1.Gif 图 ->CGImageSource
->[UIImage]
2.取出每张图片的时间计算总时间
3.设置imageView.animationImages
属性
4.imageView.startAnimating()
// 1.加载Gif图片,并转化为Data类型
guard let path = Bundle.main.path(forResource: "demo.gif", ofType: nil) else {
return
}
guard let data = NSData(contentsOfFile: path) else {
return
}
// 2.从data中读取数据:将data转场CGImageSource对象
guard let imageSource = CGImageSourceCreateWithData(data, nil) else {
return
}
let imageCount = CGImageSourceGetCount(imageSource)
// 3.遍历所有照片
var images = [UIImage]()
var totalDuration: TimeInterval = 0
for i in 0..
视频采集
用到
AVFoundation
的AVCaptureSession
- 首先定义一个
seesion
属性
fileprivate lazy var session: AVCaptureSession = AVCaptureSession()
- 初始化视频的输入&输出
// 1.添加视频输入
let devices = AVCaptureDevice.devices()
// 选择前置摄像头
guard let device = devices.filter({ $0.position == .front }).first else {
return
}
guard let input = try? AVCaptureDeviceInput(device: device) else {
return
}
// 2.创建视频输出
let output = AVCaptureVideoDataOutput()
let queue = DispatchQueue.global()
// 设置代理
output.setSampleBufferDelegate(self, queue: queue)
// 3.添加输入&输出
session.beginConfiguration()
if session.canAddInput(input) {
session.addInput(input)
}
if session.canAddOutput(output) {
session.addOutput(output)
}
session.commitConfiguration()
- 初始化音频的输入&输出
// 1.创建音频输入
guard let devices = AVCaptureDevice.default(for: .audio) else {
return
}
guard let input = try? AVCaptureDeviceInput(device: devices) else {
return
}
// 2.创建音频输出
let output = AVCaptureAudioDataOutput()
let queue = DispatchQueue.global()
output.setSampleBufferDelegate(self, queue: queue)
// 3.添加输入&输出
session.beginConfiguration()
if session.canAddInput(input) {
session.addInput(input)
}
if session.canAddOutput(output) {
session.addOutput(output)
}
session.commitConfiguration()
- 遵守输入输出代理协议
extension ViewController: AVCaptureVideoDataOutputSampleBufferDelegate, AVCaptureAudioDataOutputSampleBufferDelegate {
// 监听每一帧画面
func captureOutput(_ output: AVCaptureOutput, didOutput sampleBuffer: CMSampleBuffer, from connection: AVCaptureConnection) {
print("采集视频")
}
}
- 初始化一个预览图层
// 1.创建预览图层
let previewLayer = AVCaptureVideoPreviewLayer(session: session)
// 2.设置previewLayer属性
previewLayer.frame = view.bounds
self.previewLayer = previewLayer
// 3.将图层添加到控制器的View的layer中
view.layer.insertSublayer(previewLayer, at: 0)
- 转换摄像头
// 1.取出之前镜头的方向
guard let videoInput = videoInput else {
return
}
let postion: AVCaptureDevice.Position = videoInput.device.position == .front ? .back : .front
// 2.重新设置视频输入
let devices = AVCaptureDevice.devices()
guard let device = devices.filter({ $0.position == postion }).first else {
return
}
guard let newInput = try? AVCaptureDeviceInput(device: device) else {
return
}
// 3.移除之前的input, 添加新的input
session.beginConfiguration()
session.removeInput(videoInput)
if session.canAddInput(newInput) {
session.addInput(newInput)
}
session.commitConfiguration()
// 4.保存最新的input
self.videoInput = newInput
- 录制视频存入本地沙盒(替换视频输出)
fileprivate func setupMovieFileOutput() {
guard let output = videoOutput else {
return
}
session.removeOutput(output)
// 1.创建写入文件的输出
let fileOutout = AVCaptureMovieFileOutput()
movieOutput = fileOutout
let connection = fileOutout.connection(with: .video)
connection?.automaticallyAdjustsVideoMirroring = true
if session.canAddOutput(fileOutout) {
session.addOutput(fileOutout)
}
// 2.直接开始写入文件
let filePath = NSSearchPathForDirectoriesInDomains(.documentDirectory, .userDomainMask, true).first! + "/abc.mp4"
videoPath = filePath
let fileURL = URL(fileURLWithPath: filePath)
// 设置代理
fileOutout.startRecording(to: fileURL, recordingDelegate: self)
}
// MARK: - 通过代理监听开始写入文件,以及结束写入文件
extension ViewController: AVCaptureFileOutputRecordingDelegate {
func fileOutput(_ output: AVCaptureFileOutput, didStartRecordingTo fileURL: URL, from connections: [AVCaptureConnection]) {
print("开始写入文件")
}
func fileOutput(_ output: AVCaptureFileOutput, didFinishRecordingTo outputFileURL: URL, from connections: [AVCaptureConnection], error: Error?) {
print("完成写入文件")
}
}
美颜滤镜效果
GPUImage
- GPUImage 是一个开源的基于GPU的图片或视频的处理框架,其本身内置了多达120多种常见的滤镜效果
- GPUImage是利用GPU,使在图片和视频上应用不同的效果和滤镜变得非常的容易,同时它还拥有出色的性能,并且它的性能要比苹果内置的相关APIs出色
GPUImage使用 - 高斯模糊效果
1.UIToolBar本身有毛玻璃效果
2.iOS8之后UIVisualEffectView直接创建毛玻璃View
3.系统CoreImage框架中直接修改图片
4.GPUImage框架给图片添加一层滤镜总结:前两种在照片上面加一层View,后两种方法直接修改图片
-
实现思路
- 获取要修改成毛玻璃的图片
- 给图片添加滤镜
- 生成新的图片
实现代码
// 1.获取修改的图片
let sourceImage = UIImage(named: "test")!
// 2.使用GPUImage高斯模糊效果
// 2.1.如果是对图像进行处理GPUImagePicture
let picProcess = GPUImagePicture(image: sourceImage)
// 2.2.添加需要处理的滤镜
let blurFilter = GPUImageGaussianBlurFilter()
// 纹理
blurFilter.texelSpacingMultiplier = 5
blurFilter.blurRadiusInPixels = 5
picProcess?.addTarget(blurFilter)
// 2.3.处理照片
blurFilter.useNextFrameForImageCapture()
picProcess?.processImage()
// 2.4.取出最新的照片
let newImage = blurFilter.imageFromCurrentFramebuffer()
// 3.显示最新的照片
imageView.image = newImage
其它滤镜效果
- 多个target依赖相同的库(Ruby语法)
platform :ios, '9.0'
use_frameworks!
targetsArray = ['01-GPUImage毛玻璃', '02-GPUImage其他滤镜']
targetsArray.each do |t|
target t do
pod 'GPUImage'
end
end
- 常见滤镜
#pragma mark - 调整颜色 Handle Color
#import "GPUImageBrightnessFilter.h" //亮度
#import "GPUImageExposureFilter.h" //曝光
#import "GPUImageContrastFilter.h" //对比度
#import "GPUImageSaturationFilter.h" //饱和度
#import "GPUImageGammaFilter.h" //伽马线
#import "GPUImageColorInvertFilter.h" //反色
#import "GPUImageSepiaFilter.h" //褐色(怀旧)
#import "GPUImageLevelsFilter.h" //色阶
#import "GPUImageGrayscaleFilter.h" //灰度
#import "GPUImageHistogramFilter.h" //色彩直方图,显示在图片上
#import "GPUImageHistogramGenerator.h" //色彩直方图
#import "GPUImageRGBFilter.h" //RGB
#import "GPUImageToneCurveFilter.h" //色调曲线
#import "GPUImageMonochromeFilter.h" //单色
#import "GPUImageOpacityFilter.h" //不透明度
#import "GPUImageHighlightShadowFilter.h" //提亮阴影
#import "GPUImageFalseColorFilter.h" //色彩替换(替换亮部和暗部色彩)
#import "GPUImageHueFilter.h" //色度
#import "GPUImageChromaKeyFilter.h" //色度键
#import "GPUImageWhiteBalanceFilter.h" //白平横
#import "GPUImageAverageColor.h" //像素平均色值
#import "GPUImageSolidColorGenerator.h" //纯色
#import "GPUImageLuminosity.h" //亮度平均
#import "GPUImageAverageLuminanceThresholdFilter.h" //像素色值亮度平均,图像黑白(有类似漫画效果)
#import "GPUImageLookupFilter.h" //lookup 色彩调整
#import "GPUImageAmatorkaFilter.h" //Amatorka lookup
#import "GPUImageMissEtikateFilter.h" //MissEtikate lookup
#import "GPUImageSoftEleganceFilter.h" //SoftElegance lookup
#pragma mark - 图像处理 Handle Image
#import "GPUImageCrosshairGenerator.h" //十字
#import "GPUImageLineGenerator.h" //线条
#import "GPUImageTransformFilter.h" //形状变化
#import "GPUImageCropFilter.h" //剪裁
#import "GPUImageSharpenFilter.h" //锐化
#import "GPUImageUnsharpMaskFilter.h" //反遮罩锐化
#import "GPUImageFastBlurFilter.h" //模糊
#import "GPUImageGaussianBlurFilter.h" //高斯模糊
#import "GPUImageGaussianSelectiveBlurFilter.h" //高斯模糊,选择部分清晰
#import "GPUImageBoxBlurFilter.h" //盒状模糊
#import "GPUImageTiltShiftFilter.h" //条纹模糊,中间清晰,上下两端模糊
#import "GPUImageMedianFilter.h" //中间值,有种稍微模糊边缘的效果
#import "GPUImageBilateralFilter.h" //双边模糊
#import "GPUImageErosionFilter.h" //侵蚀边缘模糊,变黑白
#import "GPUImageRGBErosionFilter.h" //RGB侵蚀边缘模糊,有色彩
#import "GPUImageDilationFilter.h" //扩展边缘模糊,变黑白
#import "GPUImageRGBDilationFilter.h" //RGB扩展边缘模糊,有色彩
#import "GPUImageOpeningFilter.h" //黑白色调模糊
#import "GPUImageRGBOpeningFilter.h" //彩色模糊
#import "GPUImageClosingFilter.h" //黑白色调模糊,暗色会被提亮
#import "GPUImageRGBClosingFilter.h" //彩色模糊,暗色会被提亮
#import "GPUImageLanczosResamplingFilter.h" //Lanczos重取样,模糊效果
#import "GPUImageNonMaximumSuppressionFilter.h" //非最大抑制,只显示亮度最高的像素,其他为黑
#import "GPUImageThresholdedNonMaximumSuppressionFilter.h" //与上相比,像素丢失更多
#import "GPUImageSobelEdgeDetectionFilter.h" //Sobel边缘检测算法(白边,黑内容,有点漫画的反色效果)
#import "GPUImageCannyEdgeDetectionFilter.h" //Canny边缘检测算法(比上更强烈的黑白对比度)
#import "GPUImageThresholdEdgeDetectionFilter.h" //阈值边缘检测(效果与上差别不大)
#import "GPUImagePrewittEdgeDetectionFilter.h" //普瑞维特(Prewitt)边缘检测(效果与Sobel差不多,貌似更平滑)
#import "GPUImageXYDerivativeFilter.h" //XYDerivative边缘检测,画面以蓝色为主,绿色为边缘,带彩色
#import "GPUImageHarrisCornerDetectionFilter.h" //Harris角点检测,会有绿色小十字显示在图片角点处
#import "GPUImageNobleCornerDetectionFilter.h" //Noble角点检测,检测点更多
#import "GPUImageShiTomasiFeatureDetectionFilter.h" //ShiTomasi角点检测,与上差别不大
#import "GPUImageMotionDetector.h" //动作检测
#import "GPUImageHoughTransformLineDetector.h" //线条检测
#import "GPUImageParallelCoordinateLineTransformFilter.h" //平行线检测
#import "GPUImageLocalBinaryPatternFilter.h" //图像黑白化,并有大量噪点
#import "GPUImageLowPassFilter.h" //用于图像加亮
#import "GPUImageHighPassFilter.h" //图像低于某值时显示为黑
#pragma mark - 视觉效果 Visual Effect
#import "GPUImageSketchFilter.h" //素描
#import "GPUImageThresholdSketchFilter.h" //阀值素描,形成有噪点的素描
#import "GPUImageToonFilter.h" //卡通效果(黑色粗线描边)
#import "GPUImageSmoothToonFilter.h" //相比上面的效果更细腻,上面是粗旷的画风
#import "GPUImageKuwaharaFilter.h" //桑原(Kuwahara)滤波,水粉画的模糊效果;处理时间比较长,慎用
#import "GPUImageMosaicFilter.h" //黑白马赛克
#import "GPUImagePixellateFilter.h" //像素化
#import "GPUImagePolarPixellateFilter.h" //同心圆像素化
#import "GPUImageCrosshatchFilter.h" //交叉线阴影,形成黑白网状画面
#import "GPUImageColorPackingFilter.h" //色彩丢失,模糊(类似监控摄像效果)
#import "GPUImageVignetteFilter.h" //晕影,形成黑色圆形边缘,突出中间图像的效果
#import "GPUImageSwirlFilter.h" //漩涡,中间形成卷曲的画面
#import "GPUImageBulgeDistortionFilter.h" //凸起失真,鱼眼效果
#import "GPUImagePinchDistortionFilter.h" //收缩失真,凹面镜
#import "GPUImageStretchDistortionFilter.h" //伸展失真,哈哈镜
#import "GPUImageGlassSphereFilter.h" //水晶球效果
#import "GPUImageSphereRefractionFilter.h" //球形折射,图形倒立
#import "GPUImagePosterizeFilter.h" //色调分离,形成噪点效果
#import "GPUImageCGAColorspaceFilter.h" //CGA色彩滤镜,形成黑、浅蓝、紫色块的画面
#import "GPUImagePerlinNoiseFilter.h" //柏林噪点,花边噪点
#import "GPUImage3x3ConvolutionFilter.h" //3x3卷积,高亮大色块变黑,加亮边缘、线条等
#import "GPUImageEmbossFilter.h" //浮雕效果,带有点3d的感觉
#import "GPUImagePolkaDotFilter.h" //像素圆点花样
#import "GPUImageHalftoneFilter.h" //点染,图像黑白化,由黑点构成原图的大致图形
#pragma mark - 混合模式 Blend
#import "GPUImageMultiplyBlendFilter.h" //通常用于创建阴影和深度效果
#import "GPUImageNormalBlendFilter.h" //正常
#import "GPUImageAlphaBlendFilter.h" //透明混合,通常用于在背景上应用前景的透明度
#import "GPUImageDissolveBlendFilter.h" //溶解
#import "GPUImageOverlayBlendFilter.h" //叠加,通常用于创建阴影效果
#import "GPUImageDarkenBlendFilter.h" //加深混合,通常用于重叠类型
#import "GPUImageLightenBlendFilter.h" //减淡混合,通常用于重叠类型
#import "GPUImageSourceOverBlendFilter.h" //源混合
#import "GPUImageColorBurnBlendFilter.h" //色彩加深混合
#import "GPUImageColorDodgeBlendFilter.h" //色彩减淡混合
#import "GPUImageScreenBlendFilter.h" //屏幕包裹,通常用于创建亮点和镜头眩光
#import "GPUImageExclusionBlendFilter.h" //排除混合
#import "GPUImageDifferenceBlendFilter.h" //差异混合,通常用于创建更多变动的颜色
#import "GPUImageSubtractBlendFilter.h" //差值混合,通常用于创建两个图像之间的动画变暗模糊效果
#import "GPUImageHardLightBlendFilter.h" //强光混合,通常用于创建阴影效果
#import "GPUImageSoftLightBlendFilter.h" //柔光混合
#import "GPUImageChromaKeyBlendFilter.h" //色度键混合
#import "GPUImageMaskFilter.h" //遮罩混合
#import "GPUImageHazeFilter.h" //朦胧加暗
#import "GPUImageLuminanceThresholdFilter.h" //亮度阈
#import "GPUImageAdaptiveThresholdFilter.h" //自适应阈值
#import "GPUImageAddBlendFilter.h" //通常用于创建两个图像之间的动画变亮模糊效果
#import "GPUImageDivideBlendFilter.h" //通常用于创建两个图像之间的动画变暗模糊效果
美颜相机
-
实现思路
- 创建相机
GPUImageStillCamera
- 创建滤镜
GPUImageFilter
- 创建
GPUImageView
显示实时画面 - 捕捉画面
- 拍照保存到相册
- 结束捕捉画面
- 创建相机
实现代码
// 1.创建GPUImageStillCamera
var camera:GPUImageStillCamera = GPUImageStillCamera(sessionPreset: AVCaptureSession.Preset.high, cameraPosition: .front)
// 设置相机的方向
camera.outputImageOrientation = .portrait
// 2.创建滤镜(美白)
var filter: GPUImageFilter = GPUImageBrightnessFilter()
filter.brightness = 0.5
camera.addTarget(filter)
// 3.创建GPUImageView,用于显示实时画面
let showView = GPUImageView(frame: view.bounds)
view.insertSubview(showView, at: 0)
filter.addTarget(showView)
// 4.开始捕捉画面
camera.startCapture()
// 拍照
camera.capturePhotoAsImageProcessedUp(toFilter: filter) { (image, error) in
UIImageWriteToSavedPhotosAlbum(image, nil, nil, nil)
camera.stopCapture()
}
实时画面
- 遵守
GPUImageVideoCameraDelegate
j监听每一帧的画面
func willOutputSampleBuffer(_ sampleBuffer: CMSampleBuffer!) {
print("采集到画面")
}
斗鱼直播画面 (多个滤镜)
- 一次性使用多个滤镜 先创建滤镜组
GPUImageFilterGroup
// 1.创建滤镜组(用于存放各种滤镜:美白、磨皮等等)
let filterGroup = GPUImageFilterGroup()
// 2.创建滤镜(设置滤镜的引来关系)
bilateralFilter.addTarget(brightnessFilter)
brightnessFilter.addTarget(exposureFilter)
exposureFilter.addTarget(satureationFilter)
// 3.设置滤镜组链初始&终点的filter
filterGroup.initialFilters = [bilateralFilter]
filterGroup.terminalFilter = satureationFilter
// 4.设置GPUImage的响应链
camera?.addTarget(filterGroup)
视频编码
为什么进行压缩编码?
- 视频是由一帧帧的图像组成
- 未经压缩的视频的数据量巨大
为什么视频可以压缩编码?
- 存在冗余信息
- 空间冗余:图像相邻像素之间有较强的相关性
- 时间冗余:视频序列的相邻图像之间内容相似
- 视觉冗余:人的视觉系统对某些细节不敏感
目前应用最广泛的H.264(AVC)
- H264是新一代的编码标准,以高压缩高质量和支持多种网络的流媒体传输著称
编码方式
-
编码的方式有两种:
- 硬编码:使用非CPU进行编码,如显卡GPU、专用的DSP、FPGA、ASIC芯片等
- 软编码:使用CPU进行编码,软编码通常使用:ffmpeg+x264
-
对比
- 软编码:实现直接、简单,参数调整方便,升级易,但CPU负载重,性能较硬编码低
- 硬编码:性能高,对CPU没有压力,但是对其他硬件要求较高(如GPU等)
-
iOS中编码方式:
- 在iOS8之前,苹果并没有开放硬编码的接口,所以只能采用ffpeng+x624进行软编码
- 在iOS8之后,苹果开放了接口,并且封装了VideoToolBox&AudioToolbox两个框架,分别用于对视频&音频进行硬编码