转自：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(50,50) ); //创建裁减节点类 CCClippingNode*clipper = this->clipper(); clipper->setTag( kTagClipperNode); clipper->setAnchorPoint(ccp(0.5,0.5)); clipper->setPosition( ccp(s.width / 2 -50, s.height/ 2 - 50) ); //为设置裁减节点类设置“裁减模板” clipper->setStencil(stencil); this->addChild(clipper); //设置裁减节点类所放的内容 CCNode*content = this->content(); content->setPosition( ccp(50,50) ); 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(200, 200) ); clipper->setAnchorPoint( ccp(0.5, 0.5) ); clipper->setPosition( ccp(this->getContentSize().width / 2, this->getContentSize().height/ 2) ); clipper->runAction(CCRepeatForever::create(CCRotateBy::create(1, 45))); this->addChild(clipper); //创建“裁减模板” CCDrawNode*stencil = CCDrawNode::create(); CCPointrectangle[4]; rectangle[0]= ccp(0, 0); rectangle[1]= ccp(clipper->getContentSize().width,0); rectangle[2]= ccp(clipper->getContentSize().width,clipper->getContentSize().height); rectangle[3]= ccp(0, clipper->getContentSize().height); //绘制一个矩形 ccColor4Fwhite = {1, 1, 1, 1}; stencil->drawPolygon(rectangle,4, white, 1, 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 / 2, clipper->getContentSize().height/ 2) ); clipper->addChild(content);
之后使用触摸控制的三个函数设置content的位置就可以了，效果如图所示：
如果说关于ScrollView是一个已经有解决方案的办法了，那么下面这个效果将更加体现这个新效果的作用，实现一个子弹打孔的效果：
void HoleDemo::setup() { //子弹击穿的图片，很多地方都用到的ABCD图 CCSprite*target = CCSprite::create(s_pPathBlock); target->setAnchorPoint(CCPointZero); target->setScale(3); //创建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(1, 45))); 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()* 360; //弹孔上的效果图片，只是作为装饰 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,1)));
效果如图所示：
