【iOS开发】制作一个简易的滤镜相机（三）

上一篇中我们成功地将拍摄到的录像保存到了相册。还差另一个功能，对了，拍照。

---

7月31日更新

上次的代码有些问题，漏了一句释放方法，会导致内存泄露。在willOutputSampleBuffer:第三段代码上方某处加入
CGImageRelease(sourceCGImage);
即可。详见修改过的代码。

---

GPUImage库里面有个still camera的类，然而如果想同时打开拍照和摄像的2个摄像头实例是不可行的，而且，岂不是很浪费系统资源？那么如何用摄像的camera实例来拍摄静态照片呢？

什么？你说你可以只按0.1秒？

严肃点，下面我们开始正文了。

1. 打开那个工程，对，你知道是哪个。

2. 在ViewController.h中声明该类实现GPUImageVideoCameraDelegate的协议。

3. 在ViewController.m中viewDidLoad方法中的第一段代码最后声明代理。

    _videoCamera.delegate = self;
   

4. 在实现delegate方法前，先到.h设置几个成员变量吧。

    BOOL _willCapturePicture;
    CIContext *_ciContext;
    CGRect _sourceRect;
   

5. willOutputSampleBuffer:这个方法在AVFoundation里面也有提供，很多基于AVFoundation的扩展库都会保留这个方法用于对帧画面的手动处理。它会在捕获每一帧画面的时候被调用，此时可以对画面进行一些处理。这里我们用_willCapturePicture判断是否要保存当前帧。
   实现代码如下：

    - (void)willOutputSampleBuffer:(CMSampleBufferRef)sampleBuffer {
        // 1. Do nothing if didn't press capture button
        if (!_willCapturePicture) {
            return;
        }
   
        // 2. Transfer sample buffer to image
        CVPixelBufferRef imageBuffer = CMSampleBufferGetImageBuffer(sampleBuffer);
        CVPixelBufferLockBaseAddress(imageBuffer, 0);
        CIImage *sourceImage = [CIImage imageWithCVPixelBuffer:imageBuffer
                                               options:nil];
        UIGraphicsBeginImageContext(sourceImage.extent.size);
        // Source image的大小获取一次就可以了，为了性能考虑，把这个尺寸存到类成员里面
        static dispatch_once_t onceToken;
        dispatch_once(&onceToken, ^{
            _sourceRect = sourceImage.extent;
        });
   
        CGContextRef context = UIGraphicsGetCurrentContext();
        CGImageRef sourceCGImage = [_ciContext createCGImage:sourceImage fromRect:_sourceRect];
   
        // 由于摄像头的坐标系和UI和Core Graphics都不一样，需要把坐标系转换一下
        CGAffineTransform transform = CGAffineTransformIdentity;
        transform = CGAffineTransformMakeTranslation(0, _sourceRect.size.height);
        transform = CGAffineTransformScale(transform, 1, -1);
        CGContextConcatCTM(context, transform);
   
        CGContextDrawImage(context, _sourceRect, sourceCGImage);
        CGImageRelease(sourceCGImage);// 千万不能忘了释放内存
        UIImage *resultImage = UIGraphicsGetImageFromCurrentImageContext();
        UIGraphicsEndImageContext();
   
        // 3. Take a photo
        if (_willCapturePicture) {
            UIGraphicsBeginImageContext(CGSizeMake(resultImage.size.height, resultImage.size.width));
            CGContextRef context = UIGraphicsGetCurrentContext();
            CGContextRotateCTM(context, M_PI_2);
            CGContextTranslateCTM(context, 0, -resultImage.size.height);
    
            [resultImage drawAtPoint:CGPointZero];
    
            UIImage *resultImage2 = UIGraphicsGetImageFromCurrentImageContext();
            UIGraphicsEndImageContext();
    
            // 加滤镜。这里获得的图片是原始摄像头捕获的画面，需要手动加一下滤镜效果。
            GPUImagePicture *stillImageSource = [[GPUImagePicture alloc] initWithImage:resultImage2];
            [stillImageSource addTarget:_filter];
            [_filter useNextFrameForImageCapture];
            [stillImageSource processImage];
    
            UIImage *currentFilteredVideoFrame = [_filter imageFromCurrentFramebuffer];
    
            NSData *processedJPEG = UIImageJPEGRepresentation(currentFilteredVideoFrame, 1);
    
            ALAssetsLibrary *library = [[ALAssetsLibrary alloc] init];
            [library writeImageDataToSavedPhotosAlbum:processedJPEG metadata:nil completionBlock:^(NSURL *assetURL, NSError *error2)
            {
                if (error2) {
                NSLog(@"ERROR: the image failed to be written");
                }
                else {
                    NSLog(@"PHOTO SAVED - assetURL: %@", assetURL);
                }
            }];
    
            _willCapturePicture = NO;
        }
   
        CVPixelBufferUnlockBaseAddress(imageBuffer, 0);
    }
   

这段代码很长，大致就是把CMSampleBufferRef进行一系列类型转换和坐标系变换，转成我们熟悉的UIImage然后转成NSData然后保存到相册。

第二段代码里面把坐标系转换以后获取了当前的CGContext，并在上面画了一层CGImage。这段代码写那么复杂是为之后另一个功能做准备的。

拍摄操作主要还是在第三段代码，把当前获取的sample buffer转成的UIImage保存到相册里面。

6. 好了，主要功能写完，剩下只要添加调用的代码就行了。到viewDidLoad中找到第五段代码，在末尾加上以下代码：

    UITapGestureRecognizer *tapGesture = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(handleGesture:)];
    [_captureButton addGestureRecognizer:tapGesture];
   
    // 6. Other setup
    EAGLContext *eaglContext = [[EAGLContext alloc]initWithAPI:kEAGLRenderingAPIOpenGLES2];
    _ciContext = [CIContext contextWithEAGLContext:eaglContext];
   

这里用EAGLContext来初始化CIContext因为EAGLContext创建以后是GPU来进行操作，比CPU快很多。

7. 到handleGesture:方法最后加上另一个手势的处理：

    else if ([sender isKindOfClass:[UITapGestureRecognizer class]]) {
        UITapGestureRecognizer *tapGesture = (UITapGestureRecognizer *)sender;
        switch (tapGesture.state) {
            case UIGestureRecognizerStateEnded:
            {
                _willCapturePicture = YES;
            }
                break;
            
            default:
                break;
        }
    }
   

到这里我们又实现了照片拍摄。当然照片不会像专职照片相机这么清晰，无奈也是一种妥协了。因为如果摄像头尺寸调到1920x1080，实时画面处理对于iPhone6来说性能也是不够的。所以这个相机demo不是为了拍美景的，主要用于社交、美颜、文艺青年的使用场景。小尺寸便于分享传输、节约网络流量。

这次的代码非常复杂，但很多都是搬砖操作，仔细阅读以后不会觉得像想象中这么深奥。我当初倒是为了坐标系变换调试了很久。有任何代码上面的问题请不要犹豫，在下方留言。