iOS开发 滤镜的使用

iOS开发之滤镜的使用技巧（CoreImage）

 

一、滤镜的内容和效果是比较多并且复杂的 ，学习滤镜需要技巧 如下：

两个输出语句解决滤镜的属性选择问题：

• 1.查询效果分类中包含什么效果
  按住command 点击CIFilter 进入接口文件 找到第128行-148行全部都是 效果分类
• 2.选择其中某一个分类拷贝
  NSLog -> [CIFilter filterNamesInCategory:刚才拷贝的分类]; -> 打印出来的 是这个分类包含的所有效果 -> 拷贝选择其中的某一个效果
• 3.查询使用的效果中可以设置什么属性（KVC） attributes
  NSLog -> [CIFilter filterWithName:刚才拷贝选择其中的某一个效果].attributes ->得到这个滤镜所有可以设置的属性

  二、了解滤镜的相关介绍

  介绍
  • 1.框架介绍
    （1）CoreImage
    （2）是一个图像框架 它基于OpenGL顶层创建 底层则用着色器来处理图像
    （3）它利用了GPU基于硬件加速来处理图像
    （4）CoreImage中有很多滤镜
    （5）它们能够一次给予一张图像或者视频帧多种视觉效果 -> 滤镜链
    （6）而且滤镜可以连接起来组成一个滤镜链 把滤镜效果叠加起来处理图像
• 2.类的介绍
  （1）CIImage：保存图像数据的类 CGImageRef->图像中的数据
  （2）.CIFilter：滤镜类 图片属性进行细节处理的类 它对所有的像素进行操作 用键-值（KVC）来设置
  （3）.CIContext：上下文是实现对图像处理的具体对象 -> 滤镜对象输出的图像并不是合成之后的图像 需要使用图像处理的上下文合并处理的图像
• 3.效果介绍
• 按效果分类：
  kCICategoryDistortionEffect 扭曲效果，比如bump、旋转、hole
  kCICategoryGeometryAdjustment 几何开着调整，比如仿射变换、平切、透视转换
  kCICategoryCompositeOperation 合并，比如源覆盖（source over）、最小化、源在顶（source atop）、色彩混合模式
  kCICategoryHalftoneEffect Halftone效果，比如screen、line screen、hatched
  kCICategoryColorAdjustment 色彩调整，比如伽马调整、白点调整、曝光
  kCICategoryColorEffect 色彩效果，比如色调调整、posterize
  kCICategoryTransition 图像间转换，比如dissolve、disintegrate with mask、swipe
  kCICategoryTileEffect 瓦片效果，比如parallelogram、triangle
  kCICategoryGenerator 图像生成器，比如stripes、constant color、checkerboard
  kCICategoryGradient 渐变，比如轴向渐变、仿射渐变、高斯渐变
  kCICategoryStylize 风格化，比如像素化、水晶化
  kCICategorySharpen 锐化、发光

• kCICategoryBlur 模糊，比如高斯模糊、焦点模糊、运动模糊

  • 按使用场景分类：
    kCICategoryStillImage 用于静态图像
    kCICategoryVideo 用于视频
    kCICategoryInterlaced 用于交错图像
    kCICategoryNonSquarePixels 用于非矩形像素
    kCICategoryHighDynamicRange 用于HDR

    三、使用步骤

    1.实例CIImage -> 先把UIImage -> CGImageRef -> CIImage
    2.创建CIFilter滤镜并给滤镜设置属性（KVC）
    3.创建CIContext上下文
    4.初始化一个CGImageRef 输出图片对象 合并滤镜输出的图像
    5.赋给UIImage对象进行显示
    6.如果想使用滤镜链 可以再次添加效果

    四、一个实例解析 滤镜 滤镜链 保存图片

    代码示例：

    #import "ViewController.h"//宏定义  屏幕的宽
    #define SCREEN_WIDTH CGRectGetWidth([UIScreen mainScreen].bounds)
    
    //注意挂上代理
    @interface ViewController ()    <UIImagePickerControllerDelegate,UINavigationControllerDelegate>
    {
    
        UIImageView *myImageView;//接收图片的视图
        UIButton *photoButton;//从本地相册选择图片的按钮
        UIButton *filterButton;//添加滤镜的按钮
        UIButton *saveButton;//滤镜后保存到本地相册的按钮
    }
    @end
    @implementation ViewController
    - (void)viewDidLoad {
    [super viewDidLoad];
    //去除导航栏的高度
    
       self.edgesForExtendedLayout = UIRectEdgeNone;
    //设置背景色
    
       self.view.backgroundColor = [UIColor greenColor];
    // 创建按钮
    
       NSArray *titleButtonList = @[@"photo",@"Filter",@"save"];
       for (int i=0; i<titleButtonList.count; i++) {
           UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
    button.frame = CGRectMake(20+80*i, 20, 60, 40);
    [button setTitle:titleButtonList[i] forState:UIControlStateNormal];
    button.tag = 10 +i ;
    [button setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
    button.backgroundColor = [UIColor cyanColor];
    [self.view addSubview:button];
           }
    
       //    初始化图片视图
           myImageView = [[UIImageView alloc]initWithFrame:CGRectMake(20, 100, SCREEN_WIDTH-40, 300)];
           myImageView.backgroundColor = [UIColor cyanColor];
           [self.view addSubview:myImageView];
    
           photoButton = [self.view viewWithTag:10];
           filterButton = [self.view viewWithTag:11];
           saveButton = [self.view viewWithTag:12];
    
       //    给三个按钮添加触发事件
           [photoButton addTarget:self action:@selector(photoAction:) forControlEvents:UIControlEventTouchUpInside];
       //    滤镜按钮
           [filterButton addTarget:self action:@selector(filterAction:) forControlEvents:UIControlEventTouchUpInside];
       //保存滤镜后图片的按钮
           [saveButton addTarget:self action:@selector(saveAction:) forControlEvents:UIControlEventTouchUpInside];
    
       }
       //选择图片
       - (void)photoAction:(UIButton *)sender{
           UIImagePickerController *pickerController = [[UIImagePickerController alloc]init];
           pickerController.delegate = self;
           [self presentViewController:pickerController animated:YES completion:nil];
       }
    
       //把图片放在图片视图上
       - (void)imagePickerController:(UIImagePickerController *)picker didFinishPickingMediaWithInfo:(NSDictionary<NSString *,id> *)info{
           UIImage *image = info[UIImagePickerControllerOriginalImage];
           myImageView.image = image;
           [self dismissViewControllerAnimated:YES completion:nil];
       }
    
       //滤镜按钮的触发方法
       - (void)filterAction:(UIButton *)sender{
    
       //    1.源图
           CIImage *inputImage = [CIImage imageWithCGImage:myImageView.image.CGImage];
       //    2.滤镜
           CIFilter *filter = [CIFilter filterWithName:@"CIColorMonochrome"];
       //    NSLog(@"%@",[CIFilter filterNamesInCategory:kCICategoryColorEffect]);//注意此处两个输出语句的重要作用
            NSLog(@"%@",filter.attributes);
    
           [filter setValue:inputImage forKey:kCIInputImageKey];
    
           [filter setValue:[CIColor colorWithRed:1.000 green:0.165 blue:0.176 alpha:1.000] forKey:kCIInputColorKey];
           CIImage *outImage = filter.outputImage;
           [self addFilterLinkerWithImage:outImage];
    
       }
    
       //再次添加滤镜  形成滤镜链
       - (void)addFilterLinkerWithImage:(CIImage *)image{
    
           CIFilter *filter = [CIFilter filterWithName:@"CISepiaTone"];
           [filter setValue:image forKey:kCIInputImageKey];
           [filter setValue:@(0.5) forKey:kCIInputIntensityKey];
    
       //    在这里创建上下文  把滤镜和图片进行合并
           CIContext *context = [CIContext contextWithOptions:nil];
           CGImageRef resultImage = [context createCGImage:filter.outputImage fromRect:filter.outputImage.extent];
           myImageView.image = [UIImage imageWithCGImage:resultImage];
    
       }
    
       //保存滤镜后的图片到本地相册
       - (void)saveAction:(UIButton *)sender{
           UIImageWriteToSavedPhotosAlbum(myImageView.image, self, @selector(image:didFinishSavingWithError:contextInfo:), nil);
       }
    
       //保存成功调用的方法
       - (void)image:(UIImage *)image didFinishSavingWithError:(NSError *)error contextInfo:(void *)contextInfo{
           NSLog(@"保存成功");
       }
       @end

  • 2015年的苹果WWDC大会给着迷于Core Image Filters的开发者带来了一些好消息。（这次大会上）不仅有很多的滤镜，例如由MetalPerformanceShaders支持的模糊滤镜和卷积滤镜，在性能上表现出一些惊人的提升，而且苹果公司已经在iOS和OSX平台上都实现了相同性能的可用图像滤镜。
    

    这也给了iOS新的图像滤镜，以至于我都等不及把它加到我自己的Nodality应用里面了。这同时也也意味着代码和功能可以在类和设备上分享，我已经在设想一个Nodality的桌面版本了。

    那么，这些新滤镜是神马玩意？ 这么说吧，CIFilter这个类里有类方法filterNamesInCategories()，用来返回一个包含所有可用滤镜的数组。下面快速浏览一下iOS8和9之间的差异吧：

    • CIAreaAverage       - 返回一个单像素图像，其中包含一块颜色区内的平均颜色。

    • CIAreaMaximum       - 返回一个单像素图像，其中包含一块颜色区内最大的颜色成分。

    • CIAreaMaximumAlpha    - 返回一个单像素图像，其中包含颜色区中最大透明度的颜色矢量。

    • CIAreaMinimum       - 返回一个单像素图像，其中包含颜色区中最小颜色成分。

    • CIAreaMinimumAlpha    - 返回一个单像素图像，其中包含颜色区内的最小透明度的颜色矢量。

    • CIBoxBlur          - 在一个矩形内使得图像模糊化。

    • CICircularWrap       - 用一个透明的圆圈环绕图像。

    • CICMYKHalftone       - 创建一个颜色，使得源图像呈半色调，在白色页面中使用使用青色，品红色，黄色和墨色。

    • CIColumnAverage       - 返回一个高为1像素的图像，包含每个扫描列的平均颜色。

    • CIComicEffect        - 像漫画书一样勾勒（图像）边缘，并应用半色调效果。

    • CIConvolution7X7      - 用一个7x7旋转矩阵来调整像素值。

    • CICrystallize        - 通过汇集源像素的颜色值，创建多边形色块。

    • CIDepthOfField        - 模拟一个场景深入的效果。

    • CIDiscBlur          - 在一个圆盘形状内模糊化图像。

    • CIDisplacementDistortion  - 将第二图像的灰度值应用到第一图像。

    • CIDroste             - 用类似M.C.埃舍尔绘图方式递归地绘制图像的一部分。

    • CIEdges              - 用颜色显示图像的边缘。

    • CIEdgeWork            - 产生一个黑白风格的类似木块切口的图像。

    • CIGlassLozenge         - 创建一个菱形滤镜，并扭曲滤镜位置的图像。

    • CIHeightFieldFromMask     - 产生一个连续的三维物体，一个阁楼形的灰场。

    • CIHexagonalPixellate      - 用所替换的像素映射彩色六边形的图像。

    • CIKaleidoscope          - 从源图像中通过将12路对称，产生一个五颜六色的图象。

    • CILenticularHaloGenerator   - 模拟闪光灯效果。

    • CILineOverlay           - 创建草图，用黑色勾勒出图像的边缘。

    • CIMedianFilter           - 计算一组邻近像素的平均数，然后用平均数替代每个像素的值。

    • CINoiseReduction          - 通过降低噪声的限定值来降低噪音。

    • CIOpTile               - 先分割图像，施加一些指定的缩放和旋转，然后拼接图像，形成的艺术化的表现。

    • CIPageCurlTransition       - 使用翻页效果从一个图像转换到另一个图像，翻卷后显示新的图像。

    • CIPageCurlWithShadowTransition  - 使用翻页效果从一个图像转换到另一个图像，翻卷后显示新的图像。

    • CIParallelogramTile         - 展示一个在平行四边形内的图像。

    • CIPassThroughColor

    • CIPassThroughGeom

    • CIPDF417BarcodeGenerator

    • CIPointillize              - 呈现一个pointillistic风格的源图像。

    • CIRippleTransition          - 图像创建一个圆形波从中心点向外扩大，在波形里显示新图像。

    • CIRowAverage              - 返回1个像素高的图像，其中包含每行扫描的平均颜色。

    • CIShadedMaterial            - 从一个高度场产生一个阴影图像。

    • CISpotColor               - 用色点替换颜色范围。

    • CISpotLight               - 图像使用一个方向聚光灯效果呈现。

    • CIStretchCrop              - 图像通过拉伸和或裁剪以适合目标尺寸。

    • CISunbeamsGenerator          - 图像呈现阳光照射的效果。

    • CITorusLensDistortion         - 创建环形滤镜，并扭曲透镜位置的图像。

    • CITriangleTile             - 截取图像的一个三角形部分映射到一个三角形区域，然后平铺展示。