概述
GPUImage是一個(gè)著名的圖像處理開源庫(kù)延届,它讓你能夠在圖片消玄、視頻薯演、相機(jī)上使用GPU加速的濾鏡和其它特效撞芍。與CoreImage框架相比,可以根據(jù)GPUImage提供的接口跨扮,使用自定義的濾鏡序无。項(xiàng)目地址:https://github.com/BradLarson/GPUImage
這篇文章主要是閱讀GPUImage框架中的 GPUImageFilterPipeline、GPUImageFilterGroup 這幾個(gè)類的源碼衡创。這兩個(gè)類都和組合濾鏡相關(guān)帝嗡,但是它們又有不同的地方。GPUImageFilterPipeline 繼承自NSObject钧汹,也沒有實(shí)現(xiàn)其它協(xié)議丈探,而GPUImageFilterGroup繼承自GPUImageOutput 實(shí)現(xiàn)了GPUImageInput協(xié)議。因此拔莱,最大的區(qū)別就是GPUImageFilterGroup自身可以作為響應(yīng)鏈的一員碗降,而GPUImageFilterPipeline則不能。以下是源碼內(nèi)容:
GPUImageFilterPipeline
GPUImageFilterGroup
實(shí)現(xiàn)效果
-
從文件中讀取濾鏡配置塘秦。
-
直接配置濾鏡讼渊。
-
自定義組合濾鏡。
GPUImageFilterPipeline
GPUImageFilterPipeline 繼承自NSObject尊剔,它的主要作用是管理濾鏡鏈爪幻,自身不能參與響應(yīng)鏈中⌒胛螅可以用來構(gòu)建簡(jiǎn)單的濾鏡組合挨稿。如果濾鏡比較復(fù)雜或是涉及到多個(gè)紋理的處理,GPUImageFilterGroup則是更好的選擇京痢。
- 屬性奶甘。
// filter數(shù)組
@property (strong) NSMutableArray *filters;
// 輸入對(duì)象
@property (strong) GPUImageOutput *input;
// 輸出對(duì)象
@property (strong) id <GPUImageInput> output;
- 構(gòu)造方法〖酪可以通過指定filter數(shù)組以及配置字典臭家、文件來構(gòu)造GPUImageFilterPipeline疲陕。
- (id) initWithOrderedFilters:(NSArray*) filters input:(GPUImageOutput*)input output:(id <GPUImageInput>)output;
- (id) initWithConfiguration:(NSDictionary*) configuration input:(GPUImageOutput*)input output:(id <GPUImageInput>)output;
- (id) initWithConfigurationFile:(NSURL*) configuration input:(GPUImageOutput*)input output:(id <GPUImageInput>)output;
// 根據(jù)輸入的filter數(shù)組、GPUImageOutput钉赁、GPUImageInput構(gòu)建GPUImageFilterPipeline
- (id)initWithOrderedFilters:(NSArray *)filters input:(GPUImageOutput *)input output:(id <GPUImageInput>)output {
self = [super init];
if (self) {
self.input = input;
self.output = output;
self.filters = [NSMutableArray arrayWithArray:filters];
[self _refreshFilters];
}
return self;
}
// 根據(jù)filter配置字典蹄殃、GPUImageOutput、GPUImageInput構(gòu)建GPUImageFilterPipeline
- (id)initWithConfiguration:(NSDictionary *)configuration input:(GPUImageOutput *)input output:(id <GPUImageInput>)output {
self = [super init];
if (self) {
self.input = input;
self.output = output;
if (![self _parseConfiguration:configuration]) {
NSLog(@"Sorry, a parsing error occurred.");
abort();
}
[self _refreshFilters];
}
return self;
}
// 根據(jù)filter配置文件的URL你踩、GPUImageOutput诅岩、GPUImageInput構(gòu)建GPUImageFilterPipeline
- (id)initWithConfigurationFile:(NSURL *)configuration input:(GPUImageOutput *)input output:(id <GPUImageInput>)output {
return [self initWithConfiguration:[NSDictionary dictionaryWithContentsOfURL:configuration] input:input output:output];
}
// 解析配置文件
- (BOOL)_parseConfiguration:(NSDictionary *)configuration {
NSArray *filters = [configuration objectForKey:@"Filters"];
if (!filters) {
return NO;
}
NSError *regexError = nil;
// 匹配配置文件參數(shù)如:float(1.0), CGPoint(1.0, 2.0) 等類型
NSRegularExpression *parsingRegex = [NSRegularExpression regularExpressionWithPattern:@"(float|CGPoint|NSString)\\((.*?)(?:,\\s*(.*?))*\\)"
options:0
error:®exError];
// It's faster to put them into an array and then pass it to the filters property than it is to call [self addFilter:] every time
NSMutableArray *orderedFilters = [NSMutableArray arrayWithCapacity:[filters count]];
for (NSDictionary *filter in filters) {
// 由FilterName生成相應(yīng)的實(shí)例對(duì)象
NSString *filterName = [filter objectForKey:@"FilterName"];
Class theClass = NSClassFromString(filterName);
GPUImageOutput<GPUImageInput> *genericFilter = [[theClass alloc] init];
// Set up the properties
NSDictionary *filterAttributes;
// 解析Attributes,并傳遞參數(shù)
if ((filterAttributes = [filter objectForKey:@"Attributes"])) {
for (NSString *propertyKey in filterAttributes) {
// Set up the selector
SEL theSelector = NSSelectorFromString(propertyKey);
NSInvocation *inv = [NSInvocation invocationWithMethodSignature:[theClass instanceMethodSignatureForSelector:theSelector]];
[inv setSelector:theSelector];
[inv setTarget:genericFilter];
// check selector given with parameter
if ([propertyKey hasSuffix:@":"]) {
stringValue = nil;
// Then parse the arguments
NSMutableArray *parsedArray;
if ([[filterAttributes objectForKey:propertyKey] isKindOfClass:[NSArray class]]) {
NSArray *array = [filterAttributes objectForKey:propertyKey];
parsedArray = [NSMutableArray arrayWithCapacity:[array count]];
for (NSString *string in array) {
NSTextCheckingResult *parse = [parsingRegex firstMatchInString:string
options:0
range:NSMakeRange(0, [string length])];
NSString *modifier = [string substringWithRange:[parse rangeAtIndex:1]];
if ([modifier isEqualToString:@"float"]) {
// Float modifier, one argument
CGFloat value = [[string substringWithRange:[parse rangeAtIndex:2]] floatValue];
[parsedArray addObject:[NSNumber numberWithFloat:value]];
[inv setArgument:&value atIndex:2];
} else if ([modifier isEqualToString:@"CGPoint"]) {
// CGPoint modifier, two float arguments
CGFloat x = [[string substringWithRange:[parse rangeAtIndex:2]] floatValue];
CGFloat y = [[string substringWithRange:[parse rangeAtIndex:3]] floatValue];
CGPoint value = CGPointMake(x, y);
[parsedArray addObject:[NSValue valueWithCGPoint:value]];
} else if ([modifier isEqualToString:@"NSString"]) {
// NSString modifier, one string argument
stringValue = [[string substringWithRange:[parse rangeAtIndex:2]] copy];
[inv setArgument:&stringValue atIndex:2];
} else {
return NO;
}
}
[inv setArgument:&parsedArray atIndex:2];
} else {
NSString *string = [filterAttributes objectForKey:propertyKey];
NSTextCheckingResult *parse = [parsingRegex firstMatchInString:string
options:0
range:NSMakeRange(0, [string length])];
NSString *modifier = [string substringWithRange:[parse rangeAtIndex:1]];
if ([modifier isEqualToString:@"float"]) {
// Float modifier, one argument
CGFloat value = [[string substringWithRange:[parse rangeAtIndex:2]] floatValue];
[inv setArgument:&value atIndex:2];
} else if ([modifier isEqualToString:@"CGPoint"]) {
// CGPoint modifier, two float arguments
CGFloat x = [[string substringWithRange:[parse rangeAtIndex:2]] floatValue];
CGFloat y = [[string substringWithRange:[parse rangeAtIndex:3]] floatValue];
CGPoint value = CGPointMake(x, y);
[inv setArgument:&value atIndex:2];
} else if ([modifier isEqualToString:@"NSString"]) {
// NSString modifier, one string argument
stringValue = [[string substringWithRange:[parse rangeAtIndex:2]] copy];
[inv setArgument:&stringValue atIndex:2];
} else {
return NO;
}
}
}
[inv invoke];
}
}
[orderedFilters addObject:genericFilter];
}
self.filters = orderedFilters;
return YES;
}
- 配置文件示例
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
<key>Filters</key>
<array>
<dict>
<key>FilterName</key>
<string>GPUImageGammaFilter</string>
<key>Attributes</key>
<dict>
<key>setGamma:</key>
<string>float(1.0)</string>
</dict>
</dict>
<dict>
<key>FilterName</key>
<string>GPUImageBrightnessFilter</string>
<key>Attributes</key>
<dict>
<key>setBrightness:</key>
<string>float(0.2)</string>
</dict>
</dict>
</array>
</dict>
</plist>
- 其它方法
// filter的增加姓蜂、刪除按厘、替換
- (void) addFilter:(GPUImageOutput<GPUImageInput> *)filter;
- (void) addFilter:(GPUImageOutput<GPUImageInput> *)filter atIndex:(NSUInteger)insertIndex;
- (void) replaceFilterAtIndex:(NSUInteger)index withFilter:(GPUImageOutput<GPUImageInput> *)filter;
- (void) replaceAllFilters:(NSArray *) newFilters;
- (void) removeFilter:(GPUImageOutput<GPUImageInput> *)filter;
- (void) removeFilterAtIndex:(NSUInteger)index;
- (void) removeAllFilters;
// 由final filter生成圖片
- (UIImage *) currentFilteredFrame;
- (UIImage *) currentFilteredFrameWithOrientation:(UIImageOrientation)imageOrientation;
- (CGImageRef) newCGImageFromCurrentFilteredFrame;
// 在特定位置增加filter
- (void)addFilter:(GPUImageOutput<GPUImageInput> *)filter atIndex:(NSUInteger)insertIndex {
[self.filters insertObject:filter atIndex:insertIndex];
[self _refreshFilters];
}
// 在末尾增加filter
- (void)addFilter:(GPUImageOutput<GPUImageInput> *)filter {
[self.filters addObject:filter];
[self _refreshFilters];
}
// 替換filter
- (void)replaceFilterAtIndex:(NSUInteger)index withFilter:(GPUImageOutput<GPUImageInput> *)filter {
[self.filters replaceObjectAtIndex:index withObject:filter];
[self _refreshFilters];
}
// 刪除filter
- (void) removeFilter:(GPUImageOutput<GPUImageInput> *)filter;
{
[self.filters removeObject:filter];
[self _refreshFilters];
}
// 刪除特定索引的filter
- (void)removeFilterAtIndex:(NSUInteger)index {
[self.filters removeObjectAtIndex:index];
[self _refreshFilters];
}
// 刪除所有filter
- (void)removeAllFilters {
[self.filters removeAllObjects];
[self _refreshFilters];
}
// 替換所有filter
- (void)replaceAllFilters:(NSArray *)newFilters {
self.filters = [NSMutableArray arrayWithArray:newFilters];
[self _refreshFilters];
}
// 更新響應(yīng)鏈
- (void)_refreshFilters {
// 將input作為響應(yīng)鏈源
id prevFilter = self.input;
GPUImageOutput<GPUImageInput> *theFilter = nil;
// 循環(huán)添加
for (int i = 0; i < [self.filters count]; i++) {
theFilter = [self.filters objectAtIndex:i];
[prevFilter removeAllTargets];
[prevFilter addTarget:theFilter];
prevFilter = theFilter;
}
[prevFilter removeAllTargets];
// 最后將output加入響應(yīng)鏈
if (self.output != nil) {
[prevFilter addTarget:self.output];
}
}
// 由final filter生成圖像
- (UIImage *)currentFilteredFrame {
return [(GPUImageOutput<GPUImageInput> *)[_filters lastObject] imageFromCurrentFramebuffer];
}
// 根據(jù)imageOrientation生成圖像
- (UIImage *)currentFilteredFrameWithOrientation:(UIImageOrientation)imageOrientation {
return [(GPUImageOutput<GPUImageInput> *)[_filters lastObject] imageFromCurrentFramebufferWithOrientation:imageOrientation];
}
// 由final filter生成圖像
- (CGImageRef)newCGImageFromCurrentFilteredFrame {
return [(GPUImageOutput<GPUImageInput> *)[_filters lastObject] newCGImageFromCurrentlyProcessedOutput];
}
GPUImageFilterGroup
GPUImageFilterGroup繼承自GPUImageOutput ,實(shí)現(xiàn)了GPUImageInput協(xié)議钱慢。因此逮京,可以自身可以作為獨(dú)立的濾鏡參與響應(yīng)鏈中。相比GPUImageFilterPipeline束莫,GPUImageFilterGroup功能更強(qiáng)大懒棉。
- 屬性
@property(readwrite, nonatomic, strong) GPUImageOutput<GPUImageInput> *terminalFilter;
@property(readwrite, nonatomic, strong) NSArray *initialFilters;
@property(readwrite, nonatomic, strong) GPUImageOutput<GPUImageInput> *inputFilterToIgnoreForUpdates;
- 方法
// 增加濾鏡
- (void)addFilter:(GPUImageOutput<GPUImageInput> *)newFilter;
- (GPUImageOutput<GPUImageInput> *)filterAtIndex:(NSUInteger)filterIndex;
- (NSUInteger)filterCount;
// 增加濾鏡
- (void)addFilter:(GPUImageOutput<GPUImageInput> *)newFilter;
{
[filters addObject:newFilter];
}
// 獲取濾鏡
- (GPUImageOutput<GPUImageInput> *)filterAtIndex:(NSUInteger)filterIndex;
{
return [filters objectAtIndex:filterIndex];
}
// 濾鏡數(shù)量
- (NSUInteger)filterCount;
{
return [filters count];
}
//
- (void)newFrameReadyAtTime:(CMTime)frameTime atIndex:(NSInteger)textureIndex;
{
for (GPUImageOutput<GPUImageInput> *currentFilter in _initialFilters)
{
if (currentFilter != self.inputFilterToIgnoreForUpdates)
{
[currentFilter newFrameReadyAtTime:frameTime atIndex:textureIndex];
}
}
}
// 設(shè)置幀緩存對(duì)象
- (void)setInputFramebuffer:(GPUImageFramebuffer *)newInputFramebuffer atIndex:(NSInteger)textureIndex;
{
for (GPUImageOutput<GPUImageInput> *currentFilter in _initialFilters)
{
[currentFilter setInputFramebuffer:newInputFramebuffer atIndex:textureIndex];
}
}
實(shí)現(xiàn)過程
- 從文件中讀取濾鏡配置。
// 加載圖片
GPUImagePicture *picture = [[GPUImagePicture alloc] initWithImage:[UIImage imageNamed:@"1.jpg"]];
// 配置文件
NSURL *file = [[NSBundle mainBundle] URLForResource:@"filterConfig" withExtension:@"plist"];
// 濾鏡組合
_pipleLine = [[GPUImageFilterPipeline alloc] initWithConfigurationFile:file input:picture output:_imageView];
[picture processImage];
- 直接配置濾鏡览绿。
// 加載圖片
GPUImagePicture *picture = [[GPUImagePicture alloc] initWithImage:[UIImage imageNamed:@"2.jpg"]];
// filters
GPUImageRGBFilter *rgbFilter = [[GPUImageRGBFilter alloc] init];
GPUImagePerlinNoiseFilter *noiseFilter = [[GPUImagePerlinNoiseFilter alloc] init];
// 配置文件
NSArray *filters = @[rgbFilter, noiseFilter];
// 濾鏡組合
_pipleLine = [[GPUImageFilterPipeline alloc] initWithOrderedFilters:filters input:picture output:_imageView];
[picture processImage];
- 自定義組合濾鏡策严。
#import "QMGrayBilateralBlendFilter.h"
NSString *const kGrayBilateralBlendFragmentShaderString = SHADER_STRING
(
varying highp vec2 textureCoordinate;
varying highp vec2 textureCoordinate2;
uniform sampler2D inputImageTexture;
uniform sampler2D inputImageTexture2;
void main()
{
highp vec4 gray = texture2D(inputImageTexture, textureCoordinate);
highp vec4 bilateral = texture2D(inputImageTexture2, textureCoordinate2);
highp float range = distance(textureCoordinate, vec2(0.5, 0.5));
highp vec4 dstClor = bilateral;
if (range < 0.4) {
dstClor = gray;
}
gl_FragColor = dstClor;
//gl_FragColor = vec4(vec3(mix(gray, bilateral, 0.6)), 1.0);
}
);
@implementation QMGrayBilateralBlendFilter
- (instancetype)init
{
if (self = [super init])
{
// GrayscaleFilter
GPUImageGrayscaleFilter *grayFilter = [[GPUImageGrayscaleFilter alloc] init];
[self addFilter:grayFilter];
// BilateralFilter
GPUImageBilateralFilter *bilateralFilter = [[GPUImageBilateralFilter alloc] init];
bilateralFilter.distanceNormalizationFactor = 16.0;
[self addFilter:bilateralFilter];
// GPUImageTwoPassFilter
GPUImageTwoInputFilter *twoPassFilter = [[GPUImageTwoInputFilter alloc] initWithFragmentShaderFromString:kGrayBilateralBlendFragmentShaderString];
// GPUImageHSBFilter
GPUImageHSBFilter *hsbFilter = [[GPUImageHSBFilter alloc] init];
[grayFilter addTarget:twoPassFilter];
[bilateralFilter addTarget:twoPassFilter];
[twoPassFilter addTarget:hsbFilter];
self.initialFilters = @[grayFilter, bilateralFilter];
self.terminalFilter = hsbFilter;
}
return self;
}
@end
總結(jié)
GPUImageFilterPipeline、GPUImageFilterGroup 都可用于組合濾鏡饿敲,GPUImageFilterPipeline相對(duì)比較簡(jiǎn)單妻导,可定制程度較低,而GPUImageFilterGroup則功能比較強(qiáng)大怀各,可定制程度高倔韭。在選用的時(shí)候可以根據(jù)自己的需求,選用不同的濾鏡組合瓢对。
源碼地址:GPUImage源碼閱讀系列 https://github.com/QinminiOS/GPUImage
系列文章地址:GPUImage源碼閱讀 http://www.reibang.com/nb/11749791