ClippingNode 实现类似子弹打穿纸片效果



auto target = Sprite::create("Images/blocks.png");

target->setAnchorPoint(Vec2::ZERO);

target->setScale(3);

_outerClipper = ClippingNode::create();

_outerClipper->retain();

AffineTransform tranform = AffineTransform::IDENTITY;

tranform = AffineTransformScale(tranform,target->getScale(),target->getScale());

_outerClipper->setContentSize(SizeApplyAffineTransform(target->getContentSize(),tranform));

_outerClipper->setAnchorPoint(Vec2(0.5,0.5));

_outerClipper->setPosition(Vec2(300,300));

_outerClipper->runAction(RepeatForever::create(RotateBy::create(1,45)));

_outerClipper->setStencil(target);

auto holesClipper = ClippingNode::create();

holesClipper->setInverted(true);

holesClipper->setAlphaThreshold(0.05f);

holesClipper->addChild(target);

_holes = Node::create();

_holes->retain();

holesClipper->addChild(_holes);

_holesStencil = Node::create();

_holesStencil->retain();

holesClipper->setStencil(_holesStencil);

_outerClipper->addChild(holesClipper);

this->addChild(_outerClipper);

auto listener = EventListenerTouchAllAtOnce::create();

listener->onTouchesBegan = CC_CALLBACK_2(HelloWorld::onTouchesBegan,this);

_eventDispatcher->addEventListenerWithSceneGraphPriority(listener,this);

void HelloWorld::onTouchesBegan(const std::vector<Touch*>& touches,Event* event){

Touch* touch = (Touch*)touches[0];

Vec2 point = _outerClipper->convertToNodeSpace(Director::getInstance()->convertToGL(touch->getLocationInView()));

auto rect = Rect(0,0,_outerClipper->getContentSize().width,_outerClipper->getContentSize().height);

if (!rect.containsPoint(point))

{

return;

}

this->pokeHoleAtPoint(point);

}

void HelloWorld::pokeHoleAtPoint(Vec2 point){

float scale = CCRANDOM_0_1()*0.2 + 0.9;

float rotation = CCRANDOM_0_1() * 360;

auto hole = Sprite::create("Images/hole_effect.png");

hole->setPosition(point);

hole->setRotation(rotation);

hole->setScale(scale);

_holes->addChild(hole);

auto holeStencil = Sprite::create("Images/hole_stencil.png");

holeStencil->setPosition(point);

holeStencil->setRotation(rotation);

holeStencil->setScale(scale);

_holesStencil->addChild(holeStencil);

_outerClipper->runAction(Sequence::createWithTwoActions(ScaleBy::create(0.05f,0.95f),ScaleTo::create(0.125f,1)));

}

时间: 2024-10-26 01:41:33

ClippingNode 实现类似子弹打穿纸片效果的相关文章

类似tabBar的切换页面效果(微信小程序)

微信小程序开发,我们经常遇到类似tabBar的页面切换效果:                  这种效果,微信小程序开发应该如何实现呢?项目源码: 页面切换-横向: 页面切换-竖向: 页面切换的需求是: 当点击任何一个标题时,选中标题的状态区别显示,页面切换到标题对应的页面:当滑动页面时,页面对应的标题呈现选中状态. 代码实现的逻辑是: 定义变量selectedTitle.标题的id.样式title-selected(当id和selectedTitle相等时).当点击任何一个标题时,将选中标题的

Android用TabLayout实现类似网易选项卡动态滑动效果

此前我们用HorizontalScrollView也实现了类似网易选项卡动态滑动效果,详见 Android选项卡动态滑动效果这篇文章 这里我们用TabLayout来实现这一效果.TabLayout是Android Design Support Library库中的控件. Google在2015的IO大会上,给我们带来了更加详细的Material Design设计规范,同时,也给我们带来了全新的Android Design Support Library,在这个support库里面,Google给

基于Qt的类似QQ好友列表抽屉效果的实现

前段时间在忙毕业设计,所以一直没有更新博客.今天答辩完以后,将对我的毕业设计进行模块展示,供Qt初学者进行参考. 毕业设计题目:Linux系统下基于Qt的局域网即时通信系统设计与实现 其中我有一个类似于QQ的好友列表,然后对好友可以进行分组管理,毕设中具体效果图如下: 网上查寻到的设计思路: 1.采用QToolBox的方式,虽然看起来有点样子,但是并不是我们所熟悉的好友列表,比如:http://blog.csdn.net/qianguozheng/article/details/6719074

WPF触控程序开发(三)——类似IPhone相册的反弹效果

用过IPhone的都知道,IPhone相册里,当图片放大到一定程度后,手指一放,会自动缩回,移动图片超出边框后手指一放,图片也会自动缩回,整个过程非常和谐.自然.精确,那么WPF能否做到呢,答案是肯定的. 在没有现成的控件的情况下,只有自己做,你肯定想到做动画,WPF触屏开发提供了相应的功能来获取触控点的一些变化,这些变化的最佳消费者个人认为是Matrix.我们回想下做动画一般怎么做,比如给一个button做个宽度增5的动画,我们一般是定义一个DoubleAnimation,然后定义一个Sotr

写一个android带动画效果的TabHost(类似微博客户端的切换效果)

先上图: 这个Layout是: <?xml version="1.0" encoding="UTF-8"?> <TabHost xmlns:android="http://schemas.android.com/apk/res/android" android:id="@android:id/tabhost" android:layout_width="fill_parent" andro

【UI技术分享】如何做出纸片效果文字

哈喽!大家好,今天教大家做纸片效果的文字,我们先看一下成品图 这样的文字效果有一种轻盈感,加上光影,变得特别立体!非常适合做海报.广告等标题哦!好了,接下来,就跟着一起来做一下纸片效果的文字设计吧! 打开PS以后,我们新建一个蓝色的图层,作为背景底色 打上'学UI到源码时代'几个字,我们这里用的字体是造字工房力黑,注意:这个字体不能作为商用哦! 注意:打这几个字的时候,要分成两行打,因为待会儿我们要对它们分别做一下变化! 我们选中'学UI'图层,右键将其转换为形状,然后Ctrl+t,进入变换命令

cocos2d-x3.1 下实现类似Android下ExpandListView的效果

在左Android开始有SDK提供ExpandListView的可扩展列表,而在iOS下有许多第三方做好的Demo,这里我是参照iOS下RATreeView这个第三方库实现的. 本文代码:需要在3.1以上版本运行.如果是用3.0版本需要将Vec2换成Piont 原文地址:http://blog.csdn.net/qqmcy/article/details/29559241 代码下载:http://download.csdn.net/detail/qqmcy/7469387 下面说下使用方法: D

Android抽屉(SlidingDrawer --类似android通知栏下拉效果)

Android抽屉(SlidingDrawer)的实现发 - 红黑联盟http://www.2cto.com/kf/201301/182507.html 可动态布局的Android抽屉之基础http://blog.csdn.net/hellogv/article/details/6789698 android抽屉实现http://blog.csdn.net/wangkuifeng0118/article/details/7229200 Android 使用动画效果后的控件位置处理 类似系统通知栏

文档显示部件类似套打显示构建效果

度量快速开发平台的文档显示部件,是结合到html与平台数据交互显示的好部件,如果html编辑和美工功底较好,可以设置出非常好的模板,并进行显示.比如类似套打报表这种,有一个估计打印的模板,然后里面的内容不同,我们只需要在模板中设置好图片,可以作为背景图片,也可以设置不同的层与书签显示数据,形成效果很好的套打查看效果.下图是显示效果,数字部分可以通过html来很好的对应即可. 原文地址:http://bbs.delit.cn/thread-534-1-1.html 转载请注明出处: 撰写人:度量科