ClippingNode说明
cocos2dx中ClippingNode(裁剪节点)可以用来对节点进行裁剪。ClippingNode是Node的子类,可以像普通节点一样放入Layer,Scene,Node中。主要是根据一个模板(Stencil)切割图片的节点。
主要有两个部分:模板(stencil),底板。设置方法如下:
clippingNode->setStencil(stencil); //设置模板Stencil
clippingNode->addChild(content); //设置底板
两个主要函数的介绍
setInverted()
clippingNode->setInverted(false);
//默认值为false: 表示显示被裁剪下来的底板内容。
//如果设为true: 表示显示剩余部分。
默认状态下,也就是setInverted(false)时,可以想象成将底板的内容从模板下往上拉,被模板挡住的底板内容是要显示的。
而将setInverted()设为true时,底板内容没有被模板挡住的是要显示的。
有一点需要注意的是最后裁剪的内容是底板中的内容,而不是模板中的内容。
setAlphaThreshold()
此函数是用来确定模板中有哪些内容是需要绘制的。
只有模板中像素的alpha值大于所设置的alpha阈值时,内容才会被绘制。
默认为1,表示alpha测试默认关闭,即全部绘制。
若不是1,表示只绘制模板中,alpha像素大于所设置的alpha阈值(alphaThreshold)的内容。
alpha阈值(alphaThreshold):取值范围[0,1]。
实例如下:
//设置alpha透明度闸值。即显示模板中,alpha像素大于0.05的内容
clippingNode->setAlphaThreshold(0.05f);
一般模板空白区域的像素值是0,所以这里设置的值只要大于0,就能将模板中的有图案部分显示。
注意一下几点:
- 当节点设置为模板时是看不见的。
- ClippingNode显示的是底板被裁剪过后的内容。模板不能使用Button来设置。
完整实例
auto stencil = Sprite::create("2.png");
ClippingNode* clipNode = ClippingNode::create(stencil); //设置模板
clipNode->setPosition(Vec2(300,300));
clipNode->setInverted(false);
clipNode->setAlphaThreshold(0.1);
auto st = Sprite::create("HelloWorld.png");
clipNode->addChild(st); //设置底板
addChild(clipNode);
模板显示如下:
底板内容如下:
上面的代码不做改动如下显示:
可以看到,只有被模板挡住的底板内容才会被显示。
现在修改代码,将setInverted()设为true。效果如下显示:
可以看到,没有被模板挡住的底板内容会被显示。
现在将上面的修改恢复,将 clipNode->setAlphaThreshold(0.1);注释,会看到如下效果:
上面已经说明过了,setAlphaThreshold()是确定模板中有哪些内容是需要绘制的。
当不设置的是,表示全部绘制,因此模板的所有内容都被用来当作遮挡。
当设置的值大于x,模板中的内容大于x的都会被绘制。因为模板中空白部分的alpha值都是0,所以setAlphaThreshold()设置的值只要大于0,空白部分就不会被绘制用来作为模板。