二维设计与制作第六单元： 交互动画制作.pptxVIP

第六单元：交互动画制作;一、不同平台与文档、脚本 因为Animate CC可以创建跨平台的影片和应用，所以在创建文档的时候，需要选择某种文档类型，不同类型的文档使用的编辑脚本也不一样。 1. ActionScript 3.0平台与脚本 ActionScript 3.0平台是面向PC端的创作平台，在此平台下主要发布传统的SWF动画，使用FlashPlayer播放器播放。该平台使用的是ActionScript 3.0脚本。;一、不同平台与文档、脚本 2. HTML5 Canvas平台与脚本 HTML5 Canvas文档是Aniamte CC支持互联网，特别是移动互联网环境的一种文档类型。HTML5是目前非常火爆的新一代超文本标记语言，Canvas 是 HTML5 中的一个新元素，它提供了多个 API，可以动态生成及渲染图形、图表、图像及动画，因此它对创建丰富的交互性 HTML5 内容提供本地支持。这样我们可以使用传统的Animate 时间轴、工作区及工具来创建内容，然后Animate会自动通过CreateJS生成 HTML5 网页输出。;二、Animate脚本简介 1.ActionScript 3.0 ActionScript（简称AS）是Animate前身Flash所使用的脚本语言，在Animate中依然可以使用（在as3文档类型下）。它可以向应用程序添加复杂的交互性、播放控制和数据显示，其语法特点与javascript相似。 2. CreateJS脚本 CreateJS即CreateJS库，属于javascrpit库的一种，是一款主要为HTML5游戏开发的引擎。;二、Animate脚本简介 其它语言程序一样，animate的脚本包括有函数、方法、属性、事件、类和语法。 3.脚本演示：用键盘移动的气球 4.一些术语： （1）实例名称：可以给舞台上的影片剪辑和按钮命名，但图形元件不可以命名。 （2）属性：即舞台上对象的属性，如坐标位置、大小等。 （3）值 （4）变量（变量名区分大小写） （5）事件：具体发生的一个操作，如鼠标被按下、键盘被按下、剪辑被载入等。脚本由事件触发，然后影片就可以对许多事件做出反应。;二、Animate脚本简介 （6）操作符：=、、、+、-、*、/等 （7）关键字：语法中具有特殊用途的保留字词，它们不能用于变量、函数或标签名称。 （8）变量与常量 （9）括号：大括号之间的内容可能是一组操作，小括号中的内容一般是一个值。 （10）分号：语句之间用分号隔开 （11）点：一是用来表??到达指定时间轴的目标路径，二是用来分隔对象名称与其属性或要调用的方法 （12）引号：一般用来表示字符串;二、Animate脚本简介 （13）注释：用//表示单行注释，/*…….*/表示中间的内容都为注释 （14）帧标签 三、Animate动作面板介绍 ;四、使用代码片段添加AS（按键盘移动小汽球） 1.给对象添加实例名称 2.给对象添加代码片段 3.修改代码片段 4.设置变量记录移动速度 5.通过两个按钮增加或减少速度 6.通过输入框和按钮来改变速度 7.控制气球的移动范围 五、使用代码片段添加HTML5脚本 ;第六单元：交互动画制作;一、动作面板的结构 动作面板包含以下两个窗格。 左侧窗格为“脚本导航器” 右侧窗格为“脚本”窗格 ;二、代码注释 代码注释是代码中被脚本编译器忽略的部分。代码注释可解释代码的操作，让代码看上去更易理解，也可以暂时停用不想删除的代码。代码注释有两种形式，即注释行与注释块。 注释行：通过在代码行的开头加上双斜杠“//”可对其进行注释。 注释块：可以对若干行代码进行注释，在代码块的开头加上一个斜杠和一个星号“/*”，并在代码块的结尾加上一个星号和一个斜杠“*/”;二、代码注释 取消注释：将光标置于含有注释的代码行中，或者选择已注释的代码块，单击鼠标右键，在弹出的快捷菜单中选择“取消注释”，或使用快捷键Ctrl + Shift + M组合键即可取消注释所选内容。 ;三、使用动作码向导 动作码向导是Aniamte CC新增加的功能，通过使用“动作”面板中的“使用向导添加”选项，不需要手动输入代码就可以将交互功能添加到 HTML5 组件中。要注意的是只有HTML5 Canvas文档才支持动作码向导。 ;第六单元：交互动画制作;一、概念与类型 “代码片段”是Animate CC预置的一些功能代码，它允许用户直接在脚本窗口添加大量模块化的脚本代码，而不需要任何JavaScript 或 ActionScript 3.0 方面的知识，从而使得非编程人员能够轻松地为影片添加交互功能。 代码片段主要有3类，分别是ActionScript类、HTML5 Canvas类和WebGL类，对应于3种不同的文档类型，即每种文档类型只能