绘图 API 使用基础知识



使用绘图 API 简介

绘图 API 是 ActionScript 中一项内置功能的名称,您可以使用该功能来创建矢量图形(直线、曲线、形状、填充和渐变),并使用 ActionScript 在屏幕上显示它们。flash.display.Graphics 类提供了这一功能。您可以在任何 Shape、Sprite 或 MovieClip 实例中使用 ActionScript 进行绘制(使用在这每个类中定义的 graphics 属性)。(实际上,这每个类的 graphics 属性都是 Graphics 类的实例。)

如果刚刚开始学习使用代码进行绘制,可以使用 Graphics 类中包含的几种方法来简化常见形状(如圆、椭圆、矩形以及带圆角的矩形)的绘制过程。您可以将它们作为空线条或填充形状进行绘制。当您需要更高级的功能时,Graphics 类还提供了用于绘制直线和二次贝塞尔曲线的方法,您可以将这些方法与 Math 类中的三角函数配合使用,创建所需的任何形状。

Flash Player 10 和 Adobe AIR 1.5 新增了一个绘图 API,通过该 API,只需一个命令即可用编程方式绘制完整的形状。熟悉 Graphics 类以及“使用绘图 API 的基础知识”中介绍的任务后,请继续学习绘图 API 高级用法,了解有关这些绘图 API 功能的详细信息。

常见绘图 API 任务

以下是您可能需要在 ActionScript 中使用绘图 API 完成的任务,本章将对这些任务进行介绍:

  • 定义线条样式和填充样式以绘制形状

  • 绘制直线和曲线

  • 使用方法来绘制形状(如圆、椭圆和矩形)

  • 使用渐变线条和填充进行绘制

  • 定义矩阵以创建渐变

  • 将三角函数与绘图 API 配合使用

  • 将绘图 API 与动画相结合

重要概念和术语

以下参考列表包含将会在本章中遇到的重要术语:

  • 锚点:二次贝塞尔曲线的两个端点之一。

  • 控制点:该点定义二次贝塞尔曲线的弯曲方向和弯曲量。弯曲的线绝不会到达控制点;但曲线就好像朝着控制点方向进行绘制的。

  • 坐标空间:显示对象中所包含坐标(其子元素所在位置)的图形。

  • 填充:对于带有以颜色填充的线条的形状,填充指形状内的实心部分;对于没有轮廓的形状,填充指整个形状。

  • 渐变:此颜色是指从一种颜色逐渐过渡到一种或多种其它颜色,与“纯色”相对。

  • 点:坐标空间中的一个位置。在 ActionScript 使用的二维坐标系中,点是按其 x 轴和 y 轴位置(点坐标)来定义的。

  • 二次贝塞尔曲线:一种由特定数学公式定义的曲线类型。在这种类型的曲线中,曲线形状根据锚点(曲线端点)和控制点(定义曲线的弯曲方向和弯曲量)的位置来计算。

  • 缩放:相对于原始大小的对象大小。用作动词时,对象缩放是指伸展或缩小对象以更改其大小。

  • 笔触:对于带有以颜色填充的线条的形状,笔触指形状的轮廓部分;对于未填充的形状,笔触指其多个线条。

  • 平移:将点坐标从一个坐标空间更改为另一个坐标空间。

  • X 轴:ActionScript 使用的二维坐标系中的水平轴。

  • Y 轴:ActionScript 使用的二维坐标系中的垂直轴。

完成本章中的示例

在阅读本章的过程中,您可能希望测试一些示例代码清单。因为本章介绍的是绘制可视内容,所以测试代码清单涉及运行代码以及在创建的 SWF 中查看结果。测试代码清单:

  1. 创建一个空的 Flash 文档。

  2. 在时间轴上选择一关键帧。

  3. 打开“动作”面板,将代码清单复制到“脚本”窗格中。

  4. 使用“控制”>“测试影片”运行程序。

    您将在所创建的 SWF 文件中看到代码清单的结果。