Cocos2d-x-v3中3D网格特效动画的应用

Cocos2d-x-v3中3D网格特效动画的应用

一、网格特效的使用原理

        基础的动作是对节点整体进行移动,变形等操作,网格特效的原理是将节点分割成多个尺寸相同的网格,根据改变每个网格块的属性使整体节点产生3D的效果。

二、网格特效的基本用法

      在cocos2d-x中,v3的版本新引入了一个类NodeGrid,专门用来包装网格的特效,示例如下:

?


1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

    //获取屏幕尺寸

    Size visibleSize = Director::getInstance()->getVisibleSize();

    Vec2 origin = Director::getInstance()->getVisibleOrigin();

    //加载精灵

    auto sprite = Sprite::create("HelloWorld.png");

    sprite->setPosition(Vec2(visibleSize.width/2+origin.x, visibleSize.height/2+origin.y));

    //创建网格特效包装类

    NodeGrid * nodeg = NodeGrid::create();

    nodeg->setPosition(Vec2::ZERO);

    //添加播放特效的精灵

    nodeg->addChild(sprite);

    this->addChild(nodeg);

    //参数的含义 分别是 执行时间,切分的网格大小,波浪次数,波浪大小

    Waves3D * ani3d = Waves3D::create(2, Size(15, 15), 6, 4);

    //执行特效

    nodeg->runAction(ani3d);

三、系统提供的网格特效

static Waves3D* create(float duration, const Size& gridSize, unsigned int waves, float amplitude);

创建波浪3D效果,参数含义为:执行时间,网格尺寸,波浪次数,波浪大小

static FlipX3D* create(float duration);

以x为轴进行翻转

static FlipY3D* create(float duration);

以y为轴进行翻转

static Lens3D* create(float duration, const Size& gridSize, const Vec2& position, float radius);

创建镜头的3D效果,参数为:执行时间,网格大小,镜头中心,镜头半径

static Ripple3D* create(float duration, const Size& gridSize, const Vec2& position, float radius, unsigned int waves, float amplitude);

创建波纹特效,参数为:执行时间,网格大小,波纹中心,波纹半径,波纹计数,振幅

static Shaky3D* create(float initWithDuration, const Size& gridSize, int range, bool shakeZ);

创建震动特效,参数为:执行时间,网格大小,震动范围,是否波动z轴

static Liquid* create(float duration, const Size& gridSize, unsigned int waves, float amplitude);

创建液体特效,参数为:执行时间,网格尺寸,流动次数,幅度

static Waves* create(float duration, const Size& gridSize, unsigned int waves, float amplitude, bool horizontal, bool vertical);

创建平面波纹特效,参数为:执行时间,网格尺寸,波纹次数,波纹振幅,开关横向波纹,开关纵向波纹

 static Twirl* create(float duration, const Size& gridSize, Vec2 position, unsigned int twirls, float amplitude);
创建扭曲旋转的特效,参数为:执行时间,网格尺寸,扭曲旋转中心,旋转次数,旋转幅度

时间: 2024-12-08 15:49:41

Cocos2d-x-v3中3D网格特效动画的应用的相关文章

用Flash模拟制作简单的3D视觉特效

特效 用Flash简单模拟制作一个旋转的3D效果的指环特效动画,新手入门教程,高手就别看了! 先看效果: 点击这里下载源文件 本教程不涉及Action Script,适合新手入门的一个教程. 新建立一个Flash文档,然后按Ctrl+J调整文档属性. 然后建立一个影片剪辑元件,在影片剪辑中绘制一个圆的图形. 然后放到舞台合适的位置,选择第15帧插入关键帧.然后水平翻转该元件.并且在1到15帧之间创建运动动画.然后选择1到15帧,然后右击复制帧. 然后创建一个图层,粘贴帧就可以了!然后使用鼠标选择

用Fireworks制作3D网格

教程难易级别:初级 重点工具及命令:Edit Grid.Rectangel.Delete point 说明:打开网格功能绘制多个间距相差一个网格的矩形,然后删除矩形的同一个顶点后,就能出现类似于3D网格效果的图案,效果出来后您可以给它填充上各种渐变色,应用一些实时特效,使之改头换面,变成另外一个样子-- 图1 具体制作方法 使用过Freehand的朋友可能都知道,在Freehand中有个现成的3D网格工具,您可以使用它来创建三维对象的排列效果.虽然Fireworks中没有这个工具,但是您可以自己

Cocos2d-x Lua中实例:特效演示

下面我们通过一个实例介绍几个特效的使用,这个实例如下图所示,上图是一个操作菜单场景,选择菜单可以进入到下图动作场景,在下图动作场景中点击Go按钮可以执行我们选择的特性动作,点击Back按钮可以返回到菜单场景. 特效实例我们重点看看MyActionScene场景,MyActionScene.lua主要代码如下: - - local sprite ① local gridNodeTarget ② - - function MyActionScene:createLayer() cclog("MyAc

2.CCGridAction(3D效果),3D反转特效,凸透镜特效,液体特效,3D翻页特效,水波纹特效,3D晃动的特效,扭曲旋转特效,波动特效,3D波动特效

 1 类图组织 2 实例 CCSprite * spr = CCSprite::create("HelloWorld.png"); spr->setPosition(ccp(winSize.width/2,winSize.height/2)); addChild(spr);   //GridAction //CCFlipX3D * action = CCFlipX3D::create(2); //CCFlipY3D * action = CCFlipY3D::create(2

Flash特效动画制作:飞舞的螺炫

特效 今天和广大的FLASH制作爱好者共享是一种特炫的螺旋动画效果,让我们先来看一下最终的效果吧!  点击这里下载源文件 下面让我们一起来学习这个Flash螺旋特效动画的做法. 第一步:首先打开FLASH软件,新建一个新的场景,然后点菜单栏"修改"→"文档属性",将其背景色设为黑色(如下图),点击确定. 第二步:按一下Ctrl+F8,新建一个元件,名称为Symbol 2,行为为图像,点击确定. 第三步:用线条工具画一条垂直的直线,将直线的属性设为(如图). 第四步:

Flash飞舞的螺炫特效动画制作

  下面让我们一起来学习这个Flash螺旋特效动画的做法. 第一步:首先打开FLASH软件,新建一个新的场景,然后点菜单栏"修改"→"文档属性",将其背景色设为黑色(如下图),点击确定. 第二步:按一下Ctrl+F8,新建一个元件,名称为Symbol 2,行为为图像,点击确定. 第三步:用线条工具画一条垂直的直线,将直线的属性设为(如图). 第四步:回到场景,按一下Ctrl+F8,新建一个影片剪辑,名称为line,行为为影片剪辑,点击确实.将Symbol 2从库面板

Fireworks教程:3D旋转gif动画

  本教程介绍使用Fireworks制作可爱的四叶草旋转gif动画效果,教程主要讲解了运用运动痕迹滤镜模拟3D效果来完成最终效果,如果你有兴趣就动手做做看咯. 看了"小可爱"转的用fireworks插件制作3D的gif动画,实在强大. 介绍这个插件的文章有差不多这样一句话:按下"导出"按钮,可能有类似死机现象,但是只要耐心等待,总会输出gif. 晕,我家里的机是N年前的老牌货,看来要另想办法了. 乱碰乱撞之下,意想不到的事情发生了----- 效果图 Png图 1.

jquery实现的3D旋转木马特效代码分享_jquery

本文实例讲述了jquery实现的3D旋转木马特效.分享给大家供大家参考.具体如下: 这是一款基于jquery实现的3D旋转木马特效代码,适合用于产品展示,便于用户循环浏览产品细节,是一款非常实用的特效代码. 运行效果图:----------------------查看效果 下载源码----------------------- 小提示:浏览器中如果不能正常运行,可以尝试切换浏览模式. 为大家分享的jquery实现的3D旋转木马特效代码如下 <head> <meta http-equiv=

Flash制作飞舞的螺炫特效动画教程

给各位Flash软件的使用者们来详细的解析分享一下制作飞舞的螺炫特效动画的教程. 教程分享: 第一步:首先打开FLASH软件,新建一个新的场景,然后点菜单栏"修改"→"文档属性",将其背景色设为黑色(如下图),点击确定.   第二步:按一下Ctrl+F8,新建一个元件,名称为Symbol 2,行为为图像,点击确定.   第三步:用线条工具画一条垂直的直线,将直线的属性设为(如图).   第四步:回到场景,按一下Ctrl+F8,新建一个影片剪辑,名称为line,行为为