项目二 绘 制 图 形
项目引入
Flash是一款以矢量图形为基础的动画创作软件,使用自带的绘图工具可以完成大部分Flash动画对象的创建。Flash CS5拥有强大的绘图功能。在工具箱中提供了多种绘图工具,针对每种工具能进行不同选项的设置,绘制出不同效果的图形。
任务一 认识【工具】面板
工具箱位于工作区的右侧,提供创建图形和编辑的各种工具。拖动【工具】面板的边框可以改变工具箱的大小。选择某种工具时,要配合工具箱的相关选项和【属性】面板来进行相应的操作。
选择【窗口】|【工具】命令显示工具箱,如图2-1所示。从图2-1可以看出,工具箱被分隔线分为6个部分。

图2-1 【工具】面板
1. 【选择】区域
【选择】区域主要用于选择工作区中的编辑对象。其中各种工具的作用如下。
(1) 选择工具
:用于选取对象、移动对象和编辑对象。
(2) 部分选取工具
:用于选取图形的节点和路径来改变图像形状。
(3) 任意变形工具
:用于对选取对象进行移动、旋转、缩放和扭曲变形。
(4) 渐变变形工具
:用于对渐变颜色进行变形操作。任意变形工具和渐变变形工具可通过图表右下角的小三角箭头来切换。
(5) 3D旋转工具
:通过x、y、z轴来移动动画剪辑。
(6) 套索工具
:用于手动绘制一个自由选择部分来创建一个选区。
2. 【绘图】区域
【绘图】区域主要用于绘制线条、图形,输入文本。其中各种工具的作用如下。
(1) 钢笔工具
:用于创建直线或曲线。钢笔工具图标右下角包含一个三角箭头,单击该三角箭头可发现还包含另外三种工具,分别为添加锚点工具、删除锚点工具和转换锚点工具。
(2) 文本工具
:用于创建文本。
(3) 线条工具
:用于绘制直线。
(4) 矩形工具
:包含绘制矩形、椭圆、多角星形等图形工具。可通过图标三角箭头来选择不同的工具。
(5) 铅笔工具
:用于创建线条。
(6) 刷子工具
:用于绘制刷子效果的线条或用填充选择对象内部的颜色。
(7) 喷涂刷工具
:可以一次将形状图案喷涂到舞台上,并可以将动画剪辑或图形元件作为该工具图案使用。
(8) Deco工具
:用于对选择对象进行藤蔓式填充、网格填充和对称刷子填充等填充方式。
3. 【填充】区域
【填充】区域主要用于填充颜色、擦除填充和吸取颜色。其中各种工具的作用如下。
(1) 骨骼工具
:选择要成为骨架的根部或头部的元件,再拖动到单独的元件将其链接到根部。
(2) 绑定工具
:编辑每个骨骼和形状控制点之间的链接。
(3) 墨水瓶工具
:用于对对象的边框进行填充。
(4) 颜料桶工具
:用于对对象的内部进行填充。
(5) 滴管工具
:用于吸取文字或图像的颜色。
(6) 橡皮擦工具
:用于擦除舞台上的边框和填充。
4. 【查看】区域
【查看】区域主要用于对应用程序窗口进行缩放和移动。其中各种工具的作用如下。
(1) 手形工具
:用于移动对象的显示区域。
(2) 缩放工具
:用于缩放对象的显示比例。
5. 【颜色】区域
【颜色】区域主要用于上色。其中各种工具的作用如下。
(1) 笔触颜色
:用于设置笔触的颜色。
(2) 填充颜色
:用于设置填充的颜色。
(3) 黑白颜色
:重置笔触颜色为黑色、填充颜色为白色。
(4) 交换颜色
:交换笔触颜色和填充颜色。
6. 【选项】区域
【选项】区域用于显示选定工具相应的工具选项。
任务二 绘制包装袋
知识准备
1. 线条工具
在Flash中,直线是最基本的图形,使用线条工具
可以绘制直线。按【Shift】键可以绘制特定角度的直线和闭合图形。
选择线条工具后出现对应的【属性】面板可以设置线条样式,如图2-2所示。图中各参数说明如下。
(1) 笔触颜色
:用于设置线条颜色。
(2) 笔触高度
:用于设置线条的粗细,范围为0.10~200点。
(3) 样式:用于设置线条样式。
(4) 编辑笔触样式
:单击编辑【笔触样式】按钮,打开【笔触样式】对话框,如图2-3所示,可以对线条进行更精确的设置。
缩放:用于设置线条缩放的方向。

图2-2 线条工具的【属性】面板

图2-3 【笔触样式】对话框
端点:用于设置直线端点的样式,端点下拉列表中有“无”、“圆角”、“方形”三个选项。图2-4是同一长度直接设置为三种端点后的效果。从图2-4可以看出,线段设置为圆角和方形端点后,线段两段都增加长度。线段两端增加的长度分别相当于线段笔触高度数值的一半。
接合:用于设置两个路径段相接的方式,接合下拉列表中有尖角、圆角和斜角三个选项,其方式如图2-5所示。

图2-4 直线端点样式

图2-5 路径相接方式
2. 铅笔工具
使用铅笔工具
绘图类似于真实的铅笔,铅笔工具自由度大,功能较强,可以绘制出很多复杂的曲线图形。选择铅笔工具后,按住鼠标左键不放,在舞台上拖动。同时按住【Shift】键可以绘制水平或垂直的线条。
选中铅笔工具后,在工具箱的【选项】区域中,单击“铅笔模式”可以看到如图2-6所示的三个选项:“伸直”、“平滑”、“墨水”,这是铅笔工具的三种绘图模式。
伸直:绘制直线,并将和三角形、椭圆形和矩形相近的形状转化为对应的基本图形。
平滑:绘制平缓的曲线。
墨水:对绘制的线条不进行任何加工。
3. 选择工具
使用选择工具
可以选取对象、移动对象和变形对象。
1) 选取对象
在编辑对象之前,必须先选择对象,被选择的对象会被亮点填充或方框包围。具体操作技巧如下。
(1) 在舞台中直接单击编辑对象即可。
注意:如果要同时选择对象的边框和进行填充,则要双击对象。
(2) 也可以用鼠标拖出一个选取框,框内的内容就是要选取的部分,如图2-7所示。

图2-6 铅笔工具的三种绘图模式

图2-7 选取对象
(3) 如果要全选每一个图层上的所有对象,则可以使用【Ctrl+A】键,或者选择【编辑】|【全选】命令,注意这种方式不能选择锁定或隐藏层中的对象。
(4) 如果要选择多个对象,则可以按住【Shift】键,连续单击多个选取的对象。
(5) 如果要取消所有选择,则可以在选择对象外单击或按【Esc】键即可;如果在选择了多个对象的情况下,想取消部分对象,可以再次按住【Shift】键,单击已经选择的对象,可以取消刚选择的对象。
2) 移动对象
选取对象后,将鼠标光标移动到对象上,按住左键不放,拖动对象到适当位置,松开左键,编辑对象就会移动到新位置。
具体步骤如下。
(1) 如果要移动同一图层的多个对象,则可以按前面所述选择多个对象的方法进行选取,然后按住鼠标左键不放,拖动对象到适当位置,松开左键即可,如图2-8所示。
(2) 可以在移动对象的同时进行复制,操作方法为按住【Alt】键不放,同时按住鼠标左键拖动选中的对象,此时鼠标光标会变成
,移动到适当位置后松开鼠标左键,这时会多一个刚选中对象的副本,如图2-9所示。

图2-8 移动对象
(3) 对齐对象:选择选取工具以后,工具箱的选项区会出现一个“贴紧至对象”选项,选择该选项(见图2-10),这时再移动对象,对象中心会出现一个黑色小圆环,当对象被移动到与目标对象对齐状态时,小圆环会变大,这两个对象就会自动对齐,如图2-11所示。

图2-9 复制对象

图2-10 “贴紧至对象”选项

图2-11 自动对齐
注意:对齐对象时,还可以单击【视图】|【贴紧】|【贴紧至对象】命令来实现对象;在【视图】|【贴紧】命令下可以看到其他几种对齐方式,打钩代表已选择该种方式,也可以通过【视图】|【贴紧】|【编辑贴紧方式】命令来设置。
3) 变形对象
将鼠标光标放在未选定对象的线条边角处,鼠标光标会变成
,按住鼠标左键拖动角点,可以改变边角位置以达到变形效果;将鼠标光标放在未选定对象的线条边界处,鼠标光标会变成
,按住鼠标左键进行拖动,可以改变线条曲率达到变形效果。如图2-12所示。

图2-12 变形对象
任务实施
任务目标:使用线条工具、铅笔工具和选择工具绘制如图2-13所示的包装袋图形。
具体操作步骤如下。
(1) 启动Flash CS5,新建一个Flash文档。文件大小采用默认的“550
440”像素,背景颜色设置为白色。
(2) 选择工具箱的线条工具,属性设置如图2-14所示,线条颜色设置为黑色,笔触设置为2.00,样式设置为实线,端点设置为圆角,接合设置为圆角。依次绘制包装袋的外轮廓线条,效果如图2-15所示。

图2-13 包装袋

图2-14 线条工具属性设置
(3) 选择工具箱中的铅笔工具,如图2-16所示,铅笔模式设置为平滑。属性设置和线条工具一样,如图2-17所示,颜色设置为黑色,笔触设置为2.00。绘制包装袋的第一条拉绳,效果如图2-18所示。

图2-15 绘制包装袋的外轮廓

图2-16 铅笔模式设置

图2-17 铅笔属性设置

图2-18 绘制拉绳效果
(4) 选择工具箱中的选择工具,对图2-19所示的包装袋拉绳进行变形调整,调整后的效果如图2-20所示。

图2-19 调整拉绳形状

图2-20 拉绳调整后的效果
(5) 选择工具箱中的移动工具,选中拉绳,同时按住【Ctrl】键将拉绳向右拖拉,复制出另一条拉绳,如图2-21所示。再用上述相同的方法,选择工具箱中的选择工具,对第二条拉绳进行调整。最终效果如图2-22所示。

图2-21 复制拉绳

图2-22 调整第二条拉绳
任务三 绘 制 花 朵
知识准备
1. 钢笔工具
如果要绘制精确又复杂的路径,就要用到钢笔工具
。钢笔工具可以对绘制的图形有非常精确的控制,对绘制的锚点、锚点的方向也可以进行很好的控制。
使用钢笔工具可以绘制直线或曲线,也可以先绘制直线再调整线条上的节点最后转换为曲线。实际上,直线可以转换为曲线,曲线也可以转换为直线,并能调整直线的角度、长度和曲线的倾斜度等。
1) 绘制直线
(1) 使用钢笔工具绘制直线路径的具体操作如下。
① 选择工具箱中的钢笔工具,然后将鼠标光标放置到舞台中并单击,创建第一个锚点,即直线路径的起始点。
② 将鼠标光标移动到直线路径中第一条直线要结束的位置,单击,创建第二个锚点,如图2-23所示。
③ 在舞台的其他位置继续单击,从而得到其他直线段,如图2-24所示。

图2-23 创建第一条直线

图2-24 创建其他直线
注意:按住【Shift】键再单击可以绘制角度为45°倍数的直线。
(2) 如果要结束直线路径的绘制,可以执行以下操作。
① 结束开放路径的绘制。在舞台中直线路径绘制的位置双击,即可创建出直线路径的最后一个锚点,并结束该直线路径的绘制。此外,按【Ctrl】键单击路径外的任何地方也可以结束该直线路径的绘制。
② 封闭开放路径。将钢笔工具放置到第一个锚点上,如果定位准确,就会在靠近钢笔尖的地方出现一个小圆,单击或拖动,即可闭合路径。
2) 绘制曲线
使用钢笔工具绘制曲线路径的具体操作如下。
(1) 选择工具箱中的钢笔工具,然后在舞台中单击,创建一个锚点。在舞台另一位置单击,并拖动鼠标光标,会出现曲线的切线手柄,如图2-25所示,此时释放鼠标左键即可绘制一条曲线段。
(2) 将鼠标光标放置在第二个锚点处,鼠标光标变成
形状后单击,即可去掉切线手柄下端切线方向,如图2-26所示。

图2-25 曲线的切线手柄

图2-26 改变切线方向
(3) 在舞台中再选中一个位置单击并拖动鼠标光标,如图2-27所示,然后释放鼠标左键即可完成,效果如图2-28所示。

图2-27 确定第三个锚点

图2-28 完成曲线绘制
3) 调整锚点
在使用钢笔工具绘制完直线和曲线路径后,还可以根据需要在相应的路径上进行添加、删除和转换锚点等操作。
(1) 添加锚点。将钢笔工具放置在路径上,鼠标光标变成
形状时,单击即可添加锚点,或者直接选择工具箱中的添加锚点工具
。
(2) 删除锚点。选择工具箱中的删除锚点工具
,将其放置到需要删除的锚点上,单击即可删除该位置上的锚点。
(3) 转换锚点。锚点分为直线锚点和曲线锚点两种。如果要将曲线锚点转换为直线锚点,则可以选择工具箱中的转换锚点工具
,然后将其放置到需要转换的锚点上,如图2-29所示,单击,即可将其转换为直线锚点,效果如图2-30所示。如果要将直线锚点转换为曲线锚点,则可以将转换锚点工具
放置到直线锚点上,如图2-31所示,将鼠标光标放置在直线锚点上进行拖动,效果如图2-32所示。

图2-29 将鼠标光标放置在曲线锚点上

图2-30 转换为直线锚点后的效果

图2-31 将鼠标光标放置在直线锚点上拖动

图2-32 转换为曲线锚点后的效果
4) 设置路径的端点和接合
选择创建好的路径,可以通过【属性】面板对路径的端点和接合进行设置。钢笔工具【属性】面板“端点”选项如图2-33所示,钢笔工具【属性】面板“接合”选项如图2-34所示。其中,“端点”包括“无”、“圆角”、“方形”三种类型,效果如图2-35所示。“接合”是指线段的转折处,即拐角的地方,包括“尖角”、“圆角”、“斜角”三种类型,效果如图2-36所示。
当选择“接合”为“尖角”时,可以设置尖角的数值。如图2-37所示,数值越大,尖角越尖锐,数值越小,尖角越平滑。
2. 部分选择工具
使用部分选取工具
,可以通过改变对象轮廓上的锚点位置来进行对象变形。具体操作如下。
(1) 使用部分选取工具
,单击对象轮廓,可以显示该对象轮廓上的锚点,如图2-38所示。

图2-33 钢笔工具【属性】面板“端点”选项

图2-34 钢笔工具【属性】面板“接合”选项

图2-35 端点类型

图2-36 接合类型

图2-37 设置尖角数值

图2-38 使用部分选取工具选择对象
(2) 单击曲线锚点,锚点上会出现一个切线手柄。拖动手柄可改变曲线,把鼠标光标放置到舞台其他位置,单击,可以看到改变锚点后的效果,如图2-39所示。
(3) 单击直线上的锚点,移动锚点,可以改变直线上的长度,把鼠标光标放置到舞台其他位置,单击,可以看到改变锚点后的效果,如图2-40所示。

图2-39 改变曲线锚点位置

图2-40 改变锚点后的效果
3. 颜料桶工具
颜料桶工具
可以对闭合区域进行颜色填充。这个闭合区域可以是空区域,也可以是已填充区域。另外,还可以使用颜料桶工具对非完全闭合区域进行颜色填充,但非闭合区域由颜料桶工具的设定决定,如图4-41所示。
4. 墨水瓶工具
墨水瓶工具
可以更改当前线条的颜色(不包括渐变和位图)、宽度和样式。
选择墨水瓶工具后,在【属性】面板中会显示墨水瓶设置,如图2-42所示。

图4-41 颜料桶工具选项

图2-42 墨水瓶工具【属性】面板
可以使用墨水瓶工具【属性】面板设置笔触的颜色、宽度和样式等,效果如图2-43所示。

图2-43 改变线条的属性
5. 刷子工具
使用刷子工具
可以绘制各种类似于毛笔效果的笔触。选择刷子工具后,工具箱对应的【选项】区域可以设置刷子绘画模式、刷子大小和刷子形状等,如图2-44至图2-46所示。

图2-44 刷子绘画模式

图2-45 刷子大小

图2-46 刷子形状
锁定填充
:单击该图标,可以将刷子的工作模式设定为锁定填充状态。该选项主要用于设置渐变图形、导入的位图图形。该选项下各参数说明如下。
标准绘画:在标准绘画模式下,刷子经过的地方,线条和填充全部被刷子填充所覆盖。
颜料填充:刷子只将鼠标光标经过的填充进行覆盖,对线条不起作用。
后面绘画:刷子不覆盖鼠标光标经过的矢量图形,只覆盖在没有图形的部分。
颜料选择:刷子只对当前被选择的矢量图形起作用。
内部绘画:刷子只对闭合填充区域起作用,不对其他区域起作用,这对上色操作很有用。
图2-47所示是不同的刷子模式下的填充效果。

图2-47 刷子填充效果
6. 喷涂刷工具
喷涂刷工具
类似于粒子喷射器,可以一次将形状图案喷涂到舞台上。喷涂刷【属性】面板如图2-48所示,具体参数如下。

图2-48 喷涂刷 【属性】面板
编辑:打开【选择元件】对话框,可以选择该库中的动画剪辑或图形元件作为喷涂刷粒子。
颜色:用于设置默认喷涂刷粒子的填充颜色。
缩放:用于缩放喷涂刷粒子的元件的宽度和高度。
随机缩放:按照随机缩放比例把使用元件的喷涂刷粒子放置在舞台上,并改变每个粒子的大小。使用默认喷涂点时,此选项是禁用的。
任务实施
任务目标:使用线条工具、刷子工具、钢笔工具、部分选取工具、颜料桶工具、墨水瓶工具绘制如图2-49所示花朵图形。
具体操作步骤如下。
(1) 启动Flash CS5,新建一个Flash文档。文件大小采用默认的“550
440”像素,背景颜色设置为“白色”。
(2) 选择工具箱中的钢笔工具,在舞台中绘制如图2-50所示的五角星。
(3) 选择工具箱中的部分选取工具,对图2-51所示的五角星的锚点进行调整,调整后的效果如图2-52所示。

图2-49 花朵图形

图2-50 绘制五角星

图2-51 调整锚点位置
(4) 选择工具箱中的转换锚点工具,将鼠标光标放置到如图2-53所示的五角星的锚点处,拖动鼠标光标,转换后的效果如图2-54所示。

图2-52 调整后的效果

图2-53 将直线锚点转换为曲线锚点

图2-54 转换后的效果
(5) 使用相同的方法将五角星另外四个直线锚点转换为曲线锚点。最终效果如图2-55所示。
(6) 选择工具箱中的颜料桶工具,填充颜色设置为“#FF9933”,在花朵内部单击,效果如图2-56所示。

图2-55 直线锚点完全转换为曲线锚点后的效果

图2-56 填充花朵
(7) 选择工具箱中的墨水瓶工具,笔触颜色设置为“#00CC00”,在花朵黑色轮廓线上单击,效果如图2-57所示。
(8) 选择工具箱中的线条工具,颜色设置为“#00CC00”,笔触高度设置为“2.00”,绘制花朵的根茎,如图2-58所示。使用工具箱中的选择工具,将根茎直线调整为曲线,如图2-59所示。

图2-57 改变花朵轮廓线颜色

图2-58 绘制根茎线条

图2-59 调整根茎线条
(9) 选择工具箱中的线条工具,颜色设置为“#00CC00”,笔触高度设置为“2.00”,绘制花朵的叶子,如图2-60所示。使用工具箱中的选择工具,将叶子直线调整为曲线,如图2-61所示。
使用同样的方法绘制叶子上另外两条线条,并进行调整,如图2-62至图2-64所示。

图2-60 绘制叶子线条

图2-61 调整叶子线条

图2-62 绘制叶子第二条线条
(10) 选择工具箱中的刷子工具,选择刷子形状为“圆形”,选取适当大小,在花朵中心单击,绘制花心。如图2-65所示,完成花朵的绘制。

图2-63 调整叶子第二条线条

图2-64 绘制叶子第三条线条

图2-65 绘制花朵花心
任务四 制作LOGO图形
知识准备
1. 矩形与基本矩形工具
使用矩形工具
可以绘制矩形或正方形,单击矩形工具后,舞台中的鼠标光标会变成一个十字形,再按鼠标左键拖动,就可以绘制一个矩形;如果同时按【Shift】键进行拖动,就可以绘制正方形。矩形工具【属性】面板如图2-66所示,可以通过“填充和笔触”选项来设置矩形轮廓和填充颜色、轮廓线粗细和轮廓线类型。例如,单击
或
,都会弹出一个【颜色】对话框,如图2-67所示。

图2-66 矩形工具【属性】面板

图2-67 【颜色】对话框
在【颜色】对话框中,移动鼠标光标,鼠标光标指针变为滴管形状,用户可以根据需要选择相应的纯色或面板底部的渐变色作为矩形的边框或填充颜色。如果选择右上角的空心白色块,则矩形对象将无边框或无填充色,图2-68显示了三种不同的线条和填充效果。
利用矩形工具还可以绘制圆角的矩形,如图2-69所示。

图2-68 3种不同的线条和填充效果

图2-69 绘制圆角矩形
在【属性】面板的“矩形”选项中,设置圆角矩形的边角半径,输入的范围为−100~100。数值越大,边角显示越圆。输入数值为负数,则边角是向内凹进去的曲线。数值为0时为直角。
基本矩形工具和矩形工具的区别在于,基本矩形工具绘制的矩形保持原图属性,可以在【属性】面板中继续进行圆角调整,也可以使用选取工具拖动矩形对象上的锚点,将其变形为不同形状的圆角矩形。
2. 椭圆与基本椭圆工具
椭圆工具
可以绘制椭圆或圆形,如果在拖动的同时按【Shift】键就可以绘制圆形对象。和矩形工具一样,通过椭圆工具的【属性】面板也可以设置线条颜色、填充颜色、线条宽度和线条类型等。
通过设置【属性】面板的“椭圆”选项,还可以绘制扇形图案,如图2-70所示,具体参数功能如下。
开始角度:用于设置扇形的开始角度。
结束角度:用于设置扇形的结束角度。
内径:用于设置扇形内角的半径。
闭合路径:绘制的扇形为闭合图形。
重置:恢复为初始值。
基本椭圆工具
和基本矩形工具一样,绘制后的椭圆保持原图属性,可以通过【属性】面板或选取工具进行原属性的调节。
注意:选择椭圆工具后,按住【Alt】键,在舞台上对需要绘制椭圆的地方单击,会弹出一个【椭圆设置】对话框,在该对话框中可以设置椭圆高度、宽度和是否从中心绘制,确定后,以所单击的点作为中心绘制一个椭圆。
3. 多角形工具
多角形工具
绘制方法和矩形工具、椭圆工具的类似,也可以通过【属性】面板设置多角星形的轮廓颜色、填充颜色、轮廓线粗细和类型等。
单击【属性】面板中的“工具设置”选项中的【选项】按钮后,会弹出一个【工具设置】对话框,如图2-71所示,具体参数功能如下。
样式:设置样式为“多边形”或“星形”。
边数:设置多边形或星形的边数。
星形顶点大小:设置星形顶点的大小。

图2-70 利用椭圆绘制扇形

图2-71 多角形【工具设置】对话框
4. 图形的合并与组合
1) 图形的合并
选择【修改】|【合并对象】子菜单中的相关命令可以合并或修改现有对象,从而创建新的图形。要在画布的正中间绘制一个圆形和一个正方形,绘制前需在工具箱的下方选择“对象绘制”,如图2-72所示。
选择【修改】|【合并对象】|【联合】命令可以将多个形状合并成单个形状。选择【修改】|【合并对象】|【交集】命令可以创建多个对象的交集对象。选择【修改】|【合并对象】|【打孔】命令可以在先绘制的对象上减去后绘制的对象的形状。选择【修改】|【合并对象】|【裁切】命令可以将先绘制的对象裁切成后绘制的对象的形状。如图2-73所示。

图2-72 绘制图形

图2-73 对象的联合、交集、打孔和裁切效果
2) 图形的组合
在Flash动画制作中,经常会利用【组合】命令将图形对象进行组合,以便于后面对其进行整体编辑。
在舞台中选择多个图形对象,然后执行菜单中的【修改】|【组合】(快捷键【Ctrl+G】)命令,即可将选中的图形对象进行组合。
任务实施
任务目标:使用椭圆工具、选择工具、任意变形工具绘制如图2-74所示的LOGO图形。
具体操作步骤如下。
(1) 启动Flash CS5,新建一个Flash文档。文件大小采用默认的“550
440”像素,背景颜色设置为“白色”。
(2) 选择工具箱中的椭圆工具,椭圆工具属性设置如图2-75所示,笔触颜色设置为“无”,填充颜色设置为“绿色”(#329A44),端点设置为“方形”,开始角度设置为“270.00”,结束角度设置为“360.00”,内径设置为“80.00”,在舞台上绘制如图2-76所示的环形。

图2-74 LOGO图形

图2-75 椭圆工具【属性】面板
(3) 选择工具箱中的“选择工具”,选中环形后按住【Ctrl+C】键进行复制,再按住【Ctrl+V】键进行粘贴。选择工具箱中的“任意变形工具”,如图2-77所示对复制后的环形进行旋转,并放置在如图2-78所示位置。

图2-76 绘制环形

图2-77 旋转复制的环形
(4) 选择工具箱中的选择工具,选择两个环形,采用相同的方法进行复制并旋转移动到适当位置,最终效果如图2-79所示。

图2-78 移动后的效果

图2-79 完成外环轮廓的效果
(5) 选择工具箱中的选择工具,选择左上和右下两个环形,在如图2-80所示的【颜色】面板中更改环形颜色,设置填充颜色为“#FE9A33”,填充后的效果如图2-81所示。
(6) 工具箱中的椭圆工具属性设置如图2-82所示,设置填充颜色为“#EF9A33”,开始角度和结束角度都设置为“0.00”,按【Shift】键绘制一个圆形,如图2-83所示。
(7) 采用上述同样的方法复制其他三个小圆,并更改颜色,效果如图2-84所示。

图2-80 【颜色】面板设置参数

图2-81 改变颜色后的效果

图2-82 椭圆工具属性设置

图2-83 绘制小圆

图2-84 复制小圆并更改颜色
(8) 选择工具箱中的选择工具,在舞台中拖出如图2-85所示区域,两个小圆的上半部被选中,按【Del】键删除,效果如图2-86所示。使用相同的方法删除其他三个方向,效果如图2-87所示。

图2-85 选中小圆上半部分

图2-86 删除上半部分的效果

图2-87 删除另三个方向后效果
(9) 选择工具箱中的任意变形工具,将删除后得到的四个半圆进行大小和位置上的调整,如图2-88所示。
(10) 选中工具箱中的文字工具,输入公司名称。文字工具使用方法将在后面介绍,详细方法可以参考项目二的任务七。最终效果如图2-89所示。

图2-88 调整半圆大小和位置

图2-89 完成后的效果
任务五 制作“藤蔓式填充”图形
知识准备
1. Deco工具填充图形
Deco工具
是Flash中一种类似“喷涂刷”的填充工具,使用Deco工具可以快速完成大量相同元素的绘制,也可以应用它制作很多复杂的动画效果。将其与图形元件和影片剪辑元件配合,可以制作效果更加丰富的动画。
2. Deco工具的属性设置
在图2-90所示的Deco工具的【属性】面板中,Flash CS5提供了13种绘制效果:藤蔓式填充、网格填充、对称刷子、3D刷子、建筑物刷子、装饰性刷子、火焰动画、火焰刷子、花刷子、闪电刷子、粒子系统、烟动画和树刷子。
1) 藤蔓式填充
可以使用藤蔓式图案填充舞台、元件或封闭区域。从库中选择元件,可以用该元件替换叶子和花朵的插图。生成的图案将包含在影片剪辑中,而影片剪辑本身包含组成图案的元件。

图2-90 Deco工具【属性】面板
2) 网格填充
网格填充可以复制基本图形元素,并有序地排列到整个舞台上,产生类似壁纸的效果。
3) 对称刷子
使用对称刷子,可以围绕中心点对称排列元件。在舞台上绘制元件时,会显示手柄,以使用手柄增加元件数、添加对称内容或修改效果来控制对称效果。使用对称刷子可以创建圆形用户界面元素(如模拟钟面或刻度盘仪表)和旋涡图案。
4) 3D 刷子
在舞台上3D 刷子可以像喷涂刷一样喷涂元件,但调整了元件的比例,使它们在舞台底部显得较大,而在舞台顶部显得较小。3D刷子可用于创建 3D 风景效果。
5) 建筑物刷子
建筑物刷子可创建各种摩天大楼。
6) 装饰性刷子
装饰性刷子是一个绘制刷子,可以在舞台上绘制各种预制的黑白形状。
7) 火焰动画
火焰动画可以为一个动态火焰创建一个逐帧矢量动画。
8) 火焰刷子
火焰刷子与火焰动画类似,可以在舞台上绘制火焰形状的静态矢量图形。
9) 花刷子
花刷子与装饰性刷子类似,不同之处在于花刷子在舞台上绘制的是彩色的矢量花朵形状。
10) 闪电刷子
闪电刷子可以在舞台上创建叉状闪电形状。可以使用属性检查器中的动画选项为帧中的画笔描边制作动画。
11) 粒子系统
粒子系统是一个动画效果,它可使用内建形状或自定义元件创建一阵粒子雨。
12) 烟动画
烟动画是火焰动画的附属效果,它可以为烟雾创建一个逐帧矢量动画。
13) 树刷子
树刷子可以在舞台上创建各种分叉的树木形状。
任务实施
任务目标:使用Deco工具的“藤蔓式填充”效果绘制如图2-91所示的图形。

图2-91 制作“藤蔓式填充”图形
制作“藤蔓式填充”图形的操作步骤如下。
(1) 打开任务一绘制的“包装袋.fla”文件。
(2) 选择工具箱的Deco工具,在【属性】面板的“绘制效果”栏中选择“藤蔓式填充”、“图案缩放:68%”,如图2-92所示。实际上,在【属性】面板中,还可以设置花朵和叶子形状的填充颜色,设置填充形状的水平间距、垂直间距和缩放比例。
(3) 设置完毕后,单击包装袋正面空白处,效果如图2-93所示。

图2-92 在【属性】面板的“绘制效果”栏中选择“藤蔓式填充”、“图案缩放:68%”

图2-93 填充后的效果
任务六 随心所欲变换图像
知识准备

图2-94 选择任意变形工具
1. 任意变形工具
使用任意变形工具
可以将工作区中的对象进行旋转、倾斜、缩放、扭曲和封套等变形操作。其中,扭曲和封套功能只适用于形状对象,当对象为元件、文本、位图、渐变时,这两种变形操作选项处于不可用状态。选择任意变形工具后,工具箱对应的“选项”区域会出现“贴紧至对象”、“旋转与倾斜”、“缩放”、“扭曲”和“封套”这五个选项,如图2-94所示。
在工作区绘制一个五角形,选择任意变形工具,对其进行变形操作。
1) 贴紧至对象
当移动对象时,可选择这一选项来对齐对象。详见选择工具中的相关介绍。
2) 旋转与倾斜
选中该选项,对象周边会出现8个控制点。将鼠标光标放在对象边角上,此时鼠标光标会变成一个旋转符号,拖动鼠标光标便可旋转对象,如图2-95所示。将鼠标光标放在边中心的控制点上,此时鼠标光标会变成一个倾斜符号,拖动鼠标光标便可倾斜对象,如图2-96所示。

图2-95 旋转对象

图2-96 倾斜对象
3) 缩放
选中该选项,将鼠标光标放在对象的任意控制点上,此时鼠标光标会变成缩放符号,拖动鼠标光标便可缩放对象,如图2-97所示。
注意:按【Alt】键,同时使用缩放功能,以对象的中心点为中心,可以对称缩放对象。按【Shift】键可以对对象进行等比例缩放。
4) 扭曲
选中该选项,将鼠标光标放在对象的任意控制点上,此时鼠标光标会变成扭曲符号,拖动鼠标光标便可扭曲对象,如图2-98所示。
5) 封套
选中该选项,对象会被一个包含控制点(方形)与切线手柄(圆点)的边框包围,拖动控制点或切线手柄,可以将对象自由变形,如图2-99所示。
注意:除了使用任意变形工具之外,还可以使用菜单命令中的【修改】|【变形】命令,在下拉菜单中选择相应的命令将对象变形。在菜单中除了有与任意变形工具相同的命令之外,还有【缩放和旋转】、【顺时针旋转】、【逆时针旋转】、【垂直旋转】、【水平翻转】等命令。其中【缩放和旋转】命令可以设置具体的缩放比例和旋转角度。

图2-97 缩放对象

图2-98 扭曲对象

图2-99 设置封套
2. 渐变变形工具
渐变变形工具
是用于调整颜色渐变的工具。
将五角形的填充设置为线性渐变填充,如图2-100所示。然后选中渐变变形工具,拖动右侧中间的方形手柄,可以调节渐变的宽度;拖动右侧上方的圆形手柄,可以调节渐变的旋转角度,如图2-101所示。

图2-100 设置线性渐变填充

图2-101 调节渐变的宽度和旋转角度
将五角形的填充设置为放射状渐变填充,如图2-102所示。然后选中渐变变形工具,拖动右侧上方的方形手柄,可以调节渐变的宽度;拖动右侧中间的圆形手柄,可以调节渐变的直径;拖动右侧下方的圆形手柄,可以调节渐变的旋转角度,如图2-103所示。

图2-102 设置放射状渐变填充

图2-103 调节渐变的宽度、直径和旋转角度
任务实施
任务目标:使用线条工具、选择工具、钢笔工具、颜料桶工具、任意变形工具和渐变变形工具完成如图2-104所示的图形。
操作步骤如下。
(1) 启动Flash CS5,新建一个Flash文档。文件大小采用默认的“550
440”像素,背景颜色设置为“白色”。
(2) 选择工具箱中的线条工具,颜色设置为“黑色”,笔触高度设置为“1.00”,绘制书本外轮廓。效果如图2-105所示。
(3) 选择工具箱中的选择工具,调整如图2-106所示的书本线条。采用相同的方法,调整书侧面的两条直线,效果如图2-107所示。

图2-104 书本图形

图2-105 绘制书本外轮廓

图2-106 调整书本线条
(4) 选择工具箱中的钢笔工具,绘制书本图案,效果如图2-108所示。
(5) 选择工具箱中的颜料桶工具,颜色面板设置为“线性渐变”,颜色范围设置为“#E30900”到“#F7FA0E”,如图2-109所示。在图案中单击,效果如图2-110所示。

图2-107 调整后的效果

图2-108 绘制书本图案

图2-109 颜色面板
(6) 选择工具箱中的渐变变形工具,调整图案的渐变填充效果,效果如图2-111所示。

图2-110 填充后的效果

图2-111 渐变变形
(7) 选择工具箱中的任意变形工具,对图案进行缩小和旋转,放置到书本适当位置上。
任务七 制作个性文字
知识准备
1. 输入文字及属性调整
文本工具
是用于输入文字的工具,文本类型分为静态文本、动态文本、输入文本三种类型。选择文本工具后,可以通过舞台右侧的【属性】面板来设置文本信息。
1) 创建文本
选择文本工具创建文本的方式有两种。第一种是选择文本工具在画面上单击,就会看到右上角有小圆圈的文字输入框,如图2-112所示。右上角带有小圆圈的文本框可以自动随着文字的内容来调节自身的宽度,也可以通过拖动文本框四个端点来调节文本范围。第二种是选择文本工具在画面上拖动文字的范围框,这时会看到文本框的右上角出现一个小方框,如图2-113所示。右上角带有小方框的文本框会限制文本的范围,输入的文字只能在规定的范围内呈现,超出范围将会自动回车输入文字。也可以拖动文本框四个端点来调节文本范围。

图2-112 单击文本工具创建文本

图2-113 拖拉文本工具创建文本
注意:当在Flash中输入文本时,Flash会将字体的相关信息存储到Flash 的.swf文件中,这样就可以保证用户浏览Flash动画时字体可以正常显示。但这样的后果是增大了文件,要小心使用。除了直接在Flash中输入文字外,还可以直接在不同的程序中进行文本粘贴。
(1) 创建静态文本。
创建静态文本是Flash中普遍应用的一种文本格式,静态文本在动画播放中不会改变。具体操作步骤如下。
① 选择文本工具,在舞台上单击,进行文本输入,或者拖动一个文本框后输入文本,绘制好的静态文本框没有边框。
② 在舞台上选取文字,在【属性】面板上调整该段文字的字体、大小、颜色、粗细、对齐方式、段落格式等属性信息。
③ 选取要添加超链接的文本,在【属性】面板的选项栏的“链接”选项中,输入一个指定的URL地址,并在“目标”选项下拉列表中选择超链接打开浏览器的方式,如图2-114所示。

图2-114 目标选项
(2) 创建动态文本。
在Flash界面中,一些需要进行动态更新的内容通常用动态文本来显示。动态文本框中的内容既可以在动画制作过程中输入,也可以在动画模仿过程中动态变化。
具体操作步骤如下。
① 选择文本工具,在舞台上单击,进行文本输入或拖动一个文本框后输入文本。
② 在【属性】面板的“文本类型”下拉列表中选取“动态文本”,绘制好的动态文本框会有一个黑色边界,如图2-115所示。
(3) 创建输入本文。
输入文本是让用户可以进行直接输入的功能。可以通过用户的输入得到的特定信息,如用户名称、用户密码等。
输入文本的【属性】面板的“段落”设置里,选择“行为”选项中的密码,如图2-116所示。选择密码后,用户的输入内容全部采用“*”显示。而最大字符数为规定用户输入字符的最大数目。

图2-115 选择文本类型

图2-116 “行为”选项
2) 设置文本属性
如果要编辑文本,则必须在操作前使用选取工具选择文本对象,或者使用文本工具单击文本框,再进行属性设置。文本可以作为一个整体进行移动、变形、旋转、对齐等操作,也可以选中文本块中的部分文本进行编辑。
文本【属性】面板如图2-117所示,具体参数如下。
文本类型:用于设置文本类型,文本分为静态文本、动态文本和输入文本。
系列:用于设置当前选中文本的字体。
样式:用于设置文本是否加粗或是否倾斜。
大小:用于设置当前文本的字体大小,可以通过滑竿设置,也可以输入数值来设置。
颜色:用于设置当前文本颜色。
消除锯齿:用于选择不同的对文字消除锯齿的方式。
可选
:使文本在用户的计算机上显示为可选,这样用户可以复制文本粘贴到其他的单独的文档中。
将文本呈现为HTML
:使用适当的HTML标签保留当前文本格式。
在文本周围显示边框
:用于为文本字段显示黑色边框和白色背景。
上标/下标
:用于为文本设置上标或下标的状态。

图2-117 文本【属性】面板
格式:用于设置当前段落所选文本的对齐方式。有“左对齐”、“居中对齐”、“右对齐”、“两端对齐”四种对齐方式。
间距:用于设置字符之间的间隔。
边距:用于设置文本字段的边框与文本之间的间隔。
行为:用于设置动态文本或输入文本的行类型。
方向:用于设置当前文本的方向。默认的方向是水平方向。
链接:用于为选择的文本创建超链接。在文本框中输入要链接到的一个URL地址,在浏览器中预览,可发现用户将光标移动到链接文本时会出现手形图标,单击后会链接到一个内部或外部HTML文件。
目标:用于设置超链接目标属性。
2. 文字变形
文字的变形,使用菜单中的【修改】|【分离】命令或【Ctrl+B】键来分离文本,文本块中每个字符都会成为一个独立的字符,然后使用变形工具或选取工具更改文字的形状。
创建分离文本的方法如下。
(1) 选择工具箱中的选择工具,然后单击工作区中的文本块。
(2) 单击菜单中的【修改】|【分离】(快捷键【Ctrl+B】)命令,此时选定文本的每个字符会被放置在一个单独的文本块中,而文本依然在舞台的同一位置上,如图2-118所示。
(3) 单击菜单中的【修改】|【分离】(快捷键【Ctrl+B】)命令,即可将舞台中的单个字符分离为图形,如图2-119所示。

图2-118 将整个文本分离为单个字符

图2-119 将单个字符分离为图形
注意:【分离】命令只适合用于轮廓字体,如TrueType字体,当分离位图字体时,字体会从屏幕上消失。
任务实施
任务目标:使用【文字工具】、【修改】|【分离】命令、颜料桶工具、渐变变形工具完成如图2-120所示的个性文字设计。

图2-120 个性文字

图2-121 文本工具属性参数
具体操作步骤如下。
(1) 启动Flash CS5,新建一个Flash文档。文件大小采用默认的“550
440”像素,背景颜色设置为“白色”。
(2) 选择工具箱中的文本工具,在图2-121所示【属性】面板中对参数进行设置,然后在舞台中单击,输入文字“彩虹文字”,如图2-122所示。
(3) 执行【修改】|【分离】(快捷键【Ctrl+B】)命令,将文字分离为如图2-123所示单个文本。再次执行【修改】|【分离】命令,将文本分离为图形,如图2-124所示。

图2-122 输入文字

图2-123 第一次文字分离效果
(4) 选择工具箱中的颜料桶工具,填充色设置为
(彩虹渐变),然后对文字进行填充,效果如图2-125所示。

图2-124 第二次文字分离效果

图2-125 填充效果
(5) 如果想得到不同的填充效果,可以使用工具箱中的渐变变形工具
对渐变填充效果进行调整。
深入解析
矢量绘图是Flash编辑环境的基本工具之一,通过绘图工具,Flash可以绘制丰富多彩的图形。除此以外,Flash还可以对不同的对象(包括元件、位图、文本等)进行相关的修饰和编辑操作,在应用时需要灵活处理,为制作动画奠定基础。
综合实训——制作宣传广告动画
任务目标:利用项目二所学知识制作如图2-126所示的卡通画。
具体操作步骤如下。
(1) 启动Flash CS5,新建一个Flash文档。文件大小采用默认的“550
440”像素,背景颜色设置为“白色”。
(2) 选择工具箱中的椭圆工具,属性设置如图2-127所示,笔触颜色设置为“#6F2F0B”,填充颜色设置为“#BA6830”,笔触高度设置为“3.00”,绘制如图2-128所示的椭圆作为孙悟空的脑袋。

图2-126 卡通画

图2-127 椭圆【属性】面板
(3) 选择工具箱中的钢笔工具,设置钢笔属性,参数如图2-129所示,笔触颜色设置为“#BA6830”,笔触高度设置为“1.00”。绘制孙悟空的脸,效果如图2-130所示。

图2-128 绘制孙悟空的脑袋

图2-129 钢笔属性参数
(4) 选择工具箱中的颜料桶工具将孙悟空脸部填充为“白色”,效果如图2-131所示。适当调整脸部位置,再使用钢笔工具绘制耳朵并进行填充,填充颜色设置为“#BA6830”。效果如图2-132所示。
(5) 使用相同的方法绘制孙悟空的帽子,笔触颜色分别设置为“#DA8415”和“#6E9777”,效果如图2-133所示。再选择工具箱中的颜料桶工具,对帽子进行填充,填充颜色分别设置为“#FFDE00”和“#B2DDC9”,效果如图2-134所示。

图2-130 绘制孙悟空的脸

图2-131 填充脸

图2-132 绘制耳朵

图2-133 绘制孙悟空的帽子
(6) 选择钢笔工具绘制孙悟空的眉毛,笔触颜色设置为“#1B5B36”。再使用颜料桶工具进行填充,填充颜色设置为“#58AA48”,效果如图2-135所示。
(7) 选择钢笔工具绘制脸部的红心,笔触颜色设置为“#8C0813”。再使用颜料桶工具进行填充,填充颜色设置为“#ED1824”,效果如图2-136所示。

图2-134 填充帽子颜色

图2-135 绘制眉毛
(8) 选择钢笔工具,绘制眼睛轮廓,笔触颜色设置为“#FFDE00”。再使用颜料桶工具进行填充,填充颜色设置为“白色”,效果如图2-137所示。

图2-136 绘制红心

图2-137 绘制眼睛轮廓
(9) 选择工具箱中的笔刷工具,刷子形状设置为“圆形”,适当调整大小绘制眼睛,效果如图2-138所示。
(10) 选择工具箱中的铅笔工具,笔触高度设置为“1.00”,颜色分别设置为“#58AA46”和“#8C0813”,绘制嘴巴,并使用选取工具调整线条角度,效果如图2-139所示。

图2-138 绘制眼睛

图2-139 绘制嘴巴
(11) 选择工具箱中的铅笔工具,笔触高度设置为“1.00”,笔触颜色设置为“#6F2F0B”,绘制耳朵里的线条。再使用工具箱中的笔刷工具,刷子形状设置为“圆形”,填充颜色设置为“#97431E”,适当调整耳朵大小,效果如图2-140所示。
(12) 选择工具箱中的笔刷工具,刷子形状设置为“圆形”, 填充颜色设置为“#97431F”,适当调整大小,绘制脸部阴影,效果如图2-141所示。

图2-140 绘制耳朵

图2-141 绘制阴影