分分钟消除马赛克

作者: dimsky | 来源:发表于2016-08-15 00:44 被阅读1953次

先看图:

这不是马蓉,跟宝宝也没关系

无标题,不简书。

苹果在开发框架中并没有给我们提供太多的图形处理API,模糊效果也只提供了高斯模糊,而且还有使用的限制。如果需要简单的实现其他的模糊效果,我们需要用到一些第三方框架。
下面我们会用到GPUImage, 这个库有什么用呢?
在iOS 中,GPUImage是目前做图片、相机滤镜最主流的框架,没有之一,还支持照相机和摄像机的实时滤镜,它基于OpenGL对图片处理单元进行封装,通过GPU进行图形加速处理,所以使用GPUImage 也是让你的应用保持60帧必不可少的,GPUImage还提供了非常多的常用的滤镜,使用也特别简单。也就是说GPUImage能带你玩转所有的图像处理,你可以通过GPUImage 实现很多炫酷的效果。今年很火的Prisma 肯定都用过了,目测也是通过GPUImage来实现。

GPUImage

这里介绍一下GPUImage的基本概念:
GPUImageInput 输入源
GPUImageOutput 输出源
GPUImageFilter 滤镜 可以是输出源,也可以是输入源

图片处理生成就像一根管道,类似这样:

摘自网络

在处理过程中,可以添加多个滤镜进行图形处理。

简单的实现流程是先通过 GPUImagePicture 对象作为输入源传给 GPUImageFilter,然后filter将处理好的图像传给 GPUImageView 最终显示到设备上。
在加入滤镜修改滤镜的属性之后,我们需要调用processImage 来抓取处理过的图像呈现出来。

let gpuImagePic = GPUImagePicture(image: image)
let filter = GPUImagePixellateFilter()
let gpuImageView = GPUImageView()
filter.addTarget(gpuImageView)
filter.forceProcessingAtSize(image!.size)
filter.fractionalWidthOfAPixel = 0.1
filter.useNextFrameForImageCapture()
gpuImagePic.addTarget(filter)
gpuImagePic.processImage()
self.view.addSubview(gpuImageView)

CADisplayLink

然后就是动画了,这里用到了CADisplayLink,CADisplayLink也可以说是一个定时器。因为CADisplayLink可以保证与屏幕刷新率相同的频率,目前主流屏幕都是60Hz,也就是60帧/秒。如果应用的运行帧能达到60帧/秒,那就是如丝般顺滑了。(现在有些高端显示屏幕刷新率也达到了144Hz)。既然使用了GPUImage,那当然不用担心性能了,GPU的图像处理效率比CPU自然高很多。
CADisplayLink 需要加入到Runloop中使用,通过 paused 属性来控制开始,暂停。

let displayLink = CADisplayLink(target: self, selector: #selector(transition(_:)))
displayLink.addToRunLoop(NSRunLoop.mainRunLoop(), forMode: NSRunLoopCommonModes)
displayLink.paused = true

然后将每一帧都生成图像,通过调用 processImage() 显示出来:

func transition(link: CADisplayLink) {
    if startTime == 0 {
        startTime = link.timestamp
    }
    progress = max(0, min(CGFloat(link.timestamp - startTime) / duration, 1))
    if isShow {
        filter.fractionalWidthOfAPixel = 0.1 * (1 - progress)
    } else {
        filter.fractionalWidthOfAPixel = 0.1 * progress
    }
    gpuImagePic.processImage()
    if progress == 1 {
        displayLink.paused = true
    }
}

然后,你就多了一个可已看透马赛克的技能了。恭喜。

还有,大家觉得马赛克可逆么?

文中的例子可以在这里下载到。

相关文章

  • 分分钟消除马赛克

    先看图: 无标题,不简书。 苹果在开发框架中并没有给我们提供太多的图形处理API,模糊效果也只提供了高斯模糊,而且...

  • 【无戒学堂】运动是最好的休息方式

    思考的神经连续工作2小时,然后停下来休息,至少需要20分钟才能消除疲劳,而用运动方式则只需5分钟疲劳就消除了。 脑...

  • 和你分享最简单好用的减压方法!

    “1分钟”疗愈导师尼克•奥特纳(Nick Ortner),告诉你有效消除压力与负面情绪。实现15分钟快速减压、达到...

  • 五毛和一块

    应用场景:破冰游戏,午间游戏 项目性质:消除隔阂,消除疲劳 活动时间:15分钟左右 场地要求:室内会场空地或室外 ...

  • 瘦身日记3

    1.晨练抽腿动作把自己腿弄得抽筋了 2.消除假宽跨两个动作运动15分钟 3.读书30分钟

  • 2017-06-24

    净化魔晶:抑菌消臭,消除疲劳,森林浴效果。尤其对化学异味,烟味,鱼腥味有强大功效。用了净化魔晶15分钟即可消除

  • OpenGLES滤镜开发汇总 —— 马赛克

    什么是马赛克 马赛克原理 马赛克的实现 方格马赛克的glsl实现如下: 得到的马赛克效果如下: 圆形马赛克的实现:...

  • 5分钟消除牙垢从此爱上笑

    烦恼吧,洗牙又酸又难受,很痛苦,还要有一笔开支,告诉你让牙齿快速变白的绝好方法,简单容易又省钱,包你满意。 1.草...

  • 如何消除拖延(线上培训5分钟)

    不知道大家有没有这样一种情况:制定了一项任务,可是各种磨蹭,拖延,最后都没有做。有这种情况的伙伴,请在聊天室里打1...

  • 做“说人话”的广告是怎样的体验?知乎这次不高冷!

    全文约为1500字 | 建议阅读5分钟 继今日头条体、一点资讯马赛克体、网易云音乐评论体之后,大字报广告界终于把知...

网友评论

    本文标题:分分钟消除马赛克

    本文链接:https://www.haomeiwen.com/subject/yffusttx.html