本文介绍了如何使用 GPUImage 来实现一个简单的相机。具体功能包括拍照、录制视频、多段视频合成、实时美颜、自定义滤镜实现等。
AVFoundation 是苹果提供的用于处理基于时间的媒体数据的一个框架。我们想要实现一个相机，需要从手机摄像头采集数据，离不开这个框架的支持。GPUImage 对 AVFoundation 做了一些封装，使我们的采集工作变得十分简单。
另外，GPUImage 的核心魅力还在于，它封装了一个链路结构的图像数据处理流程，简称滤镜链。滤镜链的结构使得多层滤镜的叠加功能变得很容易实现。
在下面介绍的功能中，有一些和 GPUImage 本身的关系并不大，我们是直接调用 AVFoundation 的 API 来实现的。但是，这些功能也是一个相机应用必不可少的一部分。所以，我们也会简单讲一下每个功能的实现方式和注意事项。
在 GPUImage 中，对图像数据的处理都是通过建立滤镜链来实现的。
这里就涉及到了一个类 GPUImageOutput 和一个协议 GPUImageInput 。对于继承了 GPUImageOutput 的类，可以理解为具备输出图像数据的能力；对于实现了 GPUImageInput 协议的类，可以理解为具备接收图像数据输入的能力。
顾名思义，滤镜链作为一个链路，具有起点和终点。根据前面的描述，滤镜链的起点应该只继承了 GPUImageOutput 类，滤镜链的终点应该只实现了 GPUImageInput 协议，而对于中间的结点应该同时继承了 GPUImageOutput 类并实现了 GPUImageInput 协议，这样才具备承上启下的作用。
在 GPUImage 中，只继承了 GPUImageOutput，而没有实现 GPUImageInput 协议的类有六个，也就是说有六种类型的输入源：
1、GPUImagePicture
GPUImagePicture 通过图片来初始化，本质上是先将图片转化为 CGImageRef，然后将 CGImageRef 转化为纹理。
2、GPUImageRawDataInput
GPUImageRawDataInput 通过二进制数据初始化，然后将二进制数据转化为纹理，在初始化的时候需要指明数据的格式（GPUPixelFormat）。
3、GPUImageTextureInput
GPUImageTextureInput 通过已经存在的纹理来初始化。既然纹理已经存在，在初始化的时候就不会重新去生成，只是将纹理的索引保存下来。
4、GPUImageUIElement
GPUImageUIElement 可以通过 UIView 或者 CALayer 来初始化，最后都是调用 CALayer 的 renderInContext: 方法，将当前显示的内容绘制到 CoreGraphics 的上下文中，从而获取图像数据。然后将数据转化为纹理。简单来说就是截屏，截取当前控件的内容。
这个类可以用来实现在视频上添加文字水印的功能。因为在 OpenGL 中不能直接进行文本的绘制，所以如果我们想把一个 UILabel 的内容添加到滤镜链里面去，使用 GPUImageUIElement 来实现是很合适的。
5、GPUImageMovie
GPUImageMovie 通过本地的视频来初始化。首先通过 AVAssetReader 来逐帧读取视频，然后将帧数据转化为纹理，具体的流程大概是：AVAssetReaderOutput -> CMSampleBufferRef -> CVImageBufferRef -> CVOpenGLESTextureRef -> Texture 。
6、GPUImageVideoCamera
GPUImageVideoCamera 通过相机参数来初始化，通过屏幕比例和相机位置（前后置）来初始化相机。这里主要使用 AVCaptureVideoDataOutput 来获取持续的视频流数据输出，在代理方法 captureOutput:didOutputSampleBuffer:fromConnection: 中可以拿到 CMSampleBufferRef ，将其转化为纹理的过程与 GPUImageMovie 类似。
然而，我们在项目中使用的是它的子类 GPUImageStillCamera。 GPUImageStillCamera 在原来的基础上多了一个 AVCaptureStillImageOutput，它是我们实现拍照功能的关键，在 captureStillImageAsynchronouslyFromConnection:completionHandler: 方法的回调中，同样能拿到我们熟悉 CMSampleBufferRef。
简单来说，GPUImageVideoCamera 只能录制视频，GPUImageStillCamera 还可以拍照，因此我们使用 GPUImageStillCamera 。
滤镜链的关键角色是 GPUImageFilter，它同时继承了 GPUImageOutput 类并实现了 GPUImageInput 协议。GPUImageFilter 实现承上启下功能的基础是「渲染到纹理」，这个操作我们在 《使用 iOS OpenGL ES 实现长腿功能》 一文中已经介绍过了，简单来说就是将结果渲染到纹理而不是屏幕上。
这样，每一个滤镜都能把输出的纹理作为下一个滤镜的输入，实现多层滤镜效果的叠加。
在 GPUImage 中，实现了 GPUImageInput 协议，而没有继承 GPUImageOutput 的类有四个：
1、GPUImageMovieWriter
GPUImageMovieWriter 封装了 AVAssetWriter，可以逐帧从帧缓存的渲染结果中读取数据，最后通过 AVAssetWriter 将视频文件保存到指定的路径。
2、GPUImageRawDataOutput
GPUImageRawDataOutput 通过 rawBytesForImage 属性，可以获取到当前输入纹理的二进制数据。
假设我们的滤镜链在输入源和终点之间，连接了三个滤镜，而我们需要拿到第二个滤镜渲染后的数据，用来做人脸识别。那我们可以在第二个滤镜后面再添加一个 GPUImageRawDataOutput 作为输出，则可以拿到对应的二进制数据，且不会影响原来的渲染流程。
3、GPUImageTextureOutput
这个类的实现十分简单，提供协议方法 newFrameReadyFromTextureOutput:，在每一帧渲染结束后，将自身返回，通过 texture 属性就可以拿到输入纹理的索引。
4、GPUImageView
GPUImageView 继承自 UIView，通过输入的纹理，执行一遍渲染流程。这次的渲染目标不是新的纹理，而是自身的 layer 。
这个类是我们实现相机功能的重要组成部分，我们所有的滤镜效果，都要依靠它来呈现。
拍照功能只需调用一个接口就能搞定，在回调方法中可以直接拿到 UIImage。代码如下：
- (void)takePhotoWtihCompletion:(TakePhotoResult)completion {
GPUImageFilter *lastFilter = self.currentFilterHandler.lastFilter;
[self.camera capturePhotoAsImageProcessedUpToFilter:lastFilter withCompletionHandler:^(UIImage *processedImage, NSError *error) {
if (error && completion) {
completion(nil, error);
return;
}
if (completion) {
completion(processedImage, nil);
}
}];
}
值得注意的是，相机的预览页面由 GPUImageView 承载，显示的是整个滤镜链作用的结果。而我们的拍照接口，可以传入这个链路上的任意一个滤镜，甚至可以在后面多加一个滤镜，然后拍照接口会返回对应滤镜的渲染结果。即我们的拍照结果不一定要和我们的预览一致。
示意图如下：
1、单段录制
录制视频首先要创建一个 GPUImageMovieWriter 作为链路的输出，与上面的拍照接口类似，这里录制的视频不一定和我们的预览一样。
整个过程比较简单，当我们调用停止录制的接口并回调之后，视频就被保存到我们指定的路径了。
- (void)setupMovieWriter {
NSString *videoPath = [SCFileHelper randomFilePathInTmpWithSuffix:@".m4v"];
NSURL *videoURL = [NSURL fileURLWithPath:videoPath];
CGSize videoSize = self.videoSize;
self.movieWriter = [[GPUImageMovieWriter alloc] initWithMovieURL:videoURL
size:videoSize];
GPUImageFilter *lastFilter = self.currentFilterHandler.lastFilter;
[lastFilter addTarget:self.movieWriter];
self.camera.audioEncodingTarget = self.movieWriter;
self.movieWriter.shouldPassthroughAudio = YES;
self.currentTmpVideoPath = videoPath;
}
- (void)recordVideo {
[self setupMovieWriter];
[self.movieWriter startRecording];
}
- (void)stopRecordVideoWithCompletion:(RecordVideoResult)completion {
@weakify(self);
[self.movieWriter finishRecordingWithCompletionHandler:^{
@strongify(self);
[self removeMovieWriter];
if (completion) {
completion(self.currentTmpVideoPath);
}
}];
}
2、多段录制
在 GPUImage 中并没有提供多段录制的功能，需要我们自己去实现。
首先，我们要重复单段视频的录制过程，这样我们就有了多段视频的文件路径。然后主要实现两个功能，一个是 AVPlayer 的多段视频循环播放；另一个是通过 AVComposition 来合并多段视频，并用 AVAssetExportSession 来导出新的视频。
整个过程逻辑并不复杂，出于篇幅的考虑，代码就不贴了，请到项目中查看。
在拍照或者录视频结束后，通过 PhotoKit 保存到相册里。
1、保存图片
- (void)writeImageToSavedPhotosAlbum:(UIImage *)image
completion:(void (^)(BOOL success))completion {
[[PHPhotoLibrary sharedPhotoLibrary] performChanges:^{
[PHAssetChangeRequest creationRequestForAssetFromImage:image];
} completionHandler:^(BOOL success, NSError * _Nullable error) {
if (completion) {
completion(success);
}
}];
}
2、保存视频
- (void)saveVideo:(NSString *)path completion:(void (^)(BOOL success))completion {
NSURL *url = [NSURL fileURLWithPath:path];
[[PHPhotoLibrary sharedPhotoLibrary] performChanges:^{
[PHAssetChangeRequest creationRequestForAssetFromVideoAtFileURL:url];
} completionHandler:^(BOOL success, NSError * _Nullable error) {
dispatch_async(dispatch_get_main_queue(), ^{
if (completion) {
completion(success);
}
});
}];
}
系统的闪光灯类型通过 AVCaptureDevice 的 flashMode 属性来控制，其实只有三种，分别是：
我们对这个两个属性做一下封装，允许这四种类型来回切换，下面是根据封装的类型来同步系统类型的代码：
- (void)syncFlashState {
AVCaptureDevice *device = self.camera.inputCamera;
if (![device hasFlash] || self.camera.cameraPosition == AVCaptureDevicePositionFront) {
[self closeFlashIfNeed];
return;
}
[device lockForConfiguration:nil];
switch (self.flashMode) {
case SCCameraFlashModeOff:
device.torchMode = AVCaptureTorchModeOff;
device.flashMode = AVCaptureFlashModeOff;
break;
case SCCameraFlashModeOn:
device.torchMode = AVCaptureTorchModeOff;
device.flashMode = AVCaptureFlashModeOn;
break;
case SCCameraFlashModeAuto:
device.torchMode = AVCaptureTorchModeOff;
device.flashMode = AVCaptureFlashModeAuto;
break;
case SCCameraFlashModeTorch:
device.torchMode = AVCaptureTorchModeOn;
device.flashMode = AVCaptureFlashModeOff;
break;
default:
break;
}
[device unlockForConfiguration];
}
相机的比例通过设置 AVCaptureSession 的 sessionPreset 属性来实现。这个属性并不只意味着比例，也意味着分辨率。
由于不是所有的设备都支持高分辨率，所以这里只使用 AVCaptureSessionPreset640x480 和 AVCaptureSessionPreset1280x720 这两个分辨率，分别用来作为 3:4 和 9:16 的输出。
市面上的相机除了上面的两个比例外，一般还支持 1:1 和 Full （iPhoneX 系列的全屏）比例，但是系统并没有提供对应比例的 AVCaptureSessionPreset 。
这里可以通过 GPUImageCropFilter 来实现，这是 GPUImage 的一个内置滤镜，可以对输入的纹理进行裁剪。使用时通过 cropRegion 属性来传入一个归一化的裁剪区域。
切换比例的关键代码如下：
- (void)setRatio:(SCCameraRatio)ratio {
_ratio = ratio;
CGRect rect = CGRectMake(0, 0, 1, 1);
if (ratio == SCCameraRatio1v1) {
self.camera.captureSessionPreset = AVCaptureSessionPreset640x480;
CGFloat space = (4 - 3) / 4.0; // 竖直方向应该裁剪掉的空间
rect = CGRectMake(0, space / 2, 1, 1 - space);
} else if (ratio == SCCameraRatio4v3) {
self.camera.captureSessionPreset = AVCaptureSessionPreset640x480;
} else if (ratio == SCCameraRatio16v9) {
self.camera.captureSessionPreset = AVCaptureSessionPreset1280x720;
} else if (ratio == SCCameraRatioFull) {
self.camera.captureSessionPreset = AVCaptureSessionPreset1280x720;
CGFloat currentRatio = SCREEN_HEIGHT / SCREEN_WIDTH;
if (currentRatio > 16.0 / 9.0) { // 需要在水平方向裁剪
CGFloat resultWidth = 16.0 / currentRatio;
CGFloat space = (9.0 - resultWidth) / 9.0;
rect = CGRectMake(space / 2, 0, 1 - space, 1);
} else { // 需要在竖直方向裁剪
CGFloat resultHeight = 9.0 * currentRatio;
CGFloat space = (16.0 - resultHeight) / 16.0;
rect = CGRectMake(0, space / 2, 1, 1 - space);
}
}
[self.currentFilterHandler setCropRect:rect];
self.videoSize = [self videoSizeWithRatio:ratio];
}
通过调用 GPUImageVideoCamera 的 rotateCamera 方法来实现。
另外，由于前置摄像头不支持闪光灯，如果在前置的时候去切换闪光灯，只能修改我们封装的类型。所以在切换到后置的时候，需要去同步一下系统的闪光灯类型：
- (void)rotateCamera {
[self.camera rotateCamera];
// 切换摄像头，同步一下闪光灯
[self syncFlashState];
}
AVCaptureDevice 的 focusMode 用来设置聚焦模式，focusPointOfInterest 用来设置聚焦点；exposureMode 用来设置曝光模式，exposurePointOfInterest 用来设置曝光点。
前置摄像头只支持设置曝光，后置摄像头支持设置曝光和聚焦，所以在设置之前要先判断是否支持。
需要注意的是，相机默认输出的图像是横向的，图像向右偏转。而前置摄像头又是镜像，所以图像是向左偏转。我们从 UIView 获得的触摸点，要经过相应的转化，才是正确的坐标。关键代码如下：
- (void)setFocusPoint:(CGPoint)focusPoint {
_focusPoint = focusPoint;
AVCaptureDevice *device = self.camera.inputCamera;
// 坐标转换
CGPoint currentPoint = CGPointMake(focusPoint.y / self.outputView.bounds.size.height, 1 - focusPoint.x / self.outputView.bounds.size.width);
if (self.camera.cameraPosition == AVCaptureDevicePositionFront) {
currentPoint = CGPointMake(currentPoint.x, 1 - currentPoint.y);
}
[device lockForConfiguration:nil];
if ([device isFocusPointOfInterestSupported] &&
[device isFocusModeSupported:AVCaptureFocusModeAutoFocus]) {
[device setFocusPointOfInterest:currentPoint];
[device setFocusMode:AVCaptureFocusModeAutoFocus];
}
if ([device isExposurePointOfInterestSupported] &&
[device isExposureModeSupported:AVCaptureExposureModeAutoExpose]) {
[device setExposurePointOfInterest:currentPoint];
[device setExposureMode:AVCaptureExposureModeAutoExpose];
}
[device unlockForConfiguration];
}
改变焦距简单来说就是画面的放大缩小，通过设置 AVCaptureDevice 的 videoZoomFactor 属性实现。
值得注意的是，这个属性有最大值和最小值，设置之前需要做好判断，否则会直接崩溃。代码如下：
- (void)setVideoScale:(CGFloat)videoScale {
_videoScale = videoScale;
videoScale = [self availableVideoScaleWithScale:videoScale];
AVCaptureDevice *device = self.camera.inputCamera;
[device lockForConfiguration:nil];
device.videoZoomFactor = videoScale;
[device unlockForConfiguration];
}
- (CGFloat)availableVideoScaleWithScale:(CGFloat)scale {
AVCaptureDevice *device = self.camera.inputCamera;
CGFloat maxScale = kMaxVideoScale;
CGFloat minScale = kMinVideoScale;
if (@available(iOS 11.0, *)) {
maxScale = device.maxAvailableVideoZoomFactor;
}
scale = MAX(scale, minScale);
scale = MIN(scale, maxScale);
return scale;
}
1、滤镜的使用
当我们想使用一个滤镜的时候，只需要把它加到滤镜链里去，通过 addTarget: 方法实现。来看一下这个方法的定义：
- (void)addTarget:(id<GPUImageInput>)newTarget;可以看到，只要实现了 GPUImageInput 协议，就可以成为滤镜链的下一个结点。
2、美颜滤镜
目前美颜效果已经成为相机应用的标配，我们也来给自己的相机加上美颜的效果。
美颜效果本质上是对图片做模糊，想要达到比较好的效果，需要结合人脸识别，只对人脸的部分进行模糊处理。这里并不去探究美颜算法的实现，直接找开源的美颜滤镜来用。
目前找到的实现效果比较好的是 LFGPUImageBeautyFilter ，虽然它的效果肯定比不上现在市面上的美颜类 APP，但是作为学习级别的 Demo 已经足够了。
效果展示：
3、自定义滤镜
打开 GPUImageFilter 的头文件，可以看到有下面这个方法：
- (id)initWithVertexShaderFromString:(NSString *)vertexShaderString
fragmentShaderFromString:(NSString *)fragmentShaderString;
很容易理解，通过一个顶点着色器和一个片段着色器来初始化，并且可以看到是字符串类型。
另外，GPUImageFilter 中还内置了简单的顶点着色器和片段着色器，顶点着色器代码如下:
NSString *const kGPUImageVertexShaderString = SHADER_STRING
(
attribute vec4 position;
attribute vec4 inputTextureCoordinate;
varying vec2 textureCoordinate;
void main()
{
gl_Position = position;
textureCoordinate = inputTextureCoordinate.xy;
}
);
这里用到了 SHADER_STRING 宏，看一下它的定义：
#define STRINGIZE(x) #x
#define STRINGIZE2(x) STRINGIZE(x)
#define SHADER_STRING(text) @ STRINGIZE2(text)
在 #define 中的 # 是「字符串化」的意思，返回 C 语言风格字符串，而 SHADER_STRING 在字符串前面加了一个 @ 符号，则 SHADER_STRING 的定义就是将括号中的内容转化为 OC 风格的字符串。
我们之前都是为着色器代码单独创建两个文件，而在 GPUImageFilter 中直接以字符串的形式，写死在代码中，两种方式本质上没什么区别。
当我们想自定义一个滤镜的时候，只需要继承 GPUImageFilter 来定义一个子类，然后用相同的方式来定义两个保存着色器代码的字符串，并且用这两个字符串来初始化子类就可以了。
作为示例，我把之前实现的 抖音滤镜 也添加到这个工程里，来看一下效果：
通过上面的步骤，我们实现了一个具备基础功能的相机。之后会在这个相机的基础上，继续做一些有趣的尝试，欢迎持续关注～
请到 GitHub (https://github.com/lmf12/SimpleCam) 上查看完整代码。
京东创始人刘强东和其妻子章泽天最近成为了互联网舆论关注的焦点。有关他们“移民美国”和在美国购买豪宅的传言在互联网上广泛传播。然而，京东官方通过微博发言人发布的消息澄清了这些传言，称这些言论纯属虚假信息和蓄意捏造。
日前，据博主“@超能数码君老周”爆料，国内三大运营商中国移动、中国电信和中国联通预计将集体采购百万台规模的华为Mate60系列手机。
据报道，荷兰半导体设备公司ASML正看到美国对华遏制政策的负面影响。阿斯麦（ASML）CEO彼得·温宁克在一档电视节目中分享了他对中国大陆问题以及该公司面临的出口管制和保护主义的看法。彼得曾在多个场合表达了他对出口管制以及中荷经济关系的担忧。
今年早些时候，抖音悄然上线了一款名为“青桃”的 App，Slogan 为“看见你的热爱”，根据应用介绍可知，“青桃”是一个属于年轻人的兴趣知识视频平台，由抖音官方出品的中长视频关联版本，整体风格有些类似B站。
日前，威马汽车首席数据官梅松林转发了一份“世界各国地区拥车率排行榜”，同时，他发文表示：中国汽车普及率低于非洲国家尼日利亚，每百户家庭仅17户有车。意大利世界排名第一，每十户中九户有车。
近日，一项新的研究发现，维生素 C 和 E 等抗氧化剂会激活一种机制，刺激癌症肿瘤中新血管的生长，帮助它们生长和扩散。
据媒体援引消息人士报道，苹果公司正在测试使用3D打印技术来生产其智能手表的钢质底盘。消息传出后，3D系统一度大涨超10%，不过截至周三收盘，该股涨幅回落至2%以内。
9月2日，坐拥千万粉丝的网红主播“秀才”账号被封禁，在社交媒体平台上引发热议。平台相关负责人表示，“秀才”账号违反平台相关规定，已封禁。据知情人士透露，秀才近期被举报存在违法行为，这可能是他被封禁的部分原因。据悉，“秀才”年龄39岁，是安徽省亳州市蒙城县人，抖音网红，粉丝数量超1200万。他曾被称为“中老年...
9月3日消息，亚马逊的一些股东，包括持有该公司股票的一家养老基金，日前对亚马逊、其创始人贝索斯和其董事会提起诉讼，指控他们在为 Project Kuiper 卫星星座项目购买发射服务时“违反了信义义务”。
据消息，为推广自家应用，苹果现推出了一个名为“Apps by Apple”的网站，展示了苹果为旗下产品（如 iPhone、iPad、Apple Watch、Mac 和 Apple TV）开发的各种应用程序。
特斯拉本周在美国大幅下调Model S和X售价，引发了该公司一些最坚定支持者的不满。知名特斯拉多头、未来基金（Future Fund）管理合伙人加里·布莱克发帖称，降价是一种“短期麻醉剂”，会让潜在客户等待进一步降价。
据外媒9月2日报道，荷兰半导体设备制造商阿斯麦称，尽管荷兰政府颁布的半导体设备出口管制新规9月正式生效，但该公司已获得在2023年底以前向中国运送受限制芯片制造机器的许可。
近日，根据美国证券交易委员会的文件显示，苹果卫星服务提供商 Globalstar 近期向马斯克旗下的 SpaceX 支付 6400 万美元（约 4.65 亿元人民币）。用于在 2023-2025 年期间，发射卫星，进一步扩展苹果 iPhone 系列的 SOS 卫星服务。
据报道，马斯克旗下社交平台𝕏（推特）日前调整了隐私政策，允许 𝕏 使用用户发布的信息来训练其人工智能（AI）模型。新的隐私政策将于 9 月 29 日生效。新政策规定，𝕏可能会使用所收集到的平台信息和公开可用的信息，来帮助训练 𝕏 的机器学习或人工智能模型。
9月2日，荣耀CEO赵明在采访中谈及华为手机回归时表示，替老同事们高兴，觉得手机行业，由于华为的回归，让竞争充满了更多的可能性和更多的魅力，对行业来说也是件好事。
《自然》30日发表的一篇论文报道了一个名为Swift的人工智能（AI）系统，该系统驾驶无人机的能力可在真实世界中一对一冠军赛里战胜人类对手。
近日，非营利组织纽约真菌学会（NYMS）发出警告，表示亚马逊为代表的电商平台上，充斥着各种AI生成的蘑菇觅食科普书籍，其中存在诸多错误。
社交媒体平台𝕏（原推特）新隐私政策提到：“在您同意的情况下，我们可能出于安全、安保和身份识别目的收集和使用您的生物识别信息。”
2023年德国柏林消费电子展上，各大企业都带来了最新的理念和产品，而高端化、本土化的中国产品正在不断吸引欧洲等国际市场的目光。
罗永浩日前在直播中吐槽苹果即将推出的 iPhone 新品，具体内容为：“以我对我‘子公司’的了解，我认为 iPhone 15 跟 iPhone 14 不会有什么区别的，除了序（列）号变了，这个‘不要脸’的东西，这个‘臭厨子’。
