第七章 制作交互动画

1、1 程序设计篇 FlashMX2004网页动画 南京理工大学南京理工大学 张微张微 2 第七章第七章 交互动画基础交互动画基础 FlashMX2004网页动画 前一页 下一页 休息 3 本章主要内容本章主要内容 l交互动画与交互动画与Action编程编程 l动作面板动作面板 l基本互动事件基本互动事件 l基本流向控制基本流向控制 前一页 下一页 休息 4 lFlash最大特点是交互性，可与用户进行最大特点是交互性，可与用户进行 交流。交流。 l常用交互效果：常用交互效果： 用鼠标或键盘控制动画：如播、停，显示效用鼠标或键盘控制动画：如播、停，显示效 果，尺寸及用鼠标移动对象等。果，尺寸及用鼠标

2、移动对象等。 表单动画：让用户填写表单，反馈信息或使表单动画：让用户填写表单，反馈信息或使 用搜索引擎搜索信息等。用搜索引擎搜索信息等。 l交互式动画可以使动画严格按设计者的交互式动画可以使动画严格按设计者的 意图播放，通过简单的程序设计即可实意图播放，通过简单的程序设计即可实 现精彩的动画效果现精彩的动画效果 交互动画与交互动画与Action编程编程 动画交互 前一页 下一页 休息 5 交互动画与交互动画与Action编程编程 l交互式动画设计通过使用交互式动画设计通过使用ActionScript 程序语言编程实现程序语言编程实现 lActionScript语言特点语言特点 起源于起源于Ja

3、va语言。语言。 并非独立编程语言，并非独立编程语言， ActionScript只包只包 含一组简单的指令，可方便地定义事件、含一组简单的指令，可方便地定义事件、 动作与目标。动作与目标。 采用面向对象的事件编程方式采用面向对象的事件编程方式 Action编程 前一页 下一页 休息 6 交互动画与交互动画与Action编程编程 lFLASH事件编程基本要素事件编程基本要素 对象：可产生动作的研究实体。对象：可产生动作的研究实体。 指：帧、按钮和电影剪辑指：帧、按钮和电影剪辑 属性：对象的特性。属性：对象的特性。 如：元件的透明度、坐标等如：元件的透明度、坐标等 方法：对象本身的动作方法：对象本

4、身的动作 如：帧停止播放，按钮隐藏如：帧停止播放，按钮隐藏 事件：用户对对象的操作事件：用户对对象的操作 如：单击按钮如：单击按钮 Action编程 前一页 下一页 休息 7 交互动画与交互动画与Action编程编程 lAction代码执行特点：代码执行特点： Action编程并无独立程序文件，所有代码附于编程并无独立程序文件，所有代码附于 产生事件的对象上。产生事件的对象上。 只有关键帧、按钮或电影剪辑可作为产生事件的对象只有关键帧、按钮或电影剪辑可作为产生事件的对象 进行编程进行编程 采用事件响应方式执行代码即仅在事件发生时采用事件响应方式执行代码即仅在事件发生时 触发相应的动作，执行与本

5、事件相关的程序代触发相应的动作，执行与本事件相关的程序代 码。码。 如：单击如：单击“Play”按钮产生按钮产生“on Release”事件，触发播事件，触发播 放动画操作，播放指定电影剪辑。放动画操作，播放指定电影剪辑。 为方便维护与移植，可将代码导出生成代码文为方便维护与移植，可将代码导出生成代码文 件件(.as) Action编程 前一页 下一页 休息 8 动作面板动作面板 lAction编程通过编程通过Action（动作）面板（动作）面板 进行。进行。 l动作面板的显示：动作面板的显示： 动作面板位于舞台区下方动作面板位于舞台区下方 菜单：菜单：“窗口窗口”“动作动作”亦可打开动亦可打

6、开动 作面板作面板 分类：帧、按钮板、影片剪辑面板分类：帧、按钮板、影片剪辑面板 打开操作时由系统根据用户选择对象自打开操作时由系统根据用户选择对象自 动打开相应种类面板动打开相应种类面板 动作面板显示 前一页 下一页 休息 9 动作面板界面动作面板界面 动作工具箱动作工具箱 动作编辑窗口动作编辑窗口 工具栏工具栏 动作对象列表动作对象列表 前一页 下一页 休息 10 动作面板界面动作面板界面 l动作工具箱动作工具箱 工具箱按动作性质分类列出所有工具箱按动作性质分类列出所有Action编编 程语句程语句 单击分类名图标可展开或隐藏本分类下属单击分类名图标可展开或隐藏本分类下属 语句语句 选定语

7、句后双击或拖动语句到脚本窗口即选定语句后双击或拖动语句到脚本窗口即 可输入该语句可输入该语句 工具箱列表最后一项工具箱列表最后一项Index提供所有命令提供所有命令 并按字母顺序排放以便于查询并按字母顺序排放以便于查询 动作面板窗口 前一页 下一页 休息 11 动作面板界面动作面板界面 l动作编辑窗口动作编辑窗口 显示动作代码，并可进行相应编辑显示动作代码，并可进行相应编辑 语句的修改、删除、复制与移动等与一语句的修改、删除、复制与移动等与一 般编辑程序操作相同般编辑程序操作相同 l动作对象列表动作对象列表 动作对象列表自动列出本动画全部已编动作对象列表自动列出本动画全部已编 程对象程对象 当

8、前选择：显示正在编辑的动作对象当前选择：显示正在编辑的动作对象 从其余项目下选取对象即可重新对该对从其余项目下选取对象即可重新对该对 象编程象编程 动作面板窗口 前一页 下一页 休息 12 动作面板动作面板 l工具栏：工具栏： 在当前语句下方添加一条语句在当前语句下方添加一条语句 单击时出现子菜单帮助用户选择语句单击时出现子菜单帮助用户选择语句 查找代码查找代码 替换代码替换代码 插入目标路径插入目标路径 输入或选择动画中插入的对象（如电影剪辑）输入或选择动画中插入的对象（如电影剪辑） 的位置的位置 检查语法错误检查语法错误 单击后检查本语句语法错误并在输出窗口中单击后检查本语句语法错误并在输

9、出窗口中 指出错误位置、原因及解决方法指出错误位置、原因及解决方法 动作面板的按钮 前一页 下一页 休息 13 动作面板动作面板 l工具栏按钮：工具栏按钮： 自动套用格式自动套用格式 按设定格式自动设置语句格式缩进按设定格式自动设置语句格式缩进 代码提示代码提示 输出语句时提示代码输出语句时提示代码 提示类型提示类型 Y输入函数的参数信息输入函数的参数信息 Y输入对象的方法和属性输入对象的方法和属性 Y后继事件编码提示后继事件编码提示 动作面板的按钮 前一页 下一页 休息 14 动作面板动作面板 l动作面板界面参数设置动作面板界面参数设置 动作面板选项菜单首选项动作脚本动作面板选项菜单首选项动

10、作脚本 l代码的导入与导出：代码的导入与导出： 导出操作：导出操作： 动作面板选项菜单导出脚本动作面板选项菜单导出脚本 选择文件位置和名称，即将当前语句导出形选择文件位置和名称，即将当前语句导出形 成编程文件（成编程文件（.as） 导入操作：导入操作： 动作面板选项菜单导入脚本选择文件位动作面板选项菜单导入脚本选择文件位 置和名称置和名称 动作面板的选项菜单 前一页 下一页 休息 15 FLASH基本互动事件基本互动事件 l帧事件帧事件 帧动作在播放到本关健帧时自动触发帧动作在播放到本关健帧时自动触发 l按钮事件按钮事件 用户操作鼠标（键盘）时触发的动作用户操作鼠标（键盘）时触发的动作 l电影

11、剪辑事件电影剪辑事件 用户操作电影剪辑时触发的动作用户操作电影剪辑时触发的动作 Flash事件分类 前一页 下一页 休息 16 基本互动事件基本互动事件 l按钮事件：按钮事件： 事件名称：事件名称：on 面板分类：全局函数面板分类：全局函数 影片剪辑控制影片剪辑控制 - on 对按钮进行的操作种类写在（）中对按钮进行的操作种类写在（）中 操作后执行的语句写在操作后执行的语句写在on事件花括号中事件花括号中 例：例：on ( release ) play( ); 单击鼠标后播放动画单击鼠标后播放动画 简单事件响应 前一页 下一页 休息 17 FLASH基本互动事件基本互动事件 按钮事件 l按钮事

12、件的子事件（操作种类）按钮事件的子事件（操作种类） 点击点击( press )鼠标在按钮上按下鼠标在按钮上按下 释放释放( release )鼠标在按钮上按下后放开（默认）鼠标在按钮上按下后放开（默认） 释放离开释放离开( releaseOutside )鼠标在按钮上按下后在鼠标在按钮上按下后在 按钮外放开按钮外放开 指针经过指针经过( rollOver )鼠标移至按钮上鼠标移至按钮上 指针离开指针离开( rollOut )鼠标离开按钮鼠标离开按钮 拖放经过拖放经过( dragOver )鼠标在按钮上按下并拖离再鼠标在按钮上按下并拖离再 移回按钮移回按钮 拖放离开拖放离开(dragOut)鼠标

13、在按钮上按下并拖离按钮鼠标在按钮上按下并拖离按钮 按键按键(keyPress)键盘按键（在右框中输入按键名称）键盘按键（在右框中输入按键名称） 前一页 下一页 休息 18 基本互动事件基本互动事件 l电影剪辑事件：电影剪辑事件： 电影剪辑事件名：电影剪辑事件名：OnClipEvent 动作面板：动作面板： 全局函数全局函数 影片剪辑控制影片剪辑控制OnClipEvent 电影剪辑子事件写在电影剪辑子事件写在OnClipEvent后面的后面的 （）条件中（）条件中 执行后发生的动作语句应写在电影剪辑执行后发生的动作语句应写在电影剪辑 事件花括号中事件花括号中 简单事件响应 前一页 下一页 休息

14、19 FLASH基本互动事件基本互动事件 电影剪辑事件 l电影剪辑事件的子事件电影剪辑事件的子事件 加载加载( Load )载入电影剪辑载入电影剪辑 导入帧导入帧( enterFrame )载入电影剪辑播放任载入电影剪辑播放任 一帧时触发一帧时触发 卸载卸载( unload )卸载电影剪辑时触发卸载电影剪辑时触发 鼠标按下鼠标按下( MouseDown )按下鼠标按下鼠标 鼠标按下鼠标按下( MouseUp )释放鼠标释放鼠标 鼠标移动鼠标移动 ( MouseMove )鼠标拖动鼠标拖动 向下键向下键( keyDown )按下键盘任意键按下键盘任意键 向上键向上键( keyUp )放开键盘任意

15、键放开键盘任意键 数据数据( Data ) 载入变量或影片时触发载入变量或影片时触发 前一页 下一页 休息 20 流向控制基本命令流向控制基本命令 l影片播放控制是最基本的动作语句影片播放控制是最基本的动作语句 l播放与停止命令播放与停止命令 面板：全局函数面板：全局函数 时间轴控制时间轴控制 stop：停止播放：停止播放 play：从当前位置处重新放映：从当前位置处重新放映 Stop all sound：终止所有正在播放的声：终止所有正在播放的声 音，但不会影响影片的视觉效果。音，但不会影响影片的视觉效果。 实例：按钮控制气球升空。实例：按钮控制气球升空。 M注意：大多数动作播放时不起作用，

16、只注意：大多数动作播放时不起作用，只 有有“测试影片测试影片”时才能看到效果时才能看到效果 控制影片播放 前一页 下一页 休息 21 流向控制基本命令流向控制基本命令 l改变帧流向改变帧流向 操作：操作： 面板：面板：全局函数全局函数 时间轴控制时间轴控制 具体命令具体命令 分类分类 gotoAndStop：转到指定帧并停止播放：转到指定帧并停止播放 gotoAndPlay ：转到指定帧并播放：转到指定帧并播放 nextFrame：转到下一帧：转到下一帧 preFrame：转到上一帧：转到上一帧 nextScene：转到下一场景：转到下一场景 preScent：转到上一场景：转到上一场景 改变影片播放顺序 前一页 下一页 休息 22 流向控制基本命令流向控制基本命令 l实例：实例： 不停踢球的女孩不停踢球的女孩 简易图片簿简易图片簿 利用按钮控制利用按钮控制Flash BaBy的播放的播放 改变影片播放顺序 前一页 下一页 休息 23 流向控制基本命令流向控制基本命令 l给对象命名给对象命名 为按钮或影