Flash02绘制矢量图形

《Flash02绘制矢量图形》由会员分享，可在线阅读，更多相关《Flash02绘制矢量图形（53页珍藏版）》请在装配图网上搜索。

1、第 2章 矢 量 图 形 2.1 与 图 形 图 像 相 关 的 几 个 基 本 概 念2.2 “ 铅 笔 ” 工 具 与 “ 线 条 ” 工 具2.3 “ 椭 圆 ” 工 具 与 “ 矩 形 ” 工 具2.4 认 识 Flash的 “ 绘 制 模 式 ”2.5 贴 紧 至 对 象2.6 “ 刷 子 ” 工 具2.7 导 入 插 图小 结 在 Flash动 画 的 制 作 过 程 中 ， 会 大 量 用 到矢 量 图 形 ， 而 Flash自 身 的 矢 量 绘 图 功 能 很 强大 ， 故 可 以 方 便 、 快 捷 地 绘 制 出 各 种 各 样 的 图形 。 图 形 和 图 像 是 日

2、常 生 活 中 经 常 说 起 的 词 汇 ，但 是 要 真 正 成 为 一 名 图 形 图 像 的 设 计 师 ， 还 需要 更 深 入 地 理 解 和 掌 握 相 关 的 一 些 知 识 。 2.1.1图形与图像 图 像 对 应 于 英 文 中 的 “ Image” ， 它 类 似于 照 片 ， 它 由 许 许 多 多 排 成 行 和 列 的 点 组 成 ，当 每 个 点 都 足 够 小 的 时 候 ， 宏 观 看 起 来 ， 一 幅图 像 就 非 常 清 晰 了 。 而 图 形 对 应 于 英 文 中 的 “ Graphics” ， 它更 类 似 于 逻 辑 概 念 ， 比 如 一 个

3、三 角 形 、 一 个 圆形 或 者 一 条 曲 线 ， 它 们 都 被 称 为 “ 图 形 ” ， 而不 是 图 像 。 为 什 么 有 时 候 可 以 混 用 这 两 个 词 呢 ？ 因 为图 形 存 在 于 逻 辑 中 ， 最 终 要 能 够 被 人 眼 看 到 ，它 必 须 存 在 于 某 种 显 示 媒 体 上 ， 比 如 通 过 计 算机 显 示 器 显 示 ， 或 者 印 刷 在 纸 上 ， 而 一 旦 图 形被 “ 显 示 ” 在 显 示 器 上 ， 它 就 成 为 图 像 了 。 因 此 ， 读 者 只 要 知 道 二 者 是 不 同 的 就 可 以了 。 2.1.2分辨率

4、这 里 说 的 分 辨 率 是 指 一 个 图 像 在 水 平 和 竖直 方 向 分 别 包 含 的 像 素 数 。 例 如 在 购 买 数 码 相机 的 时 候 ， 会 关 注 一 款 相 机 的 分 辨 率 是 300万像 素 还 是 500万 像 素 ， 300万 像 素 指 的 是 它 拍 摄出 来 的 照 片 包 含 300万 个 点 ， 这 里 的 300万 是 个近 似 的 数 值 ， 精 确 来 说 是 水 平 方 向 有 2 048个像 素 ， 竖 直 方 向 有 1 536个 像 素 ， 二 者 构 成 的矩 形 区 域 包 含 2 048 1 536 = 3 145 72

5、8个 像素 ， 近 似 以 后 就 是 300万 像 素 了 。 2.1.3位图图像 位 图 图 像 由 排 列 成 网 格 的 点 组 成 ， 每 个 点称 为 一 个 “ 像 素 ” 。 计 算 机 的 屏 幕 就 是 一 个 大 的 像 素 网 格 。 在 一 幅 位 图 中 ， 图 像 是 由 网 格 中 每 个 像 素的 位 置 和 颜 色 值 决 定 的 。 每 个 点 被 指 定 一 种 颜 色 ， 这 些 点 像 马 赛 克中 的 贴 砖 那 样 拼 合 在 一 起 形 成 图 像 。 位 图 图 像 的 优 点 是 可 以 保 证 图 像 的 细 节 ，因 此 照 片 都 是

6、 典 型 的 位 图 图 像 。 位 图 的 一 个 特 征 是 当 它 被 放 大 以 后 ， 就 会变 模 糊 。 编 辑 位 图 图 像 时 ， 修 改 的 是 像 素 ， 而 不 是线 条 和 曲 线 。 位 图 图 像 与 分 辨 率 有 关 ， 这 意 味 着 描 述 图像 的 数 据 被 固 定 到 一 个 特 定 大 小 的 网 格 中 。 正 如 前 面 说 到 的 ， 放 大 位 图 图 像 将 使 这 些像 素 在 网 格 中 重 新 进 行 分 布 ， 这 通 常 会 使 图 像的 边 缘 呈 锯 齿 状 。 此 外 ， 在 一 个 分 辨 率 比 图 像 自 身 分

7、辨 率 低的 输 出 设 备 上 显 示 位 图 图 像 也 会 降 低 图 像 的 品质 。 2.1.4矢量图形 矢 量 图 形 是 使 用 称为 “ 矢 量 ” 的 线 条 和 曲线 （ 包 含 颜 色 和 位 置 信息 ） 显 示 图 形 。 它 使 用一 系 列 曲 线 描 述 圆 形 轮廓 ， 以 及 汉 字 的 笔 画 轮廓 。 图 形 的 颜 色 由 它 的轮 廓 颜 色 和 该 轮 廓 所 包围 的 区 域 颜 色 决 定 。 编 辑 矢 量 图 形 时 ， 修 改 的 是 描 述 其 形 状 的线 条 和 曲 线 的 属 性 。 矢 量 图 形 与 分 辨 率 无 关 ， 这

8、 意 味 着 除 了 可以 在 分 辨 率 不 同 的 输 出 设 备 上 显 示 它 以 外 ， 还可 以 对 其 执 行 移 动 、 调 整 大 小 、 更 改 形 状 、 更改 颜 色 等 操 作 ， 而 不 会 改 变 其 外 观 品 质 。 矢 量 图 形 的 缺 点 是 它 无 法 表 达 细 节 ， 例 如一 幅 照 片 上 的 各 个 点 无 法 构 成 一 个 用 数 学 方 程可 以 描 述 的 曲 线 。 矢 量 图 形 与 位 图 图 像 在 实 际 应 用 中 都 是 不可 缺 少 的 ， 所 以 在 这 里 使 用 “ 将 ” 和 “ 帅 ” 来比 喻 ， 表 示

9、它 们 并 没 有 优 劣 之 分 。 2.1.5路径、笔触与填充一 个 矢 量 图 形 有 3个 要 素 ： 路 径 、 笔 触 和 填 充 。l “路 径 ” 负 责 描 述 一 个 矢 量 图的 形 状 和 位 置 ， 而 与 颜 色 信 息 无关 。 可 以 通 过 修 改 一 个 矢 量 图 的路 径 来 调 整 它 的 形 状 和 位 置 。l“ 笔 触 ” 有 时 候 也 称 为 “ 描边 ” ， 它 负 责 确 定 矢 量 图 的 轮 廓的 颜 色 和 样 式 。l“ 填 充 ” 负 责 确 定 矢 量 图 形 被路 径 包 围 着 部 分 的 颜 色 和 样 式 。 “ 笔

10、触 ” 是 用 某 种 绘 图 工 具 “ 绘 制 ” 出 来的 封 闭 或 者 不 封 闭 的 “ 线 条 ” ， 而 “ 填 充 ” 是在 某 个 由 “ 笔 触 ” 包 围 的 区 域 中 ， 进 行 “ 上 色 ”操 作 的 结 果 。 通 常 把 绘 图 操 作 完 成 后 的 结 果 称 为 “ 笔触 ” ， 包 括 直 线 和 曲 线 ； 把 完 成 填 充 后 的 结 果称 为 “ 填 充 区 域 ” 或 “ 形 ” ， 即 一 个 区 域 。 而 线 和 形 统 称 为 “ 图 形 ” 。 首 先 介 绍 两 种 简 单 工 具 的 使 用 ： “ 铅 笔 ”工 具 和 “

11、线 条 ” 工 具 。 1“铅笔”工具的使用和“笔触颜色”的设置 2自定义笔触颜色 伸 直 ： 对 徒 手 绘 制 的 曲 线 进 行 伸 直处 理 ， 将 接 近 三 角 形 、 椭 圆 、 圆 形 、矩 形 和 正 方 形 形 状 的 图 形 转 换 为 这 些规 则 的 几 何 形 状 图 形 。平 滑 ： 可 以 将 手 绘 出 的 曲 线 修 改 得比 较 平 滑 。墨 水 ： 保 持 手 绘 时 的 曲 线 状 态 ， 不做 平 滑 处 理 。 4设置笔触样式 2.2.2“线条”工具 “ 线 条 ” 工 具 与 “ 铅笔 ” 工 具 相 同 的 一 点 是 ，它 们 都 是 笔 触

12、 工 具 ： 不 同之 处 在 于 “ 线 条 ” 工 具 用来 绘 制 直 线 。 “ 线 条 ” 工 具 在 工 具栏 中 的 位 置 如 图 2.17所 示 。 2.2.3实践与练习：绘制包装盒（1） 前 面 介 绍 的 两 种 工 具 有 一 个 共 性 ， 就 是 绘制 出 来 的 都 是 笔 触 ， 而 没 有 填 充 。 “ 椭 圆 ” 工 具 与 “ 矩 形 ” 工 具 可 以 绘 制 椭圆 和 矩 形 等 形 状 ， 而 且 绘 制 出 来 的 图 形 既 有 笔触 ， 又 有 填 充 。 要 绘 制 椭 圆 ， 应先 在 工 具 栏 中 选 中“ 椭 圆 ” 工 具 ， 如

13、 图2.38所 示 。 然 后 将 鼠 标 指 针移 动 到 舞 台 中 ， 按 下鼠 标 并 进 行 拖 动 ， 即可 绘 制 出 椭 圆 形 状 。2.3.1“椭圆”工具 在 “ 填 充 色 ” 面 板 的 顶 部 有 4个 功 能 选 项 ，从 左 往 右 依 次 是 ： 显 示 当 前 所 选 颜 色 的 参 数 值 、设 置 填 充 颜 色 的 不 透 明 度 、 将 填 充 颜 色 设 置 为无 、 自 定 义 填 充 颜 色 。 1设置渐变颜色填 充 色 面 板 最 下 面 的 一 排 渐 变 颜 色 ， 通 过 这 些 预 置 的渐 变 颜 色 ， 可 以 使 绘 制 出 来

14、的 椭 圆 呈 线 性 渐 变 或 者 放射 状 渐 变 等 效 果 。 2设置椭圆的属性 在 工 具 栏 中 选 中“ 椭 圆 ” 工 具 ， 然 后 在“ 属 性 ” 面 板 中 观 察“ 椭 圆 ” 工 具 的 属 性 选项 ， 除 增 加 “ 填 充 色 ”选 项 外 ， 其 他 选 项 与“ 线 条 ” 工 具 的 属 性 一致 ， 功 能 和 用 法 都 是 相同 的 。 2.3.2“矩形”工具 用 “ 矩 形 ” 工 具 绘 制 图 形 的 方 法 与 “ 椭 圆 ” 工具 类 似 。 要 绘 制 矩 形 ， 首 先 要 在 工 具 栏 中 选 择 “ 矩 形 ”工 具 ， 然

15、后 在 “ 颜 色 ” 区 域 中 设 置 矩 形 的 笔 触 颜 色 和填 充 颜 色 ， 完 成 后 即 可 在 舞 台 中 绘 制 矩 形 。 如 果 同 时按 住 键 盘 上 的 “ Shift” 键 ， 就 能 绘 制 出 正 方 形 。 1绘制圆角矩形 “ 边 角 半 径 ” 的 大 小 决 定 了 所 要 绘 制 圆 角 矩 形的 圆 角 的 弯 曲 度 ， 数 值 越 大 ， 圆 角 越 大 ， 数 值 越 小 ，圆 角 越 小 。 2笔触提示 “ 笔 触 提 示 ” 可 在 全 像 素 下 调 整 直 线 ， 防 止 出现 模 糊 的 垂 直 或 水 平 线 。 2.3.3多

16、边形和星形的绘制 要 绘 制 多 边 形 ， 首 先 要 选 择 “ 多 角 星 形 ” 工 具 ，该 工 具 与 “ 矩 形 ” 工 具 同 在 一 个 工 具 组 中 。 将 鼠 标 指针 移 动 至 “ 矩 形 ” 工 具 上 ， 然 后 单 击 该 工 具 并 持 续 两秒 钟 ， 会 弹 出 一 个 工 具 组 ， 在 “ 矩 形 ” 工 具 下 方 就 是“ 多 角 星 形 ” 工 具 。 在 进 行 深 入 讲 解 之 前 ， 先 来 做 一 个 试 验 。 这 样 有 时 会 给 设 计 带 来 不 便 ， 因 此Flash 8中 提 供 了 一 个 叫 做 “ 绘 制 模 式

17、 ” 的选 项 ， 用 来 解 决 这 个 问 题 。 在 工 具 栏 中 ， 选中 “ 铅 笔 ” 、 “ 线条 ” 、 “ 椭 圆 ” 和“ 矩 形 ” 工 具 以 后 ，在 “ 选 项 ” 区 域 都 会出 现 “ 绘 制 模 式 ” 图标 。 在 默 认 状 态 下 ， 这 个 选 项 处 于 抬 起 状 态 ， 这 时绘 制 的 各 个 图 形 对 象 会 互 相 影 响 ， 自 动 合 并 ， 因 此 这种 模 式 称 为 “ 合 并 模 式 ” ； 如 果 选 中 这 个 选 项 ， 就 会进 入 “ 对 象 模 式 ” ， 这 时 每 次 使 用 这 些 绘 图 工 具 绘 制

18、的 图 形 都 会 成 为 一 个 独 立 的 对 象 ， 这 样 对 象 之 间 就 不会 互 相 影 响 了 。 如 何 使 直 线 的 两 端 正 好 在 矩 形 的 左 右 两 条 边 上 ？可 以 使 用 Flash的 “ 贴 紧 至 对 象 ” 功 能 了 。 其 作 用 是使 正 在 绘 制 的 图 形 自 动 吸 附 到 离 它 最 近 图 像 边 缘 。 通过 它 可 以 对 图 像 做 很 好 的 闭 合 处 理 ， 保 证 闭 合 区 域 内颜 色 的 正 常 填 充 。 如 何 使 绘 制 的 图 形 更 精 确 ？ 刷 子 是 绘 图 工 具 之 一 ， 它 的 绘

19、制 方 式 与“ 铅 笔 ” 工 具 相 似 ， 也 是 在 拖 动 鼠 标 时 ， 沿 鼠标 指 针 经 过 的 路 径 产 生 形 状 ， 而 它 与 “ 铅 笔 ”工 具 不 同 的 是 ， “ 刷 子 ” 工 具 产 生 的 是 填 充 ，而 不 是 笔 触 。 使 用 “ 刷 子 ” 工 具 绘 制 形 状 的 操 作 方 法 是 ， 首先 在 工 具 栏 中 选 择 “ 刷 子 ” 工 具 ， 然 后 在 “ 属 性 ” 面板 中 选 择 填 充 颜 色 ， 接 着 像 使 用 “ 铅 笔 ” 工 具 那 样 在舞 台 上 拖 动 鼠 标 ， 就 会 产 生 图 形 了 。 2.6

20、.1涂色模式 “ 涂 色 模 式 ” 的 作 用 是 确 定 使 用 “ 刷 子 ”工 具 绘 制 的 图 形 与 原 有 图 形 的 关 系 。 因 此 ， 它 只 有 在 “ 合 并 模 式 ” 下 才 能 产 生作 用 ， 也 就 是 说 ， 如 果 以 “ 对 象 模 式 ” 绘 制 ，这 个 选 项 就 没 有 作 用 。 “ 标 准 绘 画 ” ： 可 对 同 一 层 的 线条 和 填 充 涂 色 “ 颜 料 填 充 ” ： 只 对 填 充 区 域 和空 白 区 域 涂 色 ， 笔 触 不 受 任 何 影 响 。 “ 后 面 绘 画 ” ： 对 同 一 层 的 空 白区 域 涂 色

21、 ， 绘 制 出 来 的 图 形 始 终 位于 已 有 图 形 的 下 方 ， 不 影 响 当 前 图形 的 线 条 和 填 充 。“ 颜 料 选 择 ” ： 只 对 选 中 区 域 内 的 图 形 产 生 作 用 ，不 会 影 响 选 区 之 外 的 图 形 。 “ 内 部 绘 画 ” ： 将 绘 制 的 区 域 限 制 在 落 笔 时 所 在 位置 的 填 充 区 域 中 ， 但 不 对 线 条 涂 色 。 2.6.2锁定填充 默 认 情 况 下 ， 如 果 舞 台 上 用 ” 刷 子 “ 工 具 绘 制 两 个 使用 渐 变 颜 色 的 图 形 ， 那 么 二 者 的 渐 变 颜 色 是

22、 相 互 独 立 的 。按 下 ” 锁 定 填 充 “ 按 钮 ， 进 入 锁 定 填 充 模 式 ， 然 后 在 此 绘制 两 个 图 形 ， 可 以 看 到 ， 渐 变 颜 色 好 像 扩 展 到 整 个 舞 台 ，也 就 是 两 个 对 象 的 渐 变 颜 色 是 连 续 的 。 2.6.3其他选项 如 果 在 Flash中 ， 所 有 的 图 形 都 需 要 亲 自绘 制 ， 那 么 制 作 效 率 和 效 果 必 定 会 受 到 很 大 的影 响 。 因 此 ， Flash提 供 了 导 入 插 图 的 功 能 ， 也就 是 可 以 把 各 种 格 式 的 文 件 作 为 素 材 ，

23、 导 入 到文 档 中 ， 这 样 就 可 以 直 接 利 用 这 些 素 材 了 。 这 里 说 的 插 图 包 含 3种 类 型 ： 矢 量 图 、 位 图 和 位图 序 列 。 矢 量 图 ： 在 专 门 的 矢 量 图 绘 制 工 具 软 件 （ 如Freehand、 Illustrator） 中 绘 制 的 矢 量 图 形 ， 导 入到 Flash中 时 ， 仍 然 可 以 保 留 矢 量 特 性 。 位 图 ： 这 里 说 的 位 图 就 是 常 见 的 JPG、 BMP等格 式 的 文 件 。 位 图 序 列 ： 如 果 是 文 件 名 以 数 字 结 尾 的 一 系列 文 件

24、， 可 以 自 动 导 入 到 Flash中 ， 并 自 动 产 生 动 画效 果 。 2.7.1把文件导入到Flash中 要 将 文 件 导 入 到 Flash中 ， 首 先 选 择 菜 单栏 中 的 “ 文 件 导 入 导 入 到 舞 台 ” 命 令 ， 然后 在 “ 导 入 ” 对 话 框 中 ， 从 “ 文 件 类 型 ” 下 拉列 表 框 中 选 择 一 种 文 件 格 式 ， 找 到 所 需 的 文 件 ，选 择 它 ， 并 单 击 “ 打 开 ” 按 钮 ， 这 时 该 文 件 就出 现 在 舞 台 上 了 。 如 果 要 导 入 的 文 件 名 称 以 数 字 结 尾 ， 并 且 在 同 一 文 件 夹中 还 有 其 他 按 顺 序 编 号 的 文 件 ， 会 打 开 对 话 框 ， 询 问 选 择 是否 导 入 文 件 序 列 。 这 时 单 击 “ 是 ” 按 钮 将 导 入 所 有 的 连 续 文 件 ， 单 击 “ 否 ”按 钮 则 只 导 入 指 定 的 文 件 。 2.7.2设置导入的位图的属性 对 导 入 的 位 图 可 以 应 用 消 除 锯 齿 功 能 ， 平 滑 图 像 的边 缘 ， 也 可 以 选 择 压 缩 选 项 以 减 小 位 图 文 件 的 大 小 。