直播预览层添加滤镜效果

  • 原理,在显示之前,提前对图片进行滤镜处理,把处理后的图片展示出来就好了.

  • CIFiter(滤镜类):给图片添加特殊效果(模糊,高亮等等).

  • CIFiter滤镜分类(一个滤镜可能属于多个分类)

    • 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
    • kCICategoryBuiltIn 获取所有滤镜
  • 常用图片处理滤镜:


    // 怀旧 --> CIPhotoEffectInstant 单色 --> CIPhotoEffectMono
    // 黑白 --> CIPhotoEffectNoir 褪色 --> CIPhotoEffectFade
    // 色调 --> CIPhotoEffectTonal 冲印 --> CIPhotoEffectProcess
    // 岁月 --> CIPhotoEffectTransfer 铬黄 --> CIPhotoEffectChrome
  • 自动处理滤镜,通过CIImage获取,CIImage会自动对图片进行滤镜处理

    CVImageBufferRef imageBuffer = CMSampleBufferGetImageBuffer(sampleBuffer);

    // 转换为CIImage
CIImage *ciImage = [CIImage imageWithCVImageBuffer:imageBuffer]; NSArray *fiters = [ciImage autoAdjustmentFilters]; NSLog(@"%@",fiters);
  • 常有的自动滤镜

        CIRedEyeCorrection:修复因相机的闪光灯导致的各种红眼
    CIFaceBalance:调整肤色
    CIVibrance:在不影响肤色的情况下,改善图像的饱和度
    CIToneCurve:改善图像的对比度
    CIHighlightShadowAdjust:改善阴影细节
  • 滤镜对象创建(也可以使用coreImage自动处理滤镜,就不需要自己创建)

  • 滤镜属性可以通过inputKeys属性获取

  • 滤镜工作原理,给滤镜传入一个图片,滤镜有个方法,可以获取处理完成的图片outputImage.

        CIFilter *fiter = [CIFilter filterWithName:@"CIPhotoEffectInstant"];

        [fiter setValue:ciImage forKey:@"inputImage"];

        ciImage = fiter.outputImage;

直播预览层添加滤镜效果步骤

  • 取出捕获到的帧(CMSampleBufferRef) -> 获取帧里面图片信息(CVImageBufferRef) -> CIFiter滤镜处理 ->转换成UIImage -> 设置为UIImageView的image就能实时显示捕获的画面
if (_videoConnection == connection) {
// 获取图片信息
CVImageBufferRef imageBuffer = CMSampleBufferGetImageBuffer(sampleBuffer); // 转换为CIImage
CIImage *ciImage = [CIImage imageWithCVImageBuffer:imageBuffer]; // 创建滤镜
CIFilter *fiter = [CIFilter filterWithName:@"CIFaceBalance"]; [fiter setValue:ciImage forKey:@"inputImage"];
[fiter setValue:@100 forKey:@"inputStrength"];
ciImage = fiter.outputImage; // 转换UIImage
UIImage *image = [UIImage imageWithCIImage:ciImage]; dispatch_sync(dispatch_get_main_queue(), ^{ self.imageView.image = image; });
}

通过GPU渲染图片显示

  • 只有OpenGL才能操控GPU,需要用到OpenGL才行
  • CIContext:通过这个上下文的方法渲染图片(createCGImage)
  • CIContext:通过OpenGL的上下文创建,就能用GPU渲染图片,处理图片效率高.(contextWithEAGLContext)
  // 获取图片信息
CVImageBufferRef imageBuffer = CMSampleBufferGetImageBuffer(sampleBuffer); // 转换为CIImage
CIImage *ciImage = [CIImage imageWithCVImageBuffer:imageBuffer]; // 创建滤镜
CIFilter *fiter = [CIFilter filterWithName:@"CIPhotoEffectInstant"]; [fiter setValue:ciImage forKey:@"inputImage"]; ciImage = fiter.outputImage; EAGLContext *openglCtx = [[EAGLContext alloc] initWithAPI:kEAGLRenderingAPIOpenGLES2];
CIContext *ctx = [CIContext contextWithEAGLContext:openglCtx]; CGImageRef imgRef = [ctx createCGImage:ciImage fromRect:ciImage.extent]; UIImage *image = [UIImage imageWithCGImage:imgRef]; // 用完了及时清空,否则内存溢出,造成程序崩溃.使用C语言的时候,需要特别注意内存管理.
CGImageRelease(imgRef); // 转换UIImage dispatch_sync(dispatch_get_main_queue(), ^{ self.imageView.image = image; });
  • 注意点:有个地方需要自己管理内存,否则程序会闪退,报下列错误
CGImageRef imgRef = [ctx createCGImage:ciImage fromRect:ciImage.extent];

UIImage *image = [UIImage imageWithCGImage:imgRef];

// 用完了及时清空,否则内存溢出,造成程序崩溃.使用C语言的时候,需要特别注意内存管理.
CGImageRelease(imgRef);
  • 注意点:会报坏内存访问,原因有些对象销毁了,没有及时清空,再次用到就坏内存访问
  • 测试:不需要添加滤镜效果,容易测试出来,报下列错误
 

  • 解决:把一个周期的代码,放入一个自动释放池里管理,下一个运行循环,会自动清空已经销毁的对象。
  • 自动释放池:可以用来管理一段代码中对象的生命周期。
 @autoreleasepool {
// 获取图片信息
CVImageBufferRef imageBuffer = CMSampleBufferGetImageBuffer(sampleBuffer); // 转换为CIImage
CIImage *ciImage = [CIImage imageWithCVImageBuffer:imageBuffer]; // 创建滤镜
CIFilter *fiter = [CIFilter filterWithName:@"CIPhotoEffectInstant"]; [fiter setValue:ciImage forKey:@"inputImage"]; ciImage = fiter.outputImage; EAGLContext *openglCtx = [[EAGLContext alloc] initWithAPI:kEAGLRenderingAPIOpenGLES2];
CIContext *ctx = [CIContext contextWithEAGLContext:openglCtx]; CGImageRef imgRef = [ctx createCGImage:ciImage fromRect:ciImage.extent]; UIImage *image = [UIImage imageWithCGImage:imgRef]; // 用完了及时清空,否则内存溢出,造成程序崩溃.使用C语言的时候,需要特别注意内存管理.
CGImageRelease(imgRef); // 转换UIImage dispatch_sync(dispatch_get_main_queue(), ^{ self.imageView.image = image; }); } }

直播预览层添加滤镜效果(CIFilter使用场景)的更多相关文章

  1. (转)ASP.NET MVC 第五个预览版和表单提交场景

    转自:http://ourlife.blog.51cto.com/708821/296171 上个星期四,ASP.NET MVC开发团队发布了ASP.NET MVC框架的“第五个预览版”.你可以在这里 ...

  2. 一文带你玩转对象存储COS文档预览

    随着"互联网+"的发展,各行各业纷纷"去纸化",商务合同.会议纪要.组织公文.商品图片.培训视频.学习课件.随堂讲义等电子文档无处不在.而要查看文档一般需要先下 ...

  3. MUI - 图片预览(perviewimage)的优化

    主要对mui图片全屏预览插件做了以下三点补充 1.添加了预览图片文字说明,使用的时候需要添加以下css及DOM属性 .mui-slider-img-content { position: absolu ...

  4. java原装代码完成pdf在线预览和pdf打印及下载

    这是我在工作中,遇到这样需求,完成需求后,总结的成果,就当做是工作笔记,以免日后忘记,当然,能帮助到别人是最好的啦! 下面进入正题: 前提准备: 1. 项目中至少需要引入的jar包,注意版本: a)  ...

  5. jQuery插件ImgAreaSelect 实例讲解一(头像上传预览和裁剪功能)

    上一节随笔中,我们已经知道了关于jQuery插件ImgAreaSelect基本的知识:那么现在看一下实例: 首先,要知道我们应该实现什么功能? (1)图片能够实现上传预览功能 (2)拖拽裁剪图片,使其 ...

  6. 微信开发中使用微信JSSDK和使用URL.createObjectURL上传预览图片的不同处理对比

    在做微信公众号或者企业微信开发业务应用的时候,我们常常会涉及到图片预览.上传等的处理,往往业务需求不止一张图片,因此相对来说,需要考虑的全面一些,用户还需要对图片进行预览和相应的处理,在开始的时候我使 ...

  7. 使用input选择本地图片,并且实现预览功能

    1.使用input标签选择本地图片文件 用一个盒子来存放预览的图片 2.JS实现预览 首先添加一个input change事件,再用到 URL.createObjectURL() 方法 用来创建 UR ...

  8. .NET 8新预览版本使用 Blazor 组件进行服务器端呈现

    简介 此预览版添加了对使用 Blazor 组件进行服务器端呈现的初始支持.这是 Blazor 统一工作的开始,旨在使 Blazor 组件能够满足客户端和服务器端的所有 Web UI 需求.这是该功能的 ...

  9. 解决Android界面布局添加EditText组件后界面无法预览

    错误报告: Exception raised during rendering: java.lang.System.arraycopy([CI[CII)V Exception details are ...

  10. 【android学习3】解决Android界面布局添加EditView之后无法预览问题

    在设计登陆界面时,拖入一个EditView之后发现界面无法预览 问题分析: 进入xml源文件里发现一个警告,提示添加inputType或者hint元素,添加后界面仍然无法预览... 仔细查看了当前使用 ...

随机推荐

  1. 关于如何更改Cuda的版本的一些事情

    1. 网上说的很全面了,这里我把我遇到的一些问题和解决方案罗列出来,以便未来的学习和了解. 博客的好处就体现出来了,下次你再用这个东西,就直接打开你的博客照抄就行了,不用东搜西搜了,及其方便,这种碎片 ...

  2. Nginx 配置 浏览器显示真实接口地址

    server { listen 9780; server_name localhost; #charset koi8-r; access_log /var/log/nginx/host.access. ...

  3. 低功耗4G模组:RSA算法示例

    ​ 今天我们学习合宙低功耗4G模组Air780EP_LuatOS_rsa示例,文末[阅读原文]获取最新资料. 一.简介 RSA算法的安全性基于:将两个大质数相乘很容易,但是想要将其乘积分解成原始的质数 ...

  4. Ubuntu apt-cache命令查找可用软件包

    本文GoFace给大家讲解下在Ubuntu及相同包管理的linux系统下如何查找可用软件包.在Ubuntu上大家一般使用apt-get安装软件,如果想查找某一包软件仓库中是否有,并不是使用apt-ge ...

  5. PHP5.2-5.6不同版本新特性

    温故而知新, 时常复习下之前的东西 还是会有一些收获 本文目录:PHP5.2 以前:autoload, PDO 和 MySQLi, 类型约束PHP5.2:JSON 支持PHP5.3:弃用的功能,匿名函 ...

  6. python之异步任务框架Celery

    官网参考: Celery 官网:http://www.celeryproject.org/ Celery 官方文档英文版:http://docs.celeryproject.org/en/latest ...

  7. manim边做边学--曲面

    Surface类是Manim中专为创建和操控复杂的三维表面而打造的. 在实际应用中,无论是创建数学教学中的几何模型,还是模拟物理现象中的曲面变化,甚至是构建复杂的动画场景中的三维元素,Surface类 ...

  8. vue 适配不同分辨率显示问题

    新建 js 文件 rem.js class DevicePixelRatio { constructor() { // this.flag = false; } // 获取系统类型 _getSyste ...

  9. 渗透测试-Kioptix Level 1靶机getshell及提权教程

    声明! 学习视频来自B站up主 泷羽sec 有兴趣的师傅可以关注一下,如涉及侵权马上删除文章,笔记只是方便各位师傅的学习和探讨,文章所提到的网站以及内容,只做学习交流,其他均与本人以及泷羽sec团队无 ...

  10. RepoDB:一个介于Dapper、EFCore之间.Net的ORM库

    推荐一个介轻量ORM和全功能ORM的开源项目. 01 项目简介 RepoDB 提供了基本操作所需的方法,同时也提供了一些高级功能,如第二层缓存.跟踪.仓储.属性处理器和批量/大量操作.支持的数据库,包 ...