Core Image之自定 Filter

文章摘自 https://colin1994.github.io/2016/10/21/Core-Image-Custom-Filter/

自定义 Filter 流程

自定义的 Filter 和系统内置的各种 CIFilter，使用起来方式是一样的。我们唯一要做的，就是实现一个符合规范的 CIFilter 的子类，然后该怎么用怎么用。

这里总结起来就3步：

编写 CIKernel：使用 CIKL，自定义滤镜效果。 加载 CIKernel：CIFilter 读取编写好的 CIKernel。 设置参数：设置 CIKernel 需要的输入参数以及 DOD 和 ROI。 不难看出，这些操作都是围绕 CIKernel 展开的，那么，它是什么？ CIKL，DOD，ROI 又是什么鬼？ 先撇开这些麻烦的东西，我们先这样简单的认为：

  1. 编写 CIKernel File —> New —> File —> Empty， 创建一个名为 MirrorX.cikernel 的文件。 编辑 .cikernel 文件，比如：

    kernel vec2 mirrorX ( float imageWidth ) 
{
   // 获取待处理点的位置
   vec2 currentVec = destCoord();
 // 返回最终显示位置
   return vec2 ( imageWidth - currentVec.x , currentVec.y ); 
}

    PS：这个 kernel 如果有不懂的，可以先跳过。下文会重点说明。

  2. 加载 CIKernel

File —> New —> File —> Cocoa Touch Clas，新建一个继承自 CIFilter 的类，比如 MirrorXFilter。

在 MirrorXFilter.m 中，添加如下代码：

static CIKernel *customKernel = nil;

- (instancetype)init {

    self = [super init];
    if (self) {
        if (customKernel == nil)
        {
            NSBundle *bundle = [NSBundle bundleForClass: [self class]];
            NSURL *kernelURL = [bundle URLForResource:@"MirrorX" withExtension:@"cikernel"];

            NSError *error;
            NSString *kernelCode = [NSString stringWithContentsOfURL:kernelURL
                                                            encoding:NSUTF8StringEncoding error:&error];
            if (kernelCode == nil) {
                NSLog(@"Error loading kernel code string in %@\n%@",
                      NSStringFromSelector(_cmd),
                      [error localizedDescription]);
                abort();
            }

            NSArray *kernels = [CIKernel kernelsWithString:kernelCode];
            customKernel = [kernels objectAtIndex:0];
        }
    }
    return self;
}

这段代码很简单，重写 init 方法，主要就是读取 .cikernel 文件中代表 CIKernel 的字符串（当然， CIKernel 也可以直接写在 NSString 里头，免去文件读取这步），然后使用 kernelsWithString

方法获取到真正的 CIKernel 对象。

+ (nullable NSArray<CIKernel *> *)kernelsWithString:(NSString *)string  NS_AVAILABLE(10_4, 8_0);

至此，CIKernel 加载完毕。

  1. 设置参数

    在 MirrorXFilter.m 中，添加需要的成员变量。

    之后，就是设置参数，传入 kernel 中。

    ```objective-c

    // 使用

  2. (CIImage *)outputImage

    {

    CGFloat inputWidth = inputImage.extent.size.width;

    CIImage *result = [customKernel applyWithExtent: inputImage.extent roiCallback: ^( int index, CGRect rect ) {

      return rect;

    } inputImage: inputImage arguments: @[@(inputWidth)]];

    return result;

    }

    ```

这里只需要重写 outputImage 方法即可。

extent 用于返回 CIImage 对象对应的 bounds，通过它可以拿到图片的宽度

/* Return a rect the defines the bounds of non-(0,0,0,0) pixels */
@property (NS_NONATOMIC_IOSONLY, readonly) CGRect extent;

然后通过 applyWithExtent 来设置对应的参数。

- (nullable CIImage *)applyWithExtent:(CGRect)extent
                          roiCallback:(CIKernelROICallback)callback
                           inputImage:(CIImage*)image
                            arguments:(nullable NSArray<id> *)args;

这里有4个参数。

extent，也就是之前提到的 DOD，暂且略过。 callback，也就是之前提到的 ROI，暂且略过。 image，缺省的 inputImage，传入我们的成员变量 inputImage 即可。 args，输入参数数组，与 CIKernel 中定义的一一对应。这里只有一个 inputWidth。

PS：这里可能有同学会有疑惑，为什么 inputImage 可以缺省，inputWidth 就需要传入呢。这里暂且不纠结，下面会详细说明

如此，一个自定义 Filter 就完成了。简单吧~ 4. 使用

至于使用上，则和普通的 CIFilter 基本一致。

#import "MirrorXFilter.h"

// 1. 将UIImage转换成CIImage
CIImage *ciImage = [[CIImage alloc] initWithImage:self.imageView.image];

// 2. 创建滤镜
self.filter = [[MirrorXFilter alloc] init];
// 设置相关参数
[self.filter setValue:ciImage forKey:@"inputImage"];

// 3. 渲染并输出CIImage
CIImage *outputImage = [self.filter outputImage];

// 4. 获取绘制上下文
self.context = [CIContext contextWithOptions:nil];

// 5. 创建输出CGImage
CGImageRef cgImage = [self.context createCGImage:outputImage fromRect:[outputImage extent]];
UIImage *image = [UIImage imageWithCGImage:cgImage];
// 6. 释放CGImage
CGImageRelease(cgImage);

如此，我们便可得到翻转后的图片。

  1. 更多

    当然，如果你是一个完美主义者，我觉得你还还可以做更多~

    ```objective-c

  2. (NSDictionary *)customAttributes

    {

    return @{

      @"inputDistance" :  @{
      kCIAttributeMin       : @0.0,
      kCIAttributeMax       : @1.0,
      kCIAttributeSliderMin : @0.0,
      kCIAttributeSliderMax : @0.7,
      kCIAttributeDefault   : @0.2,
      kCIAttributeIdentity  : @0.0,
      kCIAttributeType      : kCIAttributeTypeScalar
      },
  @"inputSlope" : @{
      kCIAttributeSliderMin : @-0.01,
      kCIAttributeSliderMax : @0.01,
      kCIAttributeDefault   : @0.00,
      kCIAttributeIdentity  : @0.00,
      kCIAttributeType      : kCIAttributeTypeScalar
      },
   kCIInputColorKey : @{
   kCIAttributeDefault : [CIColor colorWithRed:1.0
                                         green:1.0
                                          blue:1.0
                                         alpha:1.0]
     },

    };

    }

    ```

    可以为自定义的 Filter 添加对应的参数描述，以及默认值，范围限制等。

这不是必须的，但却是可取的。至于如何设置，可以参考 CIFilter 对应的 attributes 属性，或者参照上面这个例子。 另外，iOS 9之后，引入了 registerFilterName , 你可以通过重写 + (CIFilter *)filterWithName: (NSString *)name;，然后外部使用的时候，跟CIFilter 一模一样。

/** Publishes a new filter called 'name'.

 The constructor object 'anObject' should implement the filterWithName: method.
 That method will be invoked with the name of the filter to create.
 The class attributes must have a kCIAttributeFilterCategories key associated with a set of categories.
 @param   attributes    Dictionary of the registration attributes of the filter. See below for attribute keys.
*/
+ (void)registerFilterName:(NSString *)name
               constructor:(id<CIFilterConstructor>)anObject
           classAttributes:(NSDictionary<NSString *,id> *)attributes NS_AVAILABLE(10_4, 9_0);

不过需要 iOS 9以上才支持，另外一般用于打包成 Image Units 给他人使用。

正常情况下应该是用不到。如果真有这个需求，可以参考这篇文章： Packaging and Loading Image Units。

至此，自定义 Filter 的流程就算走完了，我们很容易就可以配置好需要的环境。

然而，真正的自定义部分，才刚刚开始！

DOD & ROI

1. DOD

DOD ( domain of definition ) ，简单来说就是 Filter 处理后，输入的图片区域。

一般来说，Filter 操作都是基于原图，添加上效果，但是并不会改变图片的大小，显示区域。所以一般与原图的一致即可。

CGRect dod = inputImage.extent;

但是针对形变类的 Filter，则需要根据输出图片大小，设置正确的 DOD。

2. ROI

ROI ( region of interest )，在一定的时间内特别感兴趣的区域，即当前处理区域。

可以简单的理解为：当前处理区域对应于原图中的哪个区域。

ROI 的定义如下：

/* Block callback used by Core Image to ask what rectangles of a kernel's input images
 * are needed to produce a desired rectangle of the kernel's output image.
 *
 * 'index' is the 0-based index specifying which of the kernel's input images is being queried.
 * 'destRect' is the extent rectangle of kernel's output image being queried.
 *
 * Returns the rectangle of the index'th input image that is needed to produce destRect.
 * Returning CGRectNull indicates that the index'th input image is not needed to produce destRect.
 * The returned rectangle need not be contained by the extent of the index'th input image.
 */
typedef CGRect (^CIKernelROICallback)(int index, CGRect destRect);

CIKernelROICallback 在 Core Image 内部进行处理的时候，会多次调用。

index 表示输入图片的下标，顺序和 kernel 中的入参顺序一致，从0开始。

destRect 表示输出图片的区域。 也就是我们先前设置的 DOD。

那，我们为什么要显示设置 ROI 呢 ？

因为输入图片中，参与处理的实际区域，Core Image 是无法知道的，我们需要显式的告诉 CI 这个区域。

这么讲可能有点难以理解，下面我们看两个具体的例子。

CGRect dod = CGRectMake(inputImage.extent.origin.y, inputImage.extent.origin.x, inputImage.extent.size.height, inputImage.extent.size.width);

// e.g.
// 原图片extent (0, 0, 200, 300)
// 旋转后的输出图片 (0, 0, 300, 200)，也就是 DOD

那 ROI 应该怎么设置呢 ？我们之前说过，ROI 计算就是计算当前处理区域对应于原图中的哪个区域。

也就是一个逆向过程。

假如，A：输入图片中的某点 B：输出图片中的某点。那么 ROI 计算可以理解成 ROI（B）= A。

理解好这点，我们不难写出这个操作对应的 ROI：

CIKernelROICallback callback = ^(int index, CGRect rect) {
    return CGRectMake(rect.origin.y, rect.origin.x, rect.size.height, rect.size.width);
};

另外，当输入图片不止一个的时候，则需要根据 index 来做区别。因为这里的 rect 每次都是返回 DOD，而不是当前图片的 extent。

PreviousGPUImage源码解读(八)NextiOS通用链接

Last updated