大熊猫猪·侯佩原创或翻译作品.欢迎转载,转载请注明出处.

如果觉得写的不好请多提意见,如果觉得不错请多多支持点赞.谢谢! hopy ;)


之前的博文中我们实现了RPG人物的复古效果.

现在我们再完点high的,我们准备实现这么一种效果:

人物从中心点开始形成一个空洞,洞的边缘产生一种吸入变形效果.

有了上一篇的铺垫,我们可以很快搞定它.

首先看一下Apple对其CIHoleDistortion滤镜的说明:

Creates a circular area that pushes the image pixels outward, distorting those pixels closest to the circle the most.

Localized Display Name
Hole Distortion

inputImage
A CIImage object whose display name is Image.
inputCenter
A CIVector object whose attribute type is CIAttributeTypePosition and whose display name is Center.

Default value: [150 150]
inputRadius
An NSNumber object whose attribute type is CIAttributeTypeDistance and whose display name is Radius.

Default value: 150.00

以上是滤镜对应的3个参数,很简单:

第一个是输入图片,第二个是黑洞的中心点,最后一个是黑洞的半径.

官方网站还给出了应该显示的效果:

好了,下面我们把它放到游戏中去:

//将CGImage转换为CIImage
    CIImage *ciImage = [CIImage imageWithCGImage:_image.CGImage];
    //用过滤器生成新的CIImage
    CIFilter *filter = [CIFilter filterWithName:@"CIHoleDistortion"];
    CIVector *vector = [CIVector vectorWithX:sz.width*_image.scale/2
                                           Y:sz.height*_image.scale/2];
    [filter setValue:ciImage forKey:@"inputImage"];
    [filter setValue:vector forKey:@"inputCenter"];
    [filter setValue:@(10.0) forKey:@"inputRadius"];
    CIImage *outputImage = [filter outputImage];

以上我们选择RPG人物的中心点为黑洞的中心,且黑洞的半径为10.

编译运行游戏,效果如下:

放大一点看一下效果:

可以看到上图中的狗狗的肚子里出现了背景草地上一朵小花.

一般来说要想实现该效果,需要自己写OpenGL ES的端点和片段着色器,但是我们通过Cocoa提供的滤镜,避免了较底层的方法,而且实现起来非常简单.

Cocos2D结合CoreGraphics实现RPG人物中空黑洞吸入效果的更多相关文章

  1. cocos2dx 3.x(实现帧动画(人物动画,跑马灯效果)的几种方法)

    //创建一个跑酷的精灵
  auto sprite = Sprite::create("1.png");
 //设置精灵的坐标
 sprite->setPosition(Ve ...

  2. SpriteBuilder&Cocos2D使用CCEffect特效实现天黑天亮过度效果

    大熊猫猪·侯佩原创或翻译作品.欢迎转载,转载请注明出处. 如果觉得写的不好请多提意见,如果觉得不错请多多支持点赞.谢谢! hopy ;) 在动作或RPG类游戏中我们有时需要天黑和天亮过度的效果来完成场 ...

  3. CSS filter 模拟黑洞照片效果

    今天被世界上第一张黑洞照片刷屏. 一整天,哪里都是这张照片.看的多了.我就想用css做一个吧. 建议在chrome上查看. 访问地址:http://suohb.com/work/blankHole.h ...

  4. SpriteBuilder&Cocos2D使用CCEffect特效实现天黑天亮过度效果

    大熊猫猪·侯佩原创或翻译作品.欢迎转载,转载请注明出处. 假设认为写的不好请多提意见,假设认为不错请多多支持点赞.谢谢! hopy ;) 在动作或RPG类游戏中我们有时须要天黑和天亮过度的效果来完毕场 ...

  5. Cocos2D v3.4.9粒子效果不能显示的原因分析及解决办法

    大熊猫猪·侯佩原创或翻译作品.欢迎转载,转载请注明出处. 如果觉得写的不好请多提意见,如果觉得不错请多多支持点赞.谢谢! hopy ;) 在游戏App中为了衬托气氛我们往往使用一些特殊的图形效果,粒子 ...

  6. 用仿ActionScript的语法来编写html5——第四篇,继承与简单的rpg

    第四篇,继承与简单的rpg 这次用继承自LSprite的类来实现简单的rpg的demo先看一下最后的代码与as的相似度 var backLayer; //地图 var mapimg; //人物 var ...

  7. cocos2d粒子效果

    第9章 粒子效果 游戏开发者通常使用粒子系统来制作视觉特效.粒子系统能够发射大量细小的粒子并对他们进行渲染,而且效率要远高于渲染同样数目的精灵.粒子系统可以模拟下雨.火焰.雪.爆炸.蒸气拖尾以及其他多 ...

  8. cocos2d基础入门

    HelloCpp中Classes目录下放开发者自己的类: win32:平台相关,coco2d已默认创建:coco2d-x目录下,samples/cpp/HelloCpp/(工程根目录)图片放置位置:根 ...

  9. PS教程1000例

    http://www.missyuan.com/thread-446934-1-1.html Photoshop绘制逼真头发发丝效果http://www.missyuan.com/thread-446 ...

随机推荐

  1. ●BZOJ 3238 [Ahoi2013]差异

    题链: http://www.lydsy.com/JudgeOnline/problem.php?id=3238 题解: 后缀数组套路深. 问题转化为求出任意两个后缀的LCP之和 在计算贡献时,各种不 ...

  2. bzoj 3679: 数字之积

    Description 一个数x各个数位上的数之积记为\(f(x)\) 求[L,R)中满足\(0<f(x)<=n\)的数的个数 solution 最后\(f(x)\)可以拆分成2,3,5, ...

  3. [bzoj1566][NOI2009]管道取珠

    来自FallDream的博客,未经允许,请勿转载,谢谢. n<=500 神题...... 发现这个平方可以看作两个序列相同的对数  然后就可以表示状态了. f[i][j][k]表示两个序列各选了 ...

  4. HWM、PCTFREE、PCTUSED

    什么是水线(High Water Mark)? HWM通常增长的幅度为一次5个数据块,原则上HWM只会增大,不会缩小,即使将表中的数据全部删除,HWM还是为原值,由于这个特点,使HWM很象一个水库的历 ...

  5. UDA机器学习基础—异常值-安然数据处理

    #!/usr/bin/python import pickle import sys import matplotlib.pyplot sys.path.append("../tools/& ...

  6. 【OCP|052】OCP最新题库解析(052)--小麦苗解答版

    [OCP|052]OCP最新题库解析(052)--小麦苗解答版 OCP最新题库解析历史连接(052):http://mp.weixin.qq.com/s/bUgn4-uciSndji_pUbLZfA ...

  7. python2.7入门---简介&基础语法

    Python 是一个高层次的结合了解释性.编译性.互动性和面向对象的脚本语言,具有很强的可读性,相比其他语言经常使用英文关键字,其他语言的一些标点符号,它具有比其他语言更有特色语法结构.基于上述原因, ...

  8. Mysql优化--慢查询日志

    Mysql 系列文章主页 =============== 默认没有开启慢查询日志功能.如果不是调优需要的话,一般不建议开启. 查看是否开启慢查询日志: SHOW VARIABLES LIKE '%sl ...

  9. 原生js之canvas时钟组件

    canvas一直是前端开发中不可或缺的一种用来绘制图形的标签元素,比如压缩上传的图片.比如刮刮卡.比如制作海报.图表插件等,很多人在面试的过程中也会被问到有没有接触过canvas图形绘制. 定义 ca ...

  10. Java transient关键字使用小结

      1.transient关键字只能修饰变量,而不能修饰方法和类.注意,本地变量是不能被transient关键字修饰的.2.被transient关键字修饰的变量不再能被序列化,一个静态变量不管是否被t ...