![边用边学Flash动画设计与制作](https://wfqqreader-1252317822.image.myqcloud.com/cover/277/22655277/b_22655277.jpg)
2.2 绘制基本图形
在Flash动画制作中,绘制各种图形是动画制作的基础,这些图形包括各种规则图形、不规则图形以及特殊图形等。
2.2.1 绘制不规则图形
绘制不规则图形的工具主要有【线条工具】、【铅笔工具】
、【钢笔工具】
。
1.【线条工具】
【线条工具】用于绘制不同长度和角度的直线。
【任务1】使用【线条工具】绘制线条。
Step 1 激活【线条工具】,在舞台中拖曳鼠标指针,即可绘制不同角度和长度的线条,如图2-8所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0032_0012.jpg?sign=1738886856-6ooRjQBCu1e9EOVqhZORDnNWfV4tw6uH-0-7d3d723738d60e56a8dffcd2b1fd12a2)
图2-8
Step 2 打开【属性】面板,可以设置线条的笔触颜色、笔触高度、笔触样式等,如图2-9所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0032_0013.jpg?sign=1738886856-CcK3tKDXc6mh3JQrRBdYZVk77BbRWUMP-0-5bc630a54a5b74b415738b10ce6499e6)
图2-9
Step 3 设置完成后,即可绘制不同高度、不同颜色和不同样式的线条,如图2-10所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0033_0001.jpg?sign=1738886856-DIo2Mv7orIuxPDSSQ3r3rOkM5sqZ1lhu-0-c9aa141812471af92d906402bd8cbc3a)
图2-10
2.【铅笔工具】
【铅笔工具】用于绘制不规则的曲线或者直线。
【任务2】使用【铅笔工具】绘制线条。
Step 1 激活【铅笔工具】,在舞台中拖曳鼠标指针,绘制线条,如图2-11所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0033_0006.jpg?sign=1738886856-up9ZRfbD9GKSzoNjseCRw2gwTkt0apdi-0-2e2e5798122be14365396bd59bce1c59)
图2-11
Step 2 打开【属性】面板,设置铅笔的笔触颜色、笔触高度、笔触样式等,如图2-12所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0033_0007.jpg?sign=1738886856-mbvBj7cafCXamugwWZLjWAkgb7JMk3kg-0-80c65681448acd397c06ee1c3c30f5d3)
图2-12
另外,还可以在工具栏下方选择使用何种模式进行绘制,包括【伸直】、【平滑】和【墨水】3种模式。
● 【伸直】模式可以自动规则绘制的的曲线,使其贴近规则曲线,只要勾勒出图像的大致轮廓,系统会自动将图形转化为接近的规则图形,如图2-13所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0033_0011.jpg?sign=1738886856-4u0t21XfzmCbrjaFV436EfFJdqNHTL8k-0-a878feb7d8aa78d0c1958d09587aee79)
图2-13
● 【平滑】模式可以平滑所绘制的曲线,使曲线的线条更加光滑,如图2-14所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0033_0012.jpg?sign=1738886856-WlPp7K9f0LwAw9XvJwmNpnU8OajkcZlz-0-b680f111fc55f2eeed97f00e4dcb246b)
图2-14
● 【墨水】模式对绘制的图形不进行任意加工,使绘制的线条保持原样,如图2-15所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0033_0013.jpg?sign=1738886856-yfN9xpthxxuaXKw0LHsVemfpPVX4g7AL-0-9f56829ab16892173d46d50ab8dd4782)
图2-15
3.【钢笔工具】
【钢笔工具】可以绘制光滑、精确的曲线,同时可以通过调整曲线的曲率改变曲线的形态。
【任务3】使用【钢笔工具】绘制曲线。
Step 1 激活【钢笔工具】,在舞台中单击创建锚点,创建由转换角连接的直线段组成的路径,如图2-16所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0034_0003.jpg?sign=1738886856-axl4FP5GyQY7BObKPG9mswLoUKwPOtFW-0-5d1db39dca079f4ca73e23816df1aa88)
图2-16
Step 2 打开【属性】面板,设置笔触颜色、笔触高度、笔触样式等,如图2-17所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0034_0004.jpg?sign=1738886856-ck0EqAxW8Qnu1Cr5IkZ0edcqYDe6qasE-0-6fcfbe002b5479e7a86d02bb715a54d0)
图2-17
Step 3 在舞台上单击创建锚点,创建由转换角连接的直线段组成的路径,如图2-18所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0034_0005.jpg?sign=1738886856-Lr1M3ICJeaY7igOMoZAyvcb2Nshs5W4U-0-adae12c6c0989be66879fe9c47e4c2f2)
图2-18
Step 4 如果要创建曲线,则可以在创建第2个锚点时按住鼠标左键拖曳,此时出现控制曲线的调节杆,调节杆控制曲线的曲率,依次绘制曲线,如图2-19所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0034_0007.jpg?sign=1738886856-fKGxNkM4wti2e3vS8s7kyJjKPyYc8Yq7-0-5435d71a47e087e09df686d2cb1cf1cb)
图2-19
Step 5 此外,也可以激活【转换锚点工具】,在有转换角的锚点上按住鼠标拖曳,拖出调节杆,继续拖曳鼠标指针,调整曲线的曲率,将转换角曲线调整为平滑曲线,如图2-20所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0034_0008.jpg?sign=1738886856-w62ScRnfAGAy4z8hvmXy3S6aqbt6T4rh-0-081f85368be0ca15d531cf4cd22f4ea1)
图2-20
Step 6 还可以在路径上添加锚点或删除路径上多余的锚点,从而达到调整曲线的目的。添加锚点时,激活【添加锚点工具】,在路径上单击即可添加锚点。若要删除锚点,则可以激活【删除锚点工具】
,在路径锚点上单击即可。
2.2.2 绘制规则图形
绘制规则图形的工具主要有【椭圆工具】、【基本椭圆工具】
、【矩形工具】
、【基本矩形工具】
以及【多角星形工具】
,下面分别介绍这几种工具的使用方法。
1.【椭圆工具】与【基本椭圆工具】
这两个工具都是用于绘制椭圆、圆、圆环或圆弧的矢量绘图工具,二者的区别在于使用【基本椭圆工具】绘制的图形包含节点。
【任务4】使用【椭圆工具】绘制椭圆。
Step 1 激活【椭圆工具】,在舞台中拖曳鼠标指针,创建圆或椭圆图形,如图2-21所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0035_0006.jpg?sign=1738886856-SFYYNvSflDtadf0AXlIlIlYHFpHbxD3O-0-a04fdcd3f4a7cf3b81aa924522f78684)
图2-21
Step 2 打开【属性】面板,设置图形的填充颜色、笔触颜色、宽度以及样式等,如图2-22所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0035_0007.jpg?sign=1738886856-Rto8xInt7opkmkNklGPwqVJ1tUNYxzjG-0-5dcbdcb10f82813caf40decf148e2d7f)
图2-22
Step 3 设置完毕后,继续在舞台中拖曳鼠标指针即可绘制圆或椭圆,如果设置了【开始角度】、【结束角度】以及【内径】等选项,则可以绘制半圆或半圆弧,结果如图2-23所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0035_0008.jpg?sign=1738886856-pnIR4CEBess1d5PJDlPnWxV8tBs1sDx0-0-5daed725fb87e6aa8fd3e7a10cc7f0fd)
图2-23
Step 4 使用【基本椭圆工具】绘制的圆包含节点,可以使用【选择工具】
拖曳节点进行调整,也可以在【属性】面板中设置【开始角度】或【结束角度】,调整圆为饼形图形,如图2-24所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0035_0011.jpg?sign=1738886856-QxdrWT8MYXVILckueEpWWyOGGtdWIo0q-0-2be90e2d332f4493fee22e3b2d97986f)
图2-24
2.【矩形工具】与【基本矩形工具】
【矩形工具】与【基本矩形工具】
可以绘制矩形、正方形和圆角矩形。
【任务5】使用【矩形工具】绘制矩形。
Step 1 激活【矩形工具】,在舞台中拖曳鼠标指针,创建矩形图形,如图2-25所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0036_0003.jpg?sign=1738886856-Zj9DPGgaGKr5Jyx3Y4q6v77i87HtCrb5-0-d113a4ce9e10f4a85fe1979cfcbf5628)
图2-25
Step 2 打开【属性】面板,设置图形的填充颜色、笔触颜色、笔触高度、样式以及圆角度数等,如图2-26所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0036_0004.jpg?sign=1738886856-YBJZk7iSQafkq8zwNVN5XueqFj7q2Mil-0-ebb6a3f9004e4c90a7a68eaa1d0beb6b)
图2-26
Step 3 在舞台中拖曳鼠标指针,即可绘制矩形和圆角矩形,如图2-27所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0036_0005.jpg?sign=1738886856-TI1IMGD2uFgJq5QYQMPBnJq4HFHcec7p-0-3770218e03218e91f29fc4e996eda9f8)
图2-27
Step 4 也可以使用【选择工具】拖曳矩形和圆角矩形上的节点,改变矩形和圆角矩形的形态,如图2-28所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0036_0007.jpg?sign=1738886856-2EN9vqKEcVJahbw2eV07UbzKWKTTaXh2-0-5f9426dee1fc8c6b26ed06352c348c69)
图2-28
3.【多角星形工具】
【多角星形工具】用于绘制多边形和星形。
【任务6】使用【多角星形工具】绘制星形图形。
Step 1 激活【多角星形工具】,在舞台中拖曳鼠标指针,创建星形图形,如图2-29所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0037_0003.jpg?sign=1738886856-BK96egdA5aTQ9mZulftK0nmOTF1Lweew-0-965b9e94b1d57d4593ed5a6184b3364e)
图2-29
Step 2 打开【属性】面板,设置图形的填充颜色、笔触颜色、笔触高度、样式以及圆角度数等。
Step 3 单击【选项】按钮,在打开的【工具选项】对话框中设置多边形的边数、样式等,如图2-30所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0037_0004.jpg?sign=1738886856-SVPhfvlB33PAxAdqIggGz4bIbfBdofeX-0-56cb10004319f9a1897848b49e7c1f13)
图2-30
Step 4 设置完成后,在舞台拖曳鼠标指针,即可绘制多边形或星形,如图2-31所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0037_0005.jpg?sign=1738886856-GBwdid06q9zAAGndPnQcCYwJxHfBWU7W-0-54d50334a696732cebb1df46c2b73992)
图2-31
2.2.3 绘制特殊图形
除了不规则图形与规则图形之外,Flash CS5还可以绘制特殊图形。绘制特殊图形的工具有【刷子工具】、【喷涂刷工具】
与【Deco工具】
。
1.【刷子工具】
【刷子工具】用于绘制任意形状的矢量图形或创建一些特殊效果,其绘制的笔触好像涂色效果一般。
【任务7】使用【刷子工具】绘制图形。
Step 1 激活【刷子工具】,在舞台中拖曳鼠标指针,创建图形,如图2-32所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0037_0019.jpg?sign=1738886856-1HFIacJC3fS0B2phHtEJa5K2KWg2ULXV-0-c8f7b21f270c842474d9b3006f0ec5ce)
图2-32
Step 2 打开【属性】面板,设置颜色和平滑度等,如图2-33所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0038_0001.jpg?sign=1738886856-R3BmNgbN9rkLJmPZSkygpZiaUICw60ly-0-e0d054e44d97ab74f35f935391706cf7)
图2-33
Step 3 在舞台中拖曳鼠标指针,即可绘制特殊图形,如图2-34所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0038_0002.jpg?sign=1738886856-PM92QjyPqemkZuskcKSyjjKrckSb4HdG-0-c2af8db499265f50d8f4ddbc90dab6a0)
图2-34
Step 4 另外,激活【刷子工具】后,还可以在工具栏下方选择刷子形状、设置刷子大小以及设置刷子模式,如图2-35所示。其模式包括【标准绘制】
、【颜料填充】
、【后面绘画】
、【颜料选择】
以及【内部绘画】
,具体如下。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0038_0003.jpg?sign=1738886856-hsQPic6RI5GYBobnL3BdHc6v69j87Xbo-0-0f7c1c6ae1d241e4b6d340e53772ea0b)
图2-35
● 【标准绘制】:笔刷经过的地方,线条和填充全部被笔刷填充所覆盖,如图2-36所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0038_0007.jpg?sign=1738886856-2LwsmE8Gwv2JrwHt4FaOnHYVNVxjuu9b-0-518e4c2f61c37e2f92d1fd3bac5873aa)
图2-36
● 【颜料填充】:笔刷只将鼠标指针经过的填充进行覆盖,对线条不起作用,如图2-37所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0038_0008.jpg?sign=1738886856-8Vywt2WtS9NOH4Cy5smHLqijABsbNUPR-0-094683633330731f98ec6dff24cb1308)
图2-37
● 【后面绘制】:在图像的后面着色,笔刷的笔触可自动放置到图形的后面,不覆盖原有图形,如图2-38所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0038_0009.jpg?sign=1738886856-mr10gSH19Eg0RBvpzCT0OcRu0PEgjNBN-0-cd7ba79e550ad7eac5ece5f5c2ef1be8)
图2-38
● 【颜料选择】:在选定的区域着色,只有用选择工具选取的部分才可以着色,如图2-39所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0038_0012.jpg?sign=1738886856-XhQSjIhKJOJjnzTxTFO99BPIdpvwSKFl-0-5adac15d6e674ea171f4afbe2cbd5c67)
图2-39
● 【内部绘画】:刷子的笔触只能在完全闭合的区域绘画,不会对其他区域着色。
2.【喷涂刷工具】
【喷涂刷工具】用于在舞台上随机喷涂默认形状或元件,该工具类似于粒子喷涂器,可以一次将形状图案喷涂到舞台上。
【任务8】使用【喷涂刷工具】绘制图形。
Step 1 激活【喷涂刷工具】,在舞台中拖曳鼠标指针创建图形,默认情况下,【喷涂刷工具】使用当前选择的填充颜色喷射粒子点,如图2-40所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0038_0017.jpg?sign=1738886856-xBeTIhPzGsTw9I9IlvoR7sQ9PbDDF4g2-0-5a57908bb9aecb6ac0450b2da26bc527)
图2-40
Step 2 打开【属性】面板,设置喷涂方法、颜色,画笔宽度、高度、角度等,如图2-41所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0039_0001.jpg?sign=1738886856-iFoM7atwKTRTLtZ4OB5NJ52HdsFD35dX-0-4ded774314d7d624f5e501864c16aa7c)
图2-41
Step 3 如果启用【随机缩放】选项,则喷涂的粒子点会随机发生大小以及位置的变化,如图2-42所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0039_0002.jpg?sign=1738886856-Vw06WTsez081kYqBe2JHqGxjyNwTrYvH-0-dc31361956fa9e500ca8313a2f1f9fc8)
图2-42
Step 4 另外,该工具还可以对任何影片进行剪辑或将图形元件作为图案进行应用,方法是:创建任意图形的元件,如创建一个星形图形,按【F8】键将其转换为元件,如图2-43所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0039_0004.jpg?sign=1738886856-MwbdSoomvRv0a14S5MYIVDBYc90pZZD1-0-fc243461d9e9d90df9a12f16cefd012b)
图2-43
Step 5 激活【喷涂刷工具】,在其【属性】面板单击【编辑】按钮,在打开的【选择元件】对话框选择创建的“元件1”,如图2-44所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0039_0005.jpg?sign=1738886856-osiC1SZlpPGGsa7iXiQuyZEPhiu4A62X-0-2e40334b00147563544d57527a8f9e06)
图2-44
Step 6 单击按钮确认,然后在舞台上拖曳鼠标指针即可喷涂该元件,结果如图2-45所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0040_0001.jpg?sign=1738886856-k2h0UEG8RkYFNSHBxD8e7eeOTo0eB69E-0-7f98a0fce39f41e521eeb47acb32e380)
图2-45
3.【Deco工具】
【Deco工具】用于绘制装饰性的复杂图形或高级动画效果。
【任务9】使用【Deco工具】绘制图形。
Step 1 激活【Deco工具】,在舞台中拖曳鼠标指针创建图形,默认情况下,【Deco工具】
使用当前默认的图案进行填充,如图2-46所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0040_0007.jpg?sign=1738886856-6oGsriUgn2iFkS1FtsvIGV1gu0q3sjY2-0-66010332321a279bcf87af3363691706)
图2-46
Step 2 打开【属性】面板,在【绘制效果】组中单击【藤蔓式填充】下拉按钮,在弹出的下拉列表中有多种填充效果供选择,如图2-47所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0040_0008.jpg?sign=1738886856-oHT3q5YIjvGLjTBtZ7W4Iemmd0E9yyhX-0-043f3e289fe26d2a7bab3a6c7843e3d9)
图2-47
Step 3 选择不同的填充模式,则可以进行相关设置,然后绘制不同的填充效果,如图2-48所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0040_0009.jpg?sign=1738886856-wWtJ200r7f1ku0ABoX17diOek6roxZxL-0-f2e7ebc527821cfb869eb579f7262e89)
图2-48
Step 4 单击【编辑】按钮,在打开的【选择元件】对话框选择创建的“元件1”,如图2-49所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0041_0002.jpg?sign=1738886856-ujm2AdFZxSB8NIqsEY8XdXwUPsWY3uwq-0-7adc468e45adc9298eee3b38a45d1eca)
图2-49
Step 5 单击按钮确认,然后在舞台上拖曳鼠标指针即可喷涂由该元件所组成的图案,如图2-50所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0041_0003.jpg?sign=1738886856-QtCjtRtg27H9KbIsNYBWXUmQ5HIgit8c-0-64fa2396d4b0b15496da7b60a5c5abeb)
图2-50
Step 6 当选择【火焰动画】绘制效果后,在舞台中拖曳鼠标指针,即可创建一个火焰动画,如图2-51所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0041_0004.jpg?sign=1738886856-hgKB4tH2m3N6JMgfiSrbU5ioqtujbJhb-0-1ebe402ed3fdfd4e31ebb58137e21c86)
图2-51