直播预览层添加滤镜效果

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

  • 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. CSP-S 2024 简单题

    CSP-S 2024 简单题 以下均为考场做法. T1 决斗 (duel) 考虑贪心,按照攻击力 \(a_i\) 排序,从小到大使用所有怪物进行攻击,每只怪物攻击一个在场且能击杀的怪物中,攻击力最大的 ...

  2. 强化学习:如何计算被环境系统截断的terminated state的value值 —— (Bootstrap returns from value estimates if episode is terminated by timeout)

    本文主题:如何计算强化学习中被环境系统截断的terminated state的value值 首先解释一下什么是强化学习中的terminated state的value值,强化学习就是一个智能体(age ...

  3. 科技论文在methodology部分应该使用什么语态?

    什么神奇的事情,在计算机领域的论文中,如果没有特殊的必要非要用过去式,那么一律使用一般现在时,十分神奇. 或许在计算机领域论文中这一点比较特殊,也可能是大家都这么用也就这样了. 总结来说,在计算机领域 ...

  4. 【THUPC 2024 初赛】 E 转化

    [THUPC 2024 初赛] 转化 我都能做出来,那就是大水题了. 思路 首先我们要确定最大可以变色的球的数量 \(tot\). 有如下两个贪心步骤: 所有颜色使用分裂操作,并更新 \(a_i\). ...

  5. Nuxt.js 应用中的 webpack:configResolved事件钩子

    title: Nuxt.js 应用中的 webpack:configResolved事件钩子 date: 2024/11/21 updated: 2024/11/21 author: cmdragon ...

  6. java——棋牌类游戏五子棋(webwzq1.0)之一(基础)

    这是本人最近一段时间写的斗地主的java代码,大体框架都实现了,一些细节还需要后续优化. package basegame; import java.awt.Button; import java.a ...

  7. 接口压力测试工具之go-wrk

    go-wrk 是一个用Go语言实现的轻量级的http基准测试工具,类似于wrk,本文将简单介绍一下如何使用go-wrk实现接口的性能(压力)测试. github地址:https://github.co ...

  8. Spring Cloud Alibaba:一站式微服务解决方案

    一.简介 Spring Cloud Alibaba(简称SCA) 是一个基于 Spring Cloud 构建的开源微服务框架,专为解决分布式系统中的服务治理.配置管理.服务发现.消息总线等问题而设计. ...

  9. 为什么你用的 MyBatis 慢?一行配置让它性能翻倍!

    为什么你用的 MyBatis 慢?一行配置让它性能翻倍! 在 Java 后端开发的江湖里,MyBatis 堪称一员大将,凭借着灵活的 SQL 编写.方便的数据库对接能力,深受广大开发者的喜爱.但不少小 ...

  10. docker安装指定版本的gitlab并配置ssl证书

    安装gitlab,指定14.5.2版本,为便于与下篇文章:gitlab恢复做准备.如果不需要恢复,或不需要配置ssl证书,请自行精简以下操作. 1. 开启gitlab sh gitlab.sh doc ...