Cocos2d-x 图像渲染和动画——裁剪(ClippingNode)

Cocos2d-x 图像渲染和动画——裁剪(ClippingNode),第1张

概述概述 ClippingNode(裁剪节点)可以用来对节点进行裁剪,可以根据一个模板切割图片的节点,生成任何形状的节点显示。 ClippingNode是Node的子类,可以像普通节点一样放入Layer,Scene,Node中。 ClippingNode 常用方法 create 可以使用static ClippingNode* create();方法创建一个ClippingNode对象。如下: aut 概述

ClipPingNode(裁剪节点)可以用来对节点进行裁剪,可以根据一个模板切割图片的节点,生成任何形状的节点显示。

ClipPingNode是Node的子类,可以像普通节点一样放入Layer,Scene,Node中。

ClipPingNode 常用方法

create

可以使用static ClipPingNode* create();方法创建一个ClipPingNode对象。如下:

auto clipper = ClipPingNode::create();

也可以使用 static ClipPingNode* create(Node *stencil);方法创建;在创建的时候指定裁剪模板

auto stencil = Sprite::create("Closenormal.png");//模板节点clipper = ClipPingNode::create(stencil);

setStencil

可以使用voID setStencil(Node *stencil);方法设置“裁剪模板”节点。 如下:

clipper->setStencil(stencil);//设置裁剪模板

setInverted

可以使用voID setInverted(bool inverted);方法,设置是显示被裁剪的部分,还是显示裁剪。true 显示剩余部分。false显示被剪掉部分。 如下:

clipper->setInverted(true);//设置底板可见,显示剩余部分

setAlphaThreshold

可以使用voID setAlphaThreshold(GLfloat AlphaThreshold);,设置Alpha阈值, 只有模板(stencil)的Alpha像素大于Alpha阈值(AlphaThreshold)时内容才会被绘制。 Alpha阈值(threshold)范围应是0到1之间的浮点数。 Alpha阈值(threshold)默认为1。 如下:

clipper->setAlphaThreshold(0);//设置绘制底板的Alpha值为0
示例
auto bg = Layercolor::create(color4B(255,255,255));    this->addChild(bg,-1);//1    auto stencil = Sprite::create("Closenormal.png");    stencil->setScale(2);//2    auto clipper = ClipPingNode::create();    clipper->setStencil(stencil);//设置裁剪模板 //3    clipper->setInverted(true);//设置底板可见    clipper->setAlphaThreshold(0);//设置绘制底板的Alpha值为0    this->addChild(clipper);//4    auto content = Sprite::create("HelloWorld.png");//被裁剪的内容    clipper->addChild(content);//5    clipper->setposition(Vec2(visibleSize.wIDth/2 + origin.x,visibleSize.height/2 + origin.y));

运行效果图:

clipper->setInverted(true); 改为 clipper->setInverted(false); 运行效果如图:

资源图片:

总结

以上是内存溢出为你收集整理的Cocos2d-x 图像渲染和动画——裁剪(ClippingNode)全部内容,希望文章能够帮你解决Cocos2d-x 图像渲染和动画——裁剪(ClippingNode)所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1080836.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-27
下一篇 2022-05-27

发表评论

登录后才能评论

评论列表(0条)

保存