转自:http://blog.csdn.net/bill_man/article/details/8498424

  可以根据一个模板切割图片的节点--CCClippingNode。这个类提供了一种不规则切割图片的方式,在这种方式以前,我们可以使用纹理类自带的setTextureRect函数来切割矩形区域,而新特性中提供的CCClippingNode最大的不同之处就是裁减将不仅仅局限于矩形,可以根据任何形状进行裁减,而你要做的只是给一个“裁减模板”,首先来看这个类的常用函数(需要说明的是,这里介绍的函数只是这个类独有的,这个类继承自CCNode节点类,因此节点类有的函数也就不做介绍了):

getStencil:返回一个节点对象,这个对象就是之前提到的“裁减模板”。

setStencil:设置“裁减模板”。

getAlphaThreshold::这种裁减是可以改变裁减的透明度的,修改这个透明度就是通过设置这个阈值。

setAlphaThreshold:获得这个透明度阈值。

isInverted:之前说过的剪刀剪形状的例子,剪完形状以后,是显示被剪掉的部分,还是显示剩余的部分呢,默认isInverted值是false,是显示被剪掉的部分,设置为true则是显示剩余的部分。这个函数获得这个值。

setInverted:设置isInverted值。

使用这个效果,一般的过程是这样的:

//创建“裁减模板”
CCNode* stencil = this->stencil();
stencil->setTag( kTagStencilNode);
stencil->setPosition( ccp(,) );
//创建裁减节点类
CCClippingNode*clipper = this->clipper();
clipper->setTag( kTagClipperNode);
clipper->setAnchorPoint(ccp(0.5,0.5));
clipper->setPosition( ccp(s.width / -, s.height/ - ) );
//为设置裁减节点类设置“裁减模板”
clipper->setStencil(stencil);
this->addChild(clipper);
//设置裁减节点类所放的内容
CCNode*content = this->content();
content->setPosition( ccp(,) );
clipper->addChild(content);

  通过这个新特性可以实现出很多有意思的效果,首先来学习一下cocos2D-x中的testApp的使用实例首先是一个类似ScrollView的滚动效果,在这之前,介绍cocos2D-x的另一个新特性—CCDrawNode,这个类不是一个新的功能,而是对原来功能的封装,在这之前,如果我们需要绘制矩形,圆形,点等形状,需要重新写一个类继承自节点或布景层,然后重写draw函数,现在使用CCDrawNode,可以直接使用这个类来绘制相应图形,相关函数如下所示:

drawDot:绘制点,参数给出坐标位置。
drawSegment:绘制片断,给出起始点,结束点,半径等参数。
drawPolygon:绘制矩形,可以分别给出填充颜色和边框颜色,还可以设置边框宽度。
实现类似ScrollView的滚动效果的代码如下:
//创建裁减节点类
CCClippingNode *clipper= CCClippingNode::create();
clipper->setTag( kTagClipperNode);
clipper->setContentSize( CCSizeMake(, ) );
clipper->setAnchorPoint( ccp(0.5, 0.5) );
clipper->setPosition( ccp(this->getContentSize().width / , this->getContentSize().height/ ) );
clipper->runAction(CCRepeatForever::create(CCRotateBy::create(, )));
this->addChild(clipper);
//创建“裁减模板”
CCDrawNode*stencil = CCDrawNode::create();
CCPointrectangle[];
rectangle[]= ccp(, );
rectangle[]= ccp(clipper->getContentSize().width,);
rectangle[]= ccp(clipper->getContentSize().width,clipper->getContentSize().height);
rectangle[]= ccp(, clipper->getContentSize().height);
//绘制一个矩形
ccColor4Fwhite = {, , , };
stencil->drawPolygon(rectangle,, white, , white);
//为设置裁减节点类设置“裁减模板”
clipper->setStencil(stencil);
//设置裁减节点类所放的内容
CCSprite*content = CCSprite::create(s_back2);
content->setTag( kTagContentNode);
content->setAnchorPoint( ccp(0.5, 0.5) );
content->setPosition( ccp(clipper->getContentSize().width / , clipper->getContentSize().height/ ) );
clipper->addChild(content);

之后使用触摸控制的三个函数设置content的位置就可以了,效果如图所示:

如果说关于ScrollView是一个已经有解决方案的办法了,那么下面这个效果将更加体现这个新效果的作用,实现一个子弹打孔的效果:

void HoleDemo::setup()
{
//子弹击穿的图片,很多地方都用到的ABCD图
CCSprite*target = CCSprite::create(s_pPathBlock);
target->setAnchorPoint(CCPointZero);
target->setScale();
//创建CCClippingNode,这个CCClippingNode并不是负责切割弹孔的,负责切割出“ABCD图”的
m_pOuterClipper= CCClippingNode::create();
m_pOuterClipper->retain();
CCAffineTransformtranform = CCAffineTransformMakeIdentity();
tranform= CCAffineTransformScale(tranform, target->getScale(), target->getScale()); m_pOuterClipper->setContentSize( CCSizeApplyAffineTransform(target->getContentSize(),tranform));
m_pOuterClipper->setAnchorPoint( ccp(0.5,0.5) );
m_pOuterClipper->setPosition( ccpMult(ccpFromSize(this->getContentSize()), 0.5f) );
m_pOuterClipper->runAction(CCRepeatForever::create(CCRotateBy::create(, ))); m_pOuterClipper->setStencil( target);
//负责弹孔切割的CCClippingNode
CCClippingNode *holesClipper= CCClippingNode::create();
//显示切割后剩余部分
holesClipper->setInverted(true);
//设置alpha阈值
holesClipper->setAlphaThreshold( 0.05f );
holesClipper->addChild(target);
//弹孔层,所有弹孔都在这个节点中
m_pHoles= CCNode::create();
m_pHoles->retain(); holesClipper->addChild(m_pHoles);
//负责切割弹孔的“裁减模板”
m_pHolesStencil= CCNode::create();
m_pHolesStencil->retain();
holesClipper->setStencil( m_pHolesStencil); m_pOuterClipper->addChild(holesClipper); this->addChild(m_pOuterClipper); this->setTouchEnabled(true);
}

点击某一点后,该点出现击穿效果:

//大小旋转随机
float scale= CCRANDOM_0_1() * 0.2 + 0.9;
floatrotation = CCRANDOM_0_1()* ;
//弹孔上的效果图片,只是作为装饰
CCSprite*hole = CCSprite::create("Images/hole_effect.png");
hole->setPosition( point);
hole->setRotation( rotation);
hole->setScale( scale); m_pHoles->addChild(hole);
//真正的弹孔切割
CCSprite*holeStencil = CCSprite::create("Images/hole_stencil.png");
holeStencil->setPosition( point);
holeStencil->setRotation( rotation);
holeStencil->setScale( scale); m_pHolesStencil->addChild(holeStencil);
//被“击打”的“abcd图”缩放一下,效果更真实
m_pOuterClipper->runAction(CCSequence::createWithTwoActions(CCScaleBy::create(0.05f,0.95f),CCScaleTo::create(0.125f,)));

效果如图所示:

cocos2d-x ClippingNode的更多相关文章

  1. cocos2d js ClippingNode 制作标题闪亮特效

    1.效果图: 之前在<Android 高仿 IOS7 IPhone 解锁 Slide To Unlock>中制作了文字上闪亮移动的效果,这次我们来看下怎样在cocos2d js 中做出类似 ...

  2. cocos2dx 2.x 在ios8下clippingNode不起作用 解决办法

    升级xcode到6.1后,跑以前的cocos2dx 2.x写的项目,发现clippingNode失效了. 后来看到这个帖子,解决了我的问题:http://discuss.cocos2d-x.org/t ...

  3. cocos2d-x截图功能clippingnode它也可用于——白费

    许多其他精彩分享:http://blog.csdn.net/u010229677 3.1版本号: 在Director数: bool Director::saveScreenshot(const std ...

  4. 小尝试一下 cocos2d

    好奇 cocos2d 到底是怎样一个框架,正好有个项目需要一个游戏框架,所以稍微了解了一下.小结一下了解到的情况. 基本概念 首先呢,因为 cocos2d 是基于 pyglet 做的,你完全可以直接用 ...

  5. 采用cocos2d-x lua 制作数字滚动效果样例

    require "Cocos2d"require "Cocos2dConstants"local testscene = class("testsce ...

  6. Cocos2d 利用继承Draw方法制作可显示三维数据(宠物三维等)的三角形显示面板

    很久没有写博客了,这段时间比较忙,又是搬家又是做自己的项目,还有太多琐碎的事情缠身,好不容易抽出时间把最近自己做的一些简单例子记录一下. 在我的项目中,我需要一个显示面板来显示游戏中的一个三维数据,例 ...

  7. iPhone开发与cocos2d 经验谈

    转CSDN jilongliang : 首先,对于一个完全没有mac开发经验,甚至从没摸过苹果系统的开发人员来说,首先就是要熟悉apple的那一套开发框架(含开发环境IDE.开发框架uikit,还有开 ...

  8. cocos2d学习记录

    视频 - http://www.manew.com/forum-105-3.html一个论坛帖 - http://www.zhihu.com/question/21114802官网 - http:// ...

  9. Android下Cocos2d创建HelloWorld工程

    最近在搭建Cocos2d的环境,结果各种问题,两人弄了一天才能搞好一个环境-! -_-!! 避免大家也可能会遇到我这种情况,所以写一个随笔,让大家也了解下如何搭建吧- 1.环境安装准备 下载 tadp ...

  10. 学生信息管理系统(cocos2d引擎)——数据结构课程设计

    老师手把手教了两天半,看了一下模式,加了几个功能就大功告成了!!! 给我的感想就是全都是指针! 添加图片精灵: CCSprite*  spBG = CCSprite::create("&qu ...

随机推荐

  1. VS2005下开发PPC2003和WM50编译器一些设置

    1.vs2005开发WM5时,编译器和linker的选项配合问题 链接:http://www.mivi.name/blog/index_en.php?itemid=258 首先说ARM4 ARM4T ...

  2. Red hat Linux(Centos 5/6)安装R语言

    Red hat Linux(Centos 5/6)安装R语言1 wget http://cran.rstudio.com/src/base/R-3/R-3.0.2.tar.gz2 tar xzvf R ...

  3. The Impact of Garbage Collection on Application Performance

    As we’ve seen, the performance of the garbage collector is not determined by the number of dead obje ...

  4. POJ (线段相交 最短路) The Doors

    题意: 一个正方形中有n道竖直的墙,每道墙上开两个门.求从左边中点走到右边中点的最短距离. 分析: 以起点终点和每个门的两个端点建图,如果两个点可以直接相连(即不会被墙挡住),则权值为两点间的欧几里得 ...

  5. bzoj3940: [Usaco2015 Feb]Censoring

    AC自动机.为什么洛谷水题赛会出现这种题然而并不会那么题意就不说啦 .终于会写AC自动机判断是否是子串啦...用到kmp的就可以用AC自动机水过去啦 #include<cstdio> #i ...

  6. BZOJ3451: Tyvj1953 Normal

    题解: 好神的一道题.蒟蒻只能膜拜题解. 考虑a对b的贡献,如果a是a-b路径上第一个删除的点,那么给b贡献1. 所以转化之后就是求sigma(1/dist(i,j)),orz!!! 如果不是分母的话 ...

  7. poj 2185 (KMP)

    完全不会啊…… 附一份题解:http://blog.sina.com.cn/s/blog_69c3f0410100tyjl.html var i,j,k,r,c,x:longint; ch:..,.. ...

  8. 【Struts】strust.xml中<result type="">所有类型详解

    在默认时,<result>标签的type属性值是“dispatcher”(实际上就是转发,forward).开发人员可以根据自己的需要指定不同的类型,如redirect.stream等.如 ...

  9. Android学习系列(23)--App主界面实现

    在上篇文章<Android学习系列(22)--App主界面比较>中我们浅略的分析了几个主界面布局,选了一个最大众化的经典布局.今天我们就这个经典布局,用代码具体的实现它. 1.预览图先看下 ...

  10. [转]MVC之 过滤器(Filter)

    一.自定义Filter 自定义Filter需要继承ActionFilterAttribute抽象类,重写其中需要的方法,来看下ActionFilterAttribute类的方法签名.   //表示所有 ...