iOS开发之滤镜的使用技巧(CoreImage)

Posted 小敏的博客

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了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             - 截取图像的一个三角形部分映射到一个三角形区域,然后平铺展示。

以上是关于iOS开发之滤镜的使用技巧(CoreImage)的主要内容,如果未能解决你的问题,请参考以下文章

CoreImage 中的模糊滤镜

iOS CoreImage图片处理动态渲染(滤镜)

iOS滤镜 图片处理

通过CoreImage生成二维码

iOS给图片添加滤镜&使用openGLES动态渲染图片

iOS通过CIFilter对图像进行滤镜处理