2.2 绘制矢量图
使用Flash提供的绘图工具可以绘制各种各样的图形，在Flash中掌握绘制图形的方法是使用 Flash 的基础。从工具箱中选择一种绘图工具，然后在舞台中拖曳鼠标便可以绘制图形。
2.2.1 绘制直线
在Flash工具箱中提供了绘制线条的工具，利用线条工具可以绘制各种线型的直线。
手把手实例 绘制直线
（1）选择“文件＞新建”命令，在弹出的对话框中选择“常规”选项卡下的“Flash文件（ActionScript 3.0）”选项，单击“确定”按钮，创建一个影片文档。
（2）选择“文件＞导入＞导入到舞台”命令，在弹出的窗口中选择要导入的图形文件，然后单击
按钮，便将文件导入到舞台，调整图片的大小使其适合舞台的大小。导入到舞台中的图形如图2-9所示。
图2-9 木板
（3）选择“插入＞新建元件”命令，弹出“创建新元件”对话框，如图2-10所示，输入元件名称为“棋盘”，选择元件类型为“图形”，然后单击
按钮，进入图形元件的编辑状态。
图2-10 “创建新元件”对话框
注意
关于元件的概念，本书第10章有具体的讲解，请参阅。
（4）在工具箱中单击
（线条工具）按钮，如图2-11所示。选择“窗口＞属性”命令，打开属性面板，这时显示直线工具属性面板，如图2-12所示。
图2-11 线条工具
图2-12 直线工具属性
（5）在属性面板中设置直线的
（笔触颜色）为黑色（#000000），笔触高度为4，笔触样式为实线。把鼠标移到舞台中，拖曳鼠标便绘制出了一条直线，线条的粗细、线型等参数与在直线属性中设置的参数完全一样，如图2-13所示。
图2-13 第一条直线
（6）继续在舞台中绘制 3 条直线，并用绘制的直线组成棋盘的轮廓形状，如图2-14所示。
图2-14 棋盘轮廓
（7）在属性面板中设置直线的笔触高度为 2.5，其他属性保持同上。在舞台中绘制 6条直线并组合起来形成棋盘的内轮廓，如图2-15所示。
图2-15 棋盘内轮廓
（8）在属性面板中设置直线的笔触高度为 1.5，其他属性保持同上。在舞台中绘制直线并组合起来形成棋盘内的网格，如图2-16所示。
图2-16 棋盘内的网格
（9）在属性面板中设置直线的笔触高度为 2.5，其他属性保持同上。在舞台中绘制直线并组合起来形成棋盘内的定位点，如图2-17所示。
图2-17 棋盘内的定位点
（10）单击工具箱中的
（文本工具）按钮，在舞台中绘制好的棋盘上拖曳鼠标，出现文本输入框，输入文字“楚河”和“汉界”，这样棋盘就绘制好了，如图2-18所示。
图2-18 棋盘
（11）“棋盘”元件绘制完毕后，单击舞台窗口上方的
按钮，回到场景编辑状态。选择“窗口＞库”命令，打开“库”面板，如图2-19所示。选中当前图层的第1帧，从库中将“棋盘”元件拖曳到舞台中，最终的效果图如图2-20所示。选择“文件＞保存”命令，定义文件名为“绘制直线.fla”。
图2-19 库
图2-20 效果图
技巧
拖曳鼠标的同时按住Shift键，可以沿水平、垂直或45度的方向绘制直线。
高手点评
线条工具是基本工具，利用该工具可以绘制许多基本图形，并且，按住 Shift 键绘制直线时，可以保持45度的角度，因此很容易绘制出成直角的图形。
2.2.2 绘制矩形和椭圆
矩形工具与椭圆工具就是用来绘制矩形和椭圆的，这两个工具的使用方法类似。如果在绘图的过程中，交叉地使用这两个绘图工具绘制图形，会得到更多意想不到的效果。
手把手实例 绘制矩形和椭圆
（1）选择“文件＞新建”命令，在弹出的对话框中选择“常规”选项卡下的“Flash文件（ActionScript 3.0）”选项，单击“确定”按钮，创建一个影片文档。
（2）选择“文件＞导入＞导入到舞台”命令，在弹出的窗口中选择要导入的图形文件，然后单击
按钮，将文件导入到舞台，调整图片的大小使其适合舞台的大小。导入到舞台中的效果如图2-21所示。
图2-21 舞台背景
（3）选择“插入＞新建元件”命令，弹出“创建新元件”对话框，如图2-22所示，输入元件名称为“熊猫”，选择元件类型为“图形”，然后单击
按钮，进入图形元件的编辑状态。
图2-22 创建新元件
（4）单击工具箱中的
（矩形工具）按钮并按住鼠标，弹出图形工具选项，如图2-23所示，选择矩形工具
。
图2-23 图形工具选项
（5）选择“窗口＞属性”命令，打开属性面板，在属性面板中设置
（笔触颜色）为黑色（#000000），笔触高度为4，笔触样式为实线，
（填充颜色）为白色（#FFFFFF），矩形边角半径为 15，如图2-24所示。设置好矩形的属性参数后，把鼠标移到舞台中，拖曳鼠标便绘制出矩形，如图2-25所示，熊猫的脸就画好了。
图2-24 矩形工具属性面板
图2-25 熊猫的脸
（6）接着用矩形工具绘制熊猫的眼睛。首先在矩形工具属性面板中，设置矩形边角半径为30，其他属性设置同上，在舞台中拖曳鼠标绘制一个小矩形。然后更改属性面板中矩形的填充颜色为黑色（#000000），其他属性保持不变，在舞台中拖曳鼠标绘制另外一个小矩形（大于前一个小矩形）。把两个小矩形组合起来放到绘制好的熊猫脸上就形成了眼睛的图形。两只眼睛的画法相同，可以复制得到另一只眼睛，如图2-26所示，熊猫的两只眼睛就画好了。
图2-26 眼睛
（7）绘制熊猫的嘴。选择工具箱中的椭圆工具
，然后在椭圆工具属性面板中设置椭圆的
（笔触颜色）为黑色（#000000），笔触高度为4，笔触样式为实线，
（填充颜色）为黑色（#000000），结束角度为180度，如图2-27所示。
图2-27 椭圆工具属性面板
（8）把鼠标移到舞台中，拖曳鼠标绘制出一个小椭圆，把椭圆放置在熊猫的脸上，这样，熊猫的嘴就画好了，如图2-28所示。
图2-28 嘴
（9）接着用椭圆工具绘制熊猫的耳朵。保持椭圆工具的属性参数设置同上，在舞台中拖曳鼠标绘制一个小椭圆。然后更改属性面板中椭圆的填充颜色为白色（#FFFFFF），其他属性保持不变，在舞台中拖曳鼠标绘制另外一个小椭圆（略大于前一个小椭圆）。把两个小椭圆组合起来放到绘制好的熊猫脸上就形成了耳朵的图形。两只耳朵的画法相同，可以复制得到另一只耳朵，如图2-29所示，熊猫的两只耳朵就画好了。整个熊猫的头部就画完了。
图2-29 耳朵
（10）用矩形工具绘制熊猫的身体。在工具箱中选择矩形工具
，然后在矩形工具属性面板中，设置
（笔触颜色）为黑色（#000000），笔触高度为4，笔触样式为实线，
（填充颜色）为白色（#FFFFFF），矩形的边角半径为 0。在舞台中拖曳鼠标绘制一个矩形，把它放置到熊猫头部的下面，如图2-30所示，熊猫的身体就有了。
图2-30 身体
（11）接着用矩形工具绘制熊猫的四肢。更改属性面板中矩形的填充颜色为黑色（#000000），矩形边角半径为30，其他属性保持不变。在舞台中拖曳鼠标绘制4个小矩形，并把它们放到熊猫的身体上，就形成了熊猫的四肢。这样，熊猫就画完了，绘制好的熊猫如图2-31所示。
图2-31 熊猫
（12）“熊猫”元件绘制完毕后，单击舞台窗口上方的
按钮，回到场景编辑状态。选择“窗口＞库”命令，打开“库”面板，如图2-32所示。选中当前图层的第1帧，从库中将“熊猫”元件拖曳到舞台中，最终的效果如图2-33所示。选择“文件＞保存”命令，定义文件名为“绘制矩形和椭圆.fla”。
图2-32 库
图2-33 效果图
技巧
若拖动时按住Shift键，可以将形状限制为正圆形和正方形。
高手点评
对于矩形工具，通过输入一个角半径值便可以指定圆角。另外，在舞台中拖曳时，按住向上箭头键或向下箭头键可以调整圆角半径。对于椭圆工具，可以通过输入起始角度和结束角度的值来指定椭圆的形状。
2.2.3 绘制多边形和星形
在工具箱的矩形工具组中，有一个多角星形工具。使用多角星形工具可以绘制任意的多边形和星形图形。
手把手实例 绘制多边形和星形
（1）选择“文件＞新建”命令，在弹出的对话框中选择“常规”选项卡下的“Flash文件（ActionScript 3.0）”选项，单击“确定”按钮，创建一个影片文档。
（2）选择“文件＞导入＞导入到舞台”命令，在弹出的窗口中选择要导入的图形文件，然后单击
按钮，便将文件导入到舞台，调整图片的大小使其适合舞台的大小。导入到舞台中的图片如图2-34所示。
图2-34 舞台背景
（3）选择“插入＞新建元件”命令，弹出“创建新元件”对话框，如图2-35所示，输入元件名称为“小狮子”，选择元件类型为“图形”，然后单击
按钮，进入图形元件的编辑状态。
图2-35 “创建新元件”对话框
（4）单击工具箱中的
（矩形工具）按钮并按住鼠标，在弹出的图形工具选项中选择多角星形工具
，如图2-23所示。
（5）选择“窗口＞属性”命令，打开属性面板，在属性面板中单击
按钮，弹出“工具设置”对话框，如图2-36所示。
图2-36 工具设置
各个参数和选项的设置操作如下：
· 样式：根据所要绘制的图形选择“多边形”或“星形”。
· 边数：在此输入一个介于3到32之间的数字，确定要绘制图形的边数。
· 星形顶点大小：在此输入一个0到1之间的数字来指定星形顶点的深度。该数字越接近0，绘制的顶点就越深（像针一样）。如果是绘制多边形，要保持此设置不变。
（此设置不会影响多边形的形状）
（6）在“工具设置”对话框中设置样式为星形，边数为10，星形顶点大小为0.80，然后单击
按钮。设置属性面板中的
（笔触颜色）为黑色（#000000），笔触高度为4，笔触样式为实线，
（填充颜色）为橙红色（#FF5F00），如图2-37所示。
图2-37 多角星形工具属性
（7）把鼠标移到舞台中，在舞台中拖曳鼠标便可以绘制如图2-38所示的星形。
图2-38 星形
（8）在属性面板中单击
按钮，然后在“工具设置”对话框中设置样式为多边形，边数为5，单击
按钮。设置属性面板中的
（填充颜色）为橙黄色（#FF9F00），其他属性设置保持不变。在舞台中拖曳鼠标，绘制一个多边形，并把它放置到所绘制的星形图形上，如图2-39所示。
图2-39 多边形
（9）单击工具箱中的
（铅笔工具）按钮，并在铅笔工具属性面板中设置
（笔触颜色）为黑色（#000000），笔触高度为4，笔触样式为实线。在舞台中拖曳鼠标，绘制小狮子的脸部和身体图形，并填充身体部分为橙黄色（#FF9F00）。最后绘制完成的图形如图2-40所示，很像一只小狮子吧。
图2-40 小狮子
（10）“小狮子”元件绘制完毕后，单击舞台窗口上方的
按钮，回到场景编辑状态。选择“窗口＞库”命令，打开“库”面板，如图2-41所示。选中当前图层的第1帧，从库中将“小狮子”元件拖曳到舞台中，最终的效果如图2-42所示。选择“文件＞保存”命令，文件名为“绘制多边形和星形.fla”。
图2-41 库
图2-42 效果图
2.2.4 在图形中添加文字
Flash工具箱中还包含文本工具，可以利用文本工具在图形中添加文字。
手把手实例 在图形中添加文字
（1）选择“文件＞新建”命令，在弹出的对话框中选择“常规”选项卡下的“Flash文件（ActionScript 3.0）”选项，单击“确定”按钮，创建一个影片文档。
（2）选择“文件＞导入＞导入到舞台”命令，在弹出的窗口中选择要导入的文件，然后单击
按钮，便将文件导入到舞台，调整图片的大小使其适合舞台的大小。导入图片后舞台背景如图2-43所示。
图2-43 舞台中的图形
（3）单击工具箱中的
（文本工具）按钮，如图2-44所示。这时弹出文本工具属性面板，如图2-45所示。
图2-44 文本工具
图2-45 文本工具属性
（4）在属性面板中设置字体为 Times New Roman、字号为 70，文本颜色为灰色（#999999）。在舞台中单击鼠标，则出现文本输入框，在文本框中输入文字“I love football”，如图2-46所示。
图2-46 输入文字
（5）单击工具箱中的
（选择工具）按钮，在舞台中选中文字，按下键盘的 Ctrl+D组合键，则在舞台中复制了文字“I love football”，如图2-47所示。
图2-47 复制文字
（6）再次单击工具箱中的
（文本工具）按钮，在舞台中选中复制得到的文字，然后设置文本颜色为红色（#FF0000）。舞台中的文字如图2-48所示。
图2-48 更改文本颜色
（7）接着单击工具箱中的
（选择工具）按钮，在舞台中选中复制的文字，把它移动到原文字的上方，如图2-49所示，这样便得到了立体文字的效果。
图2-49 立体文字
（8）最后得到添加了立体文字的图形如图2-50所示。选择“文件＞保存”命令，定义文件名为“图形中添加文字.fla”。
图2-50 效果图
即问即答
要想更改部分线条的属性该怎么办呢？
使用箭头工具将线条的某一部分选中后，就可以单独更改选中部分的线条属性，如图2-51所示。
图2-51 更改选中部分的线条属性
可以自定义线条样式吗？
如果在属性面板中的所有线条样式都不合适，可以按照需要定制线条样式。自定义线条样式的操作如下：
单击直线工具属性面板中的
按钮，会弹出如图2-52所示的“笔触样式”对话框。各选项设置完成后，单击
按钮即可。
图2-52 笔触样式对话框