效果 : 消除字母 当前位置出现爆炸效果 这里使用到了AnimatedSprite 动画 

Members

An AnimatedSprite is a simple way to display an animation depicted by a list of textures.
let alienImages = ["image_sequence_01.png","image_sequence_02.png","image_sequence_03.png","image_sequence_04.png"];
let textureArray = []; for (let i=0; i < 4; i++)
{
let texture = PIXI.Texture.fromImage(alienImages[i]);
textureArray.push(texture);
}; let mc = new PIXI.AnimatedSprite(textureArray);

mc 对象加载了图片序列。

1、alpha 

图片透明度(0 - 1)

2、anchor 

   The anchor sets the origin point of the texture. The default is 0,0 this means the texture's origin is the top left Setting the anchor to 0.5,0.5 means the texture's origin is centered Setting the anchor to 1,1 would mean the texture's origin point will be the bottom right corner

3、animationSpeed

默认值:1

4、buttonMode

If enabled, the mouse cursor use the pointer behavior when hovered over the displayObject if it is interactive Setting this changes the 'cursor' property to 'pointer'.

const sprite = new PIXI.Sprite(texture);
sprite.interactive = true;
sprite.buttonMode = true;

5、loop

Whether or not the animate sprite repeats after playing.

Default Value: true

6、onComplete  函数

Function to call when a AnimatedSprite finishes playing

 7、onFrameChange

Function to call when a AnimatedSprite changes which texture is being rendered

8、destroy 

Stops the AnimatedSprite and destroys it

9、gotoAndPlay

Goes to a specific frame and begins playing the AnimatedSprite

10、gotoAndStop

Stops the AnimatedSprite and goes to a specific frame

11、play

Plays the AnimatedSprite

12、stop

Stops the AnimatedSprite

更多查看

 ----------------------------------------------示例介绍-------------------------------------------------

1、字母下落获取坐标位置

2、字母消除位置,指定爆炸动画,执行完成调用    onComplete  对该动画销毁或隐藏操作。

 

PIXI AnimatedSprite 及打字爆炸动画(5)的更多相关文章

  1. 基于HTML5 SVG炫酷文字爆炸特效

    这是一款使用html5 svg.css3和js制作的炫酷文字爆炸特效.该文字特效用SVG path属性将文字路径切割为很多小块,然后使用css3和js在鼠标滑过文字时制作文字爆炸分裂的炫酷效果. 在线 ...

  2. [一位菜鸟的COCOS-2D编程之路]打飞机中机种敌机和战机损毁时的爆炸效果

    1.第一步,添加爆炸动画 //添加玩家飞机飞行动画 id _playerFlyAction; id _playerBlowupAnimation; //战机爆炸动画 id _enemyBlowupAn ...

  3. Android制作粒子爆炸特效

    简介 最近在闲逛的时候,发现了一款粒子爆炸特效的控件,觉得比较有意思,效果也不错. 但是代码不好扩展,也就是说如果要提供不同的爆炸效果,需要修改的地方比较多.于是我对源代码进行了一些重构,将爆炸流程和 ...

  4. 11个超震撼的HTML5和纯CSS3动画源码

    1.jQuery多功能手风琴个人信息菜单面板 这是一款基于jQuery的手风琴个人信息菜单面板,每一个菜单项展开后可以自定义布局,因此可以为每一个菜单项实现多功能.类似这样的多功能菜单还有jQuery ...

  5. 10款基于jquery的web前端动画特效

    1.jQuery横向手风琴图片切换动画 之前我们为大家分享过很多款基于jQuery和CSS3的手风琴菜单和手风琴焦点图插件,比如CSS3响应式垂直手风琴菜单和jQuery横向手风琴图片展示插件.今天要 ...

  6. 16个富有创意的HTML5 Canvas动画特效集合

    HTML5技术正在不断的发展和更新,越来越多的开发者也正在加入HTML5阵营,甚至在移动开发上HTML5的地位也是越来越重要了.HTML5中的大部分动画都是通过Canvas实现,因为Canvas就像一 ...

  7. 16个非常有趣的HTML5 Canvas动画特效集合

    HTML5技术正在不断的发展和更新,越来越多的开发者也正在加入HTML5阵营,甚至在移动开发上HTML5的地位也是越来越重要了.HTML5中的大部分动画都是通过Canvas实现,因为Canvas就像一 ...

  8. 游戏编程算法与技巧 Game Programming Algorithms and Techniques (Sanjay Madhav 著)

    http://gamealgorithms.net 第1章 游戏编程概述 (已看) 第2章 2D图形 (已看) 第3章 游戏中的线性代数 (已看) 第4章 3D图形 (已看) 第5章 游戏输入 (已看 ...

  9. 太阳系Demo(openGL)

    这个是8年前写的demo,提交的一份作业,按照提出的需求点,以最快和最简单的方式完成功能,因此代码比较简单. 1)截图 2) 功能点描述: 1.公转,自传 2.基础的摄像机运动 3.正视和顶视 4.天 ...

随机推荐

  1. C++函数后面加throw关键字简记

    看代码时候看到fun() throw()的用法,找到一篇blog解释很简单,如下: C++函数后面加关键字throw(something)限制,是对这个函数的异常安全性作出限制. 举例及解释如下: v ...

  2. EBS取Web字段SQL操作文档

    1)  安全性—>责任-à定义 在这个路径下,输入责任名称,可以查询这个责任的请求组的名称 2)  organization_id 和 org_id的功能 3)  查找网页上的字段 Naviga ...

  3. Jquery queue实例

    $(function () { var queueList = [ function () { $("div").animate({ height: 80, top: 40 }, ...

  4. 【C#】特性标签中的属性解释

    第一个为特性作用于类,或者接口(interface) 第二个为是否允许重叠定义,就是连续写两个特性标签 第三个为是否继承,当继承时候,除输出子类外,父类也将输出

  5. 「BZOJ1000」A+B Problem

    写这个主要是为了凑\(BZOJ\)题解用的,不用在意.跳过即可 \(Code\) #include<bits/stdc++.h> using namespace std; int main ...

  6. Struts2学习第3天--OGNL、EL、值栈

    JAVA中的OGNL: 1 调用对象的方法: 2 访问对象的静态方法: 3 获取OGNLContext.Root中的数据. User: 4 访问Context: 关键还是在Struts2环境中的使用: ...

  7. python中局部变量和全局变量

    局部变量,就是在函数内部定义的变量 不同的函数,可以定义相同的名字的局部变量,但是各用个的不会产生影响 局部变量的作用,为了临时保存数据需要在函数 在函数外边定义的变量叫做全局变量 全局变量能够在所有 ...

  8. zookeeper安装和使用 windows

    的 Zookeeper 是以 3.4.5 这个稳定版本为基础,最新的版本可以通过官网 http://hadoop.apache.org/zookeeper/来获取,Zookeeper 的安装非常简单, ...

  9. SHELL编程之条件测试

    条件测试 (一)概念:对特定的条件进行判断,以决定如何执行操作,当条件成立时,测试语句的返回值为0,否则为其他数值,意思就是如果 echo $? 的值是0,那么条件成立.条件测试的分类:文件测试.整数 ...

  10. Python之路Python作用域、匿名函数、函数式编程、map函数、filter函数、reduce函数

    Python之路Python作用域.匿名函数.函数式编程.map函数.filter函数.reduce函数 一.作用域 return 可以返回任意值例子 def test1(): print(" ...