iOS-GPUImage应用

本文主要是介绍iOS-GPUImage应用，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

GPUImage 是一个开源的基于GPU的图片或视频的处理框架，由OpenGL ES封装而来，其本身内置了多达120多种常见的滤镜效果，添加实时的滤镜只需要简单地添加几行代码。

现在各大直播以及美颜相机等都用到了 GPUImage 框架，想研究的透彻，可以去看他的源码，然后去研究OpenGL ES，然后你发现看不懂OpenGL ES框架，那就对了，它是用C写的，想了解更多就先去看OpenGL，当然了，如果只是产品需求，其实我们只要了解他的用法就可以了，有时间和精力再去看它的底层实现。想了解更多可以看下落影loyinglin 的文章，写的挺好的。

一、下载GPUImage

到github上面去下载，然后倒入项目中。
通过CocoaPods下载 pod 'GPUImage'

二、简单应用

1.图片的一个滤镜效果

只有一个静态滤镜效果，以 GPUImageSepiaFilter（棕褐色滤镜）为例：

   UIImage * image = [UIImage imageNamed:@"333"];UIImageView *contentImage = [[UIImageView alloc] initWithFrame:self.view.frame];contentImage.contentMode = UIViewContentModeScaleAspectFill;[self.view addSubview:contentImage];GPUImagePictures *sourcePicture = [[GPUImagePicture alloc] initWithImage:image smoothlyScaleOutput:YES];GPUImageView *imageView = [[GPUImageView alloc] initWithFrame:contentImage.frame];[contentImage addSubview:imageView];GPUImageSepiaFilter *fitler = [[GPUImageSepiaFilter alloc] init];[sourcePicture addTarget:fitler];[sourcePicture processImage];[fitler useNextFrameForImageCapture];image = [f imageFromCurrentFramebuffer];contentImage.image = image;

这样我们就得到一张经过棕褐色滤镜的图片。

2.图片多个滤镜效果

图片添加多个滤镜效果可以使用 GPUImageFilterGroup 或者 GPUImageFilterPipeline ，我们以GPUImageSepiaFilter棕褐色滤镜和GPUImageBrightnessFilter光度强弱为例：

   UIImage * image = [UIImage imageNamed:@"333"];_imageView1 = [[UIImageView alloc] initWithFrame:self.view.frame];_contentImage.contentMode = UIViewContentModeScaleAspectFill;[self.view addSubview:_contentImage];_sourcePicture = [[GPUImagePicture alloc] initWithImage:image smoothlyScaleOutput:YES];GPUImageView *imageView = [[GPUImageView alloc] initWithFrame:_contentImage.frame];[_contentImage addSubview:imageView];_filterGroup = [[GPUImageFilterGroup alloc] init];[_sourcePicture addTarget:_filterGroup];_sepiaFilter = [[GPUImageSepiaFilter alloc] init];_brightnessFilter = [[GPUImageBrightnessFilter alloc] init];[self addGPUImageFilter:f];[self addGPUImageFilter:imageFilter];// 处理图片[_sourcePicture processImage];[_filterGroup useNextFrameForImageCapture];    _imageView1.image = [_filterGroup imageFromCurrentFramebuffer];[self addSlider];

- (void)addSlider
{UISlider *filterSettingsSlider = [[UISlider alloc] initWithFrame:CGRectMake(25, SCREEN_HEIGHT-50, SCREEN_WIDTH - 50, 40)];[filterSettingsSlider addTarget:self action:@selector(updateSliderValue:) forControlEvents:UIControlEventValueChanged];filterSettingsSlider.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleTopMargin;filterSettingsSlider.minimumValue = -1.0;filterSettingsSlider.maximumValue = 1.0;filterSettingsSlider.value = 0.0;[self.view addSubview:filterSettingsSlider];
}- (void)updateSliderValue:(UISlider *)slider
{[_brightnessFilter setBrightness:slider.value];[_sourcePicture processImage];   [_filterGroup useNextFrameForImageCapture];_imageView1.image = [_filterGroup imageFromCurrentFramebuffer];
}

// 添加 filter
/**原理：1. filterGroup(addFilter) 滤镜组添加每个滤镜2. 按添加顺序（可自行调整）前一个filter(addTarget) 添加后一个filter3. filterGroup.initialFilters = @[第一个filter]];4. filterGroup.terminalFilter = 最后一个filter;*/
- (void)addGPUImageFilter:(GPUImageOutput<GPUImageInput> *)filter
{[_filterGroup addFilter:filter];GPUImageOutput<GPUImageInput> *newTerminalFilter = filter;NSInteger count = _filterGroup.filterCount;if (count == 1){_filterGroup.initialFilters = @[newTerminalFilter];_filterGroup.terminalFilter = newTerminalFilter;} else{GPUImageOutput<GPUImageInput> *terminalFilter    = _filterGroup.terminalFilter;NSArray *initialFilters                          = _filterGroup.initialFilters;[terminalFilter addTarget:newTerminalFilter];_filterGroup.initialFilters = @[initialFilters[0]];_filterGroup.terminalFilter = newTerminalFilter;}
}

这样我们就能够在图片上面添加多种滤镜。

我们采用 GPUImageFilterPipeline 实现多个滤镜效果，和上面的大部分代码都一样，我们只展示不一样的部分：

   _pipeline = [[GPUImageFilterPipeline alloc] initWithOrderedFilters:@[_sepiaFilter,_brightnessFilter] input:_sourcePicture output:primaryView];[_sourcePicture processImage];

在slider方法里面只需要：

- (void)updateSliderValue:(UISlider *)slider
{[_brightnessFilter setBrightness:slider.value];   [_sourcePicture processImage];   
}

综上可以看出使用GPUImageFilterPipeline 要方便一些。

3.滤镜美颜相机

   // 1.创建相机self.stillCamera = [[GPUImageStillCamera alloc] initWithSessionPreset:AVCaptureSessionPreset1280x720 cameraPosition:AVCaptureDevicePositionFront];self.stillCamera.outputImageOrientation = UIInterfaceOrientationPortrait;// 镜像效果，前置摄像头需要，后置摄像头不出要，不然看到的是反的self.stillCamera.horizontallyMirrorFrontFacingCamera = YES;// 2.创建设置滤镜效果//self.filter = [[GPUImageSketchFilter alloc] init]; // 黑白滤镜效果self.filter = [[GPUImageGammaFilter alloc] init];self.outPut = self.filter;// 3.创建展示相机的视图self.filterView = [[GPUImageView alloc] initWithFrame:self.view.bounds];self.filterView.center = self.view.center;[self.view addSubview:self.filterView];// 4.这里一定要注意 一定要先加滤镜->在加视图->然后吧camera开始获取视频图像[self.stillCamera addTarget:self.filter];[self.filter addTarget:self.filterView];// 5.开始获取视频[self.stillCamera startCameraCapture];

4.滤镜视频

    videoCamera = [[GPUImageVideoCamera alloc] initWithSessionPreset:AVCaptureSessionPreset1280x720 cameraPosition:AVCaptureDevicePositionBack];videoCamera.outputImageOrientation = UIInterfaceOrientationPortrait;[videoCamera addAudioInputsAndOutputs];filter = [[GPUImageSaturationFilter alloc] init];filteredVideoView = [[GPUImageView alloc] initWithFrame:[[UIScreen mainScreen] bounds]];//filteredVideoView.fillMode = kGPUImageFillModeStretch;//kGPUImageFillModePreserveAspectRatioAndFill;[videoCamera addTarget:filter];[filter addTarget:filteredVideoView];[videoCamera startCameraCapture];

使用相机和视频的时候注意访问权限的添加：

- 麦克风权限：Privacy - Microphone Usage Description  是否允许此App使用你的麦克风？
- 相机权限： Privacy - Camera Usage Description  是否允许此App使用你的相机？
- 添加到相册权限：Privacy - Photo Library Additions Usage Description  是否允许图片添加到相册？
- 相册权限： Privacy - Photo Library Usage Description  是否允许此App访问你的媒体资料库？