Flash 教案8水波荡漾-“遮罩层”动画.doc

1、- 1 -课题 水 波 荡 漾 -“遮 罩 层 ”动 画 课型 实作教学目标1、复 习 各 类 型 元 件 的 制 作 方 法 ，熟 练 掌 握 元 件 的 位 置 、颜 色 等 属 性 的 更 改 。2、复 习 巩 固 引 导 层 动 画 的 制 作 方 法 。3、学 习 遮 罩 层 动 画 的 制 作 。重点 遮 罩 层 动 画难点 遮 罩 层 动 画 的 创 建教学方法演 示 和 学 生 上 机教学媒体课 件多 媒 体 网 络 教 室教学课时4课 时教学过程与方法教师活动 学生活动第 1课 时 ： 新 课 的 引 入 ：师 引 入 课 题 ：教 师 演 示 本 课 范 例 、创 作 天

2、地 范 例 、百 叶 窗 特 效 、放 大 镜 特 效 等 具 有 遮 罩 层 特 效 的 动 画 ，让 学 生 观 察 用 所 学 的 知 识能 否 完 成 这 些 动 画 效 果 的 制 作 ？ 以 此 引 入 本 课 学 习 的 重 点 遮罩 层 动 画 。 新 课 的 教 学 ：一 、制 作 背 景师 引 入 第 8课 完 成 的 作 品 实 例 ，添 加 图 形 元 件 “鲜 花 ”来 丰 富画 面 ，为 飞 舞 的 蝴 蝶 设 置 情 境 。师 ：导 入 外 部 图 片 用 于 制 作 动 画 作 品 的 背 景 ，并 利 用 影 片 剪辑 元 件 的 颜 色 透 明 度 设 置

3、制 作 出 水 中 倒 影 效 果 。 、导 入 图 片师 先 做 演 示 操 作 ，然 后 学 生 上 机 操 作 。具 体 演 示 操 作 步 骤 ：1、新 建 动 画 文 件 。修 改 文 档 “属 性 ”的 大 小 为 “800*600像 素 ”，背 景 色 为 “蓝 色 ”。2、执 行 “文 件 ” “导 入 ” “导 入 到 库 ”命 令 ，将 素 材 图 片- 2 -bk10.bmp导 入 到 库 中 。学 生 上 机 往 库 导 入 图 片 。 、制 作 有 水 中 倒 影 效 果 的 背 景师 先 做 演 示 操 作 ，然 后 学 生 上 机 操 作 。具 体 演 示 操 作

4、 步 骤 ：1、执 行 “插 入 ” “新 建 元 件 ”命 令 ，新 建 图 形 元 件 “背 景 图 ”。2、打 开 “库 ”面 板 ，将 图 像 bk10.bmp拖 放 到 舞 台 。3、回 到 场 景 1的 编 辑 状 态 ，重 命 名 “图 层 1”为 “背 景 ”，将 图形 元 件 “背 景 图 ”拖 放 到 舞 台 上 ，在 “属 性 ”面 板 中 调 整 X、Y 的 坐 标值 为 0、0，如 教 材 P66图 10.2所 示 。4、在 “图 层 1”上 复 制 图 形 元 件 “背 景 图 ”的 另 一 个 实 例 ，在 属性 面 板 中 调 整 其 X、Y坐 标 值 为 0、

5、300，颜 色 透 明 度 设 置 为 40%，如 教 材 P66图 10.3所 示 。5、使 用 “选 择 工 具 ”单 击 舞 台 下 方 位 置 的 “背 景 图 ”，执 行 “修改 ” “变 形 ” “垂 直 翻 转 ”命 令 ，制 作 出 水 中 倒 影 的 物 效 ，如 教 材P66图 10.4所 示 。6、在 “背 景 ”层 第 50帧 插 入 帧 。学 生 上 机 制 作 有 水 中 倒 影 效 果 的 背 景 。二 、制 作 乘 伞 落 下 的 小 熊师 先 做 演 示 操 作 ，然 后 学 生 上 机 操 作 。具 体 演 示 操 作 步 骤 ：1、新 建 图 形 元 件

6、“落 水 的 小 熊 ”，使 用 “线 条 工 具 ”、“椭 圆 工 具 ”等 绘 制 小 熊 图 案 ，如 教 材 P67图 10.5所 示 。2、回 到 “场 景 1”的 编 辑 状 态 ，新 建 图 层 ，重 命 名 为 “小 熊 ”，将图 形 元 件 “落 水 的 小 熊 ”拖 放 到 舞 台 上 方 。在 第 50帧 插 入 关 键 帧 ，移动 小 熊 位 置 ，使 其 位 于 有 倒 影 的 水 中 。3、在 图 层 “小 熊 ”上 添 加 运 动 引 导 层 ，绘 制 小 熊 落 下 的 轨 迹 。4、将 图 层 “小 熊 ”上 第 1帧 和 第 50帧 位 置 的 实 例 “落

7、 水 的 小熊 ”分 别 锁 定 在 路 径 的 两 端 。5、在 图 层 “小 熊 ”上 第 1至 第 50帧 之 间 创 建 动 画 补 间 动 画 ，完 成 小 熊 落 下 的 引 导 层 动 画 ，如 教 材 P67图 10.6所 示 。学 生 上 机 制 作 乘 伞 落 下 的 小 熊 。第 2课 时 ：- 3 -三 、利 用 遮 罩 层 制 作 水 中 倒 影 特 效 、制 作 倒 影 层师 ：观 察 生 活 中 的 水 中 倒 影 可 以 看 出 ，水 波 波 动 时 ，水 里 物 体的 影 像 会 向 外 扩 散 ，产 生 比 真 实 物 体 放 大 的 效 果 。师 先 做

8、演 示 操 作 ，然 后 学 生 上 机 操 作 。具 体 演 示 操 作 步 骤 ：1、在 图 层 “背 景 ”和 图 层 “小 熊 ”的 第 80帧 插 入 帧 。2、新 建 图 层 ，重 命 名 为 “水 中 倒 影 ”，在 第 50帧 插 入 关 键 帧 。3、复 制 “背 景 ”层 上 的 倒 影 图 案 ，粘 贴 在 “水 中 倒 影 ”层 的 第50帧 位 置 ，使 用 “任 意 变 形 工 具 ”将 图 像 适 当 放 大 ，如 教 材 P68图10.7所 示 。学 生 上 机 制 作 倒 影 层 。 、制 作 水 波 遮 罩师 先 做 演 示 操 作 ，然 后 学 生 上 机

9、 操 作 。具 体 演 示 操 作 步 骤 ：1、新 建 图 层 ，重 命 名 为 “水 波 ”。2、在 第 50帧 插 入 关 键 帧 ，使 用 “刷 子 工 具 ”绘 制 如 教 材 P68图 10.8所 示 的 圆 环 图 案 。3、在 “水 波 ”层 的 第 80帧 插 入 关 键 帧 ，使 用 “任 意 变 形 工 具 ”将 水 波 图 案 放 大 ，如 教 材 P69图 10.9所 示 。4、在 “水 波 ”层 的 第 50至 80帧 之 间 创 建 形 状 补 间 动 画 。5、右 击 图 层 “水 波 ”，在 弹 出 的 快 捷 菜 单 中 选 择 “遮 罩 层 ”命 令 ，则

10、 水 波 荡 漾 的 效 果 就 制 作 完 成 了 ，如 教 材 P69图 10.10所 示 。学 生 上 机 制 作 水 波 遮 罩 。【智 多 星 】遮 罩师 ：遮 罩 动 画 是 Flash中 常 用 的 一 种 技 巧 。遮 罩 动 画 就 像 是 一张 纸 上 镂 空 了 一 个 形 状 ，透 过 这 个 形 状 可 以 看 到 下 面 的 图 层 。用 于遮 罩 的 对 象 可 以 是 任 意 形 状 的 图 形 、文 字 或 元 件 等 。遮 罩 下 面 的 图层 （被 遮 罩 层 ）可 以 透 过 遮 罩 层 中 的 对 象 显 示 出 来 ，对 象 以 外 的 部 分将 被

11、 遮 蔽 。【DIY】遮 罩师 ：比 较 下 面 两 个 实 例 的 不 同 ，体 会 遮 罩 动 画 的 神 奇 效 果 。- 4 -实 例 1：以 渐 变 的 图 形 作 为 遮 罩 层学 生 上 机 制 作 体 会 。制 作 步 骤 ：1、新 建 文 件 ，修 改 文 档 “属 性 ”的 大 小 为 “300*180像 素 ”。2、将 图 层 1重 命 名 为 “文 字 ”，使 用 “文 本 工 具 ”写 入 静 态 文字 GELLO，在 该 图 层 第 25帧 插 入 帧 。3、新 建 图 层 ，重 命 名 为 “圆 ”，在 第 1帧 绘 制 “七 彩 线 形 填 充 ”的 图 形 ；

12、在 第 25帧 插 入 关 键 帧 ，使 用 “任 意 变 形 工 具 ”放 大 圆 形 图 案使 其 覆 盖 住 文 字 ，并 在 该 层 创 建 形 状 补 间 动 画 。4、右 击 图 层 “圆 ”，在 弹 出 的 快 捷 菜 单 中 选 择 “遮 罩 层 ”命 令 ，如 教 材 P70图 10.11所 示 。5、测 试 影 片 ，观 看 效 果 。第 3课 时 ：实 例 2：以 文 字 作 为 遮 罩 层学 生 上 机 制 作 体 会 。制 作 步 骤 ：1、重 复 实 例 1中 的 第 13步 。2、调 整 图 层 顺 序 ，使 “文 字 ”图 层 位 于 “圆 ”图 层 的 上 方

13、 。3、右 击 图 层 “文 字 ”，在 弹 出 的 快 捷 菜 单 中 选 择 “遮 罩 层 ”命 令 ，如 教 材 P71图 10.12所 示 。4、测 试 影 片 ，观 看 效 果 。师 引 导 分 析 ：实 例 1以 由 小 变 大 的 椭 圆 图 形 作 为 遮 罩 ，使 下面 一 层 的 文 字 通 过 镂 空 的 椭 圆 显 示 出 来 ，椭 圆 以 外 的 文 字 被 遮 蔽 。由 于 椭 圆 是 遮 罩 层 ，所 以 椭 圆 的 颜 色 不 影 响 画 面 效 果 。实 例 2以 文 本 作 为 遮 罩 层 ，通 过 镂 空 的 文 字 线 条 将 下 一 层的 椭 圆 图

14、形 显 示 出 来 ，文 字 线 条 以 外 的 图 形 被 遮 蔽 。由 于 文 字 是 遮罩 层 ，所 以 文 字 的 颜 色 将 不 影 响 画 面 效 果 ，而 椭 圆 的 色 彩 透 过 文 字线 条 显 示 出 来 。四 、保 存 文 件将 动 画 源 文 件 以 “水 波 荡 漾 ”为 文 件 名 保 存 到 自 己 文 件 夹 中的 “作 业 ”文 件 夹 中 ，并 测 试 生 成 swf格 式 的 文 件 。【知 识 着 陆 】遮 罩 是 Flash中 的 一 个 常 用 功 能 ，在 遮 罩 层 中 ，可 以 使 用 “绘- 5 -图 工 具 ”绘 制 各 种 图 形 作

15、为 遮 罩 ，透 过 这 些 图 形 能 够 看 到 被 遮 罩 层的 内 容 ，而 遮 罩 层 图 形 以 外 的 内 容 将 遮 蔽 。利 用 遮 罩 层 的 特 点 ，可以 制 作 各 种 文 字 变 幻 、水 波 纹 、百 叶 窗 切 换 等 特 效 。【视 野 拓 展 】网 页 制 作 三 剑 客学 生 阅 读 了 解 。第 4课 时 ：【创 作 天 地 】使 用 遮 罩 效 果 制 作 绽 放 的 礼 花 。制 作 提 示 ：将 彩 球 作 为 被 遮 罩 层 ，将 刷 子 工 具 绘 制 的 线 条 作 为 遮 罩 层 。教学后记本 节 教 学 实 例 、DIY制 作 的 两 个 实 例 及 创 作 天 地内 容 多 ，需 要 学 生 制 作 也 很 多 ，因 此 ，为 了 保 障 教 学 质 量 ，需 用 三 个 课 时 完 成 。