注::如果你对 FLASH 这个软件操作不够熟悉,建议你可以先看看FLASH动画之类的书。

  :FLASH CC  在文中直接简称为CC。 

  :以下所以文章中所说的快捷键 如果你按了不起作用,请检查是否有其他正在运行的软件快捷冲突。  

  :bolg中为了节约篇幅以及阅读体验,不重要的图我就不贴出来了

  :我教程里使用的是 FLASH CC  中文版 (15.0.0.173)

  :强烈建议不要装绿色精简版,因为他可能导致你的软件使用过程出现未知问题

  :速成班 请参看我另一系列教程 FLASH CC  CANVAS (x)这类标题名的文章(不推荐)

-----------------------↑↑↑↑↑↑以上的注意真的很重要哦,真的!↑↑↑↑↑↑-------------------------------

2、基本的点击事件

2.1 点击播放动画

动画中一般都会涉及到,点击xx 播放yy动画或者循环播放一段zz动画这样的需求。所以掌握基本的鼠标点击(手指)代码也是一个动画设计师的基本技能。

我们继续拿第一篇里的例子(可以直接去第一篇末尾下载)

在时间轴新增加一个层,取名为js

选中第一帧,按F9 打开代码面板,写下如下代码

这样我们的动画就会停止在这一帧。发布测试一下。

然后选中舞台上的cow,F8转换为影片剪辑,并在属性面板上命名为cow。如下:

我们再次选中js层的第一帧 F9继续写代码

发布测试,我们点击奶牛,成功播放了动画。

2.2其他的点击事件

added

click

dblclick

mousedown

mouseout

mouseover

pressmove

pressup

removed

rollout

rollover

tick

舞台 stage事件

stagemousedown

stagemousemove

stagemouseup

关于这些事件,建议大家直接去 http://www.createjs.com/#docs熟读API

如果是在移动端使用 click 会有几百毫秒的延迟,当然移动端我们一般不再使用click,而是使用touch事件,当然我们这里使用的是mousedown,pressup(当然你也可以继续使用在CC中使用touch事件,我会在后面的章节中详细说明)

但是你会发现他们无法在正确时间响应。这是需要你在test.html中添加一句代码。如下:

 createjs.Touch.enable(stage);

添加到stage=new createjs.Stage(canvas) 后面一行。如下:

当然你也可以根据你的具体需求自己决定它放在哪。

本文源码下载:

http://pan.baidu.com/s/1i3GSPTz


《FLASH CC 2015 CANVAS 中文教程》——2、基本的交互(点击、触摸)事件的更多相关文章

  1. 《FLASH CC 2015 CANVAS 中文教程》——3、this关键字 入门

    注::如果你对 FLASH 这个软件操作不够熟悉,建议你可以先看看FLASH动画之类的书. :FLASH CC 在文中直接简称为CC. :以下所以文章中所说的快捷键 如果你按了不起作用,请检查是否有其 ...

  2. 《FLASH CC 2015 CANVAS 中文教程》——1、导出canvas动画,文件结构浅析

    注::如果你对 FLASH 这个软件操作不够熟悉,建议你可以先看看FLASH动画之类的书. :FLASH CC 在文中直接简称为CC. :以下所以文章中所说的快捷键 如果你按了不起作用,请检查是否有其 ...

  3. FLASH CC 2015 CANVAS (七)总结

    FLASH CC 2015 CANVAS (一至七)确切来说是自己在摸索学习过程中而写.所以定为“开荒教程”. 去年年底转战H5,半年中一直非常忙也不敢用CC来做项目,担心有BUG或者无法实现需求,所 ...

  4. FLASH CC 2015 CANVAS (六)如何像FLASH那样实现场景(多canvas)

    注意 此系列贴 为个人边“开荒”边写,所以不保证就是最佳做法,也难免有错误! 正式教程会在后续开始更新. swf 项目中,我们可以很容易在一个fla文档里创建多场景.也可以通过多个fla文件发布多个s ...

  5. FLASH CC 2015 CANVAS (五)loading的制作

    注意 此贴 为个人边“开荒”边写,所以不保证就是最佳做法,也难免有错误! 正式教程会在后续开始更新 AS3的loading一般我们都写在时间轴第一帧,但是FLASH CC CANVAS的导出项目的lo ...

  6. FLASH CC 2015 CANVAS (四)制作响应式设计(自适应)的项目

    注意 此贴 为个人边“开荒”边写,所以不保证就是最佳做法,也难免有错误(如果发现我会更新文章)! 正式教程会在后续开始更新 相信你在看了(第二节)(第三节)之后已经能够满足绝大多数的互动需求了.那么也 ...

  7. FLASH CC 2015 CANVAS (二)html中写JS调用flash中的元件、函数、变量

    注意 此贴 为个人边“开荒”边写,所以不保证就是最佳做法,也难免有错误! 正式教程会在后续开始更新 当你导出第一个canvas后,你会在保存fla的文件夹里 (每个项目默认位置)看到 如下文件,(请先 ...

  8. FLASH CC 2015 CANVAS (三) flash中写JS调用html中JS的函数,变量

    注意 此贴 为个人边“开荒”边写,所以不保证就是最佳做法,也难免有错误! 正式教程会在后续开始更新 首先我们在HTML里的JS里面添加几行代码 我们在FLASH中新建一个元件,并拖入到舞台,在属性面板 ...

  9. FLASH CC 2015 CANVAS (一) 与AS3的写法区别

    注意 此贴 为个人边“开荒”边写,所以不保证就是最佳做法,也难免有错误! 正式教程会在后续开始更新 AS3 JS stop() this.stop(); mc.stop() this.mc.stop( ...

随机推荐

  1. ESP8266例程

    乐鑫的这个开发板, 可以用LUA来编程, 下面的例子是一个简单的web服务器, 当你用浏览器访问wifi的IP时,后面加一个http://ip/abc123, 这样就可以给wifi模组发命令了. sr ...

  2. Java编译那些事儿【转】

    转自:http://blog.csdn.net/lincyang/article/details/8553481 版权声明:本文为博主原创文章,未经博主允许不得转载. 目录(?)[-] 命令行编译 使 ...

  3. eclispse快捷操作

    1几个最重要的快捷键 代码助手:Ctrl+Space(简体中文操作系统是Alt+/)快速修正:Ctrl+1单词补全:Alt+/打开外部Java文档:Shift+F2 显示搜索对话框:Ctrl+H快速O ...

  4. 模拟namenode崩溃,使用secondarynamenode恢复

    方法一.使用namespaceID 1.在namenode节点上,将dfs.name.dir指定的目录中(这里是name目录)的内容情况,以此来模拟故障发生. [hadoop@node1 name]$ ...

  5. C#:向控件添加信息类

    using System; using System.Collections.Generic; using System.Text; using System.Windows.Forms; names ...

  6. Function对象属性和方法

    /* var pattern = /^[\w]+\.(zip|rar|gz)$/; //|选择符必须用分组符号包含起来 var str = '123.7z'; alert(pattern.test(s ...

  7. Symfony电子商务

    http://zhilihe.com/content/symfony%E7%94%B5%E5%AD%90%E5%95%86%E5%8A%A1%E9%A1%B9%E7%9B%AE%E6%80%BB%E7 ...

  8. Unity5 Standard自发光材质无效解决方法

    受光物和发光物都要勾选Static才会有效. 如果不够选静态就是用HDR光照,需要相机勾选HDR 所以如果是动态的物体真实发光,Unity依旧无法支持

  9. linux 网络通信

    网络命令 历史上最早的即时通信 1 write linzhiling (内容) ctrl+D结束 这样一封信就写出去了,注意:只有用户在线才可以发送 2 wall (write all) 给所有的用户 ...

  10. Activity和Service的生命周期(图)

    1.Activity的生命周期 情形一.一个单独的Activity的正常的生命过程是这样的:onCreate->onStart->onPause->onStop->onDest ...