【2014-01-26】cocos2dx学习笔记：CCClippingNode
[历史归档]本文原发布于 cstriker1407.info 个人博客内容为历史存档仅供参考。发布时间2014-01-26 标题cocos2dx学习笔记CCClippingNode分类编程 / C C / cocos2dx 标签cocos2dx·CCClippingNodecocos2dx学习笔记CCClippingNodeCCClippingNode 使用注意事项CCClippingNode 例子CCClippingNode源码分析CCClippingNode中的Stencil节点的位置以下内容转自【 http://blog.sina.com.cn/s/blog_59b4c31c0101iom0.html 】CCClippingNode 使用注意事项最近使用了cocos2d-x 的CCClippingNode,在VC下编译可以出现效果但是在IOS上毫无效果发现网上也有人提出这个问题先把方法记下来。原帖地址http://cocos2d-x.org/boards/6/topics/20141?r20567#message-20567foriOS:in AppController replace the gl-view creation with:EAGLView*__glView[EAGLView viewWithFrame:pixelFormat:kEAGLColorFormatRGBA8 depthFormat:GL_DEPTH24_STENCIL8_OES preserveBackbuffer:NO sharegroup:nil multiSampling:NO numberOfSamples:0];forAndroid:ingame activity:publicCocos2dxGLSurfaceViewonCreateView(){Cocos2dxGLSurfaceViewglSurfaceViewnewCocos2dxGLSurfaceView(this);glSurfaceView.setEGLConfigChooser(5,6,5,0,16,8);returnglSurfaceView;}CCClippingNode 例子首先是两张图片background.png来自cocos2dx的例子资源smallcircle.png可以看到smallcircle.png中间是透明****的最外侧是透明的整个png是个正方形。代码1CCSprite*bgCCSprite::create(background.png);CCSprite*stencilACCSprite::create(smallcircle.png);CCClippingNode*clipACCClippingNode::create();clipA-setStencil(stencilA);clipA-addChild(bg);clipA-setAnchorPoint(ccp(0,0));clipA-setPosition(ccp(300,300));this-addChild(clipA);效果图加了透明度阈值判断的代码2CCSprite*bgCCSprite::create(background.png);CCSprite*stencilACCSprite::create(smallcircle.png);CCClippingNode*clipACCClippingNode::create();clipA-setStencil(stencilA);clipA-addChild(bg);clipA-setAlphaThreshold(GLfloat(0.5f));clipA-setAnchorPoint(ccp(0,0));clipA-setPosition(ccp(300,300));this-addChild(clipA);效果图设置了反转的代码3CCSprite*bgCCSprite::create(background.png);CCSprite*stencilACCSprite::create(smallcircle.png);CCClippingNode*clipACCClippingNode::create();clipA-setStencil(stencilA);clipA-addChild(bg);clipA-setAlphaThreshold(GLfloat(0.5f));clipA-setInverted(true);clipA-setAnchorPoint(ccp(0,0));clipA-setPosition(ccp(300,300));this-addChild(clipA);效果图CCClippingNode源码分析后面用到了在仔细分析吧。先贴个网址【 http://blog.csdn.net/crazyjumper/article/details/1968567 】更新【2014年5月8日11:38:06】CCClippingNode中的Stencil节点的位置首先看下CCSprite的部分代码通过这部分代码我们可以知道CCSprite在有texture的时候默认锚点和默认位置分别为【0.5,0.5】和【0,0】constCCPoint CCPointZeroCCPointMake(0,0);。。classCC_DLLCCSprite:publicCCNodeRGBA,publicCCTextureProtocol 。。classCC_DLLCCNodeRGBA:publicCCNode,publicCCRGBAProtocol 。。CCNode::CCNode(void)。。。。,m_obPosition(CCPointZero),m_obAnchorPointInPoints(CCPointZero),m_obAnchorPoint(CCPointZero)。。。。// designated initializerboolCCSprite::initWithTexture(CCTexture2D*pTexture,constCCRectrect,boolrotated){。。。// default transform anchor: centersetAnchorPoint(ccp(0.5f,0.5f));。。。}那么stencil的绘制位置是如何确定的看下CCClippingNode的部分代码voidCCClippingNode::setStencil(CCNode*pStencil){CC_SAFE_RELEASE(m_pStencil);m_pStencilpStencil;CC_SAFE_RETAIN(m_pStencil);}voidCCClippingNode::visit(){。。。。。 。。。。。// draw the stencil node as if it was one of our child// (according to the stencil test func/op and alpha (or alpha shader) test)kmGLPushMatrix();transform();m_pStencil-visit();kmGLPopMatrix();。。。。。 。。。。。}这里就很明显了Stencil在绘制时是作为CCClippingNode的子节点绘制的。我们这样看下最简单的代码CCSprite*backgroundCCSprite::create(background.jpg);CCSprite*stencilCCSprite::create(stencil.png);CCClippingNode*clipACCClippingNode::create();clipA-setStencil(stencil);clipA-addChild(background);//background的锚点(0.5,0.5),位置(0,0)//stencil的锚点(0.5,0.5),位置(0,0)这里可以知道background和stencil都是clipA的子节点而且锚点和位置都相同那么它们都会被绘制到clipA的中心位置。
