![边用边学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=1739302559-nMpYeoV0jI3l0bw1wXIRbO0nifpy8u1L-0-29ac4fb114c7001c467bd941d707d504)
图2-8
Step 2 打开【属性】面板,可以设置线条的笔触颜色、笔触高度、笔触样式等,如图2-9所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0032_0013.jpg?sign=1739302559-sPwH9rUaMIxoqAGNQ32rd1rL09C0WE2Z-0-ecc9a8f377954ab2bbf92a01a92cc2cd)
图2-9
Step 3 设置完成后,即可绘制不同高度、不同颜色和不同样式的线条,如图2-10所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0033_0001.jpg?sign=1739302559-zPQu2RTwiEszJ82TYXaV3ntRX0z0SXqz-0-d2ec6cd21b192ea2b570ea774c68ae85)
图2-10
2.【铅笔工具】
【铅笔工具】用于绘制不规则的曲线或者直线。
【任务2】使用【铅笔工具】绘制线条。
Step 1 激活【铅笔工具】,在舞台中拖曳鼠标指针,绘制线条,如图2-11所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0033_0006.jpg?sign=1739302559-4VzZs7YNiy0vRosXJXT7EiFF8PYpofeU-0-dd2b224c9bc0c21914dd8f01d9581cb7)
图2-11
Step 2 打开【属性】面板,设置铅笔的笔触颜色、笔触高度、笔触样式等,如图2-12所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0033_0007.jpg?sign=1739302559-tZA0eZ61gAtd3Ge46nJuhdgy1rHIPhrl-0-af9aa0cfe901da4a7e93f995d4d7a2f1)
图2-12
另外,还可以在工具栏下方选择使用何种模式进行绘制,包括【伸直】、【平滑】和【墨水】3种模式。
● 【伸直】模式可以自动规则绘制的的曲线,使其贴近规则曲线,只要勾勒出图像的大致轮廓,系统会自动将图形转化为接近的规则图形,如图2-13所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0033_0011.jpg?sign=1739302559-ljcOKIYLzwIVfW5cAHCHal1NP2EAAyzs-0-b558f021c12fa59bc97afcec066e74dd)
图2-13
● 【平滑】模式可以平滑所绘制的曲线,使曲线的线条更加光滑,如图2-14所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0033_0012.jpg?sign=1739302559-IUVvbl2DAl0gr4cUzPKfOOEfRRvh7Fpr-0-7c4aa1e8594040408dd46e214f79a1d9)
图2-14
● 【墨水】模式对绘制的图形不进行任意加工,使绘制的线条保持原样,如图2-15所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0033_0013.jpg?sign=1739302559-DWWAKhi9Z8ZfS2zoknAXwNa0tZfCGx6p-0-8bdf6926969e0d6c9b5bb5eb5cb23a73)
图2-15
3.【钢笔工具】
【钢笔工具】可以绘制光滑、精确的曲线,同时可以通过调整曲线的曲率改变曲线的形态。
【任务3】使用【钢笔工具】绘制曲线。
Step 1 激活【钢笔工具】,在舞台中单击创建锚点,创建由转换角连接的直线段组成的路径,如图2-16所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0034_0003.jpg?sign=1739302559-DbxlWfXVz2GNuyTvQ8RGC7MuH0jg7rsT-0-7b189f1973efda02cf109715827612f4)
图2-16
Step 2 打开【属性】面板,设置笔触颜色、笔触高度、笔触样式等,如图2-17所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0034_0004.jpg?sign=1739302559-mU51wGppkMNj1kdESrvVdZibedw66zcI-0-a6b0eed5bfa3b6d48af036a81229604c)
图2-17
Step 3 在舞台上单击创建锚点,创建由转换角连接的直线段组成的路径,如图2-18所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0034_0005.jpg?sign=1739302559-CI4JJC2XriEUbWMXvPtxH7nG4tsQ3X5k-0-a2c207a23965d8b3acea51e96a9f2fce)
图2-18
Step 4 如果要创建曲线,则可以在创建第2个锚点时按住鼠标左键拖曳,此时出现控制曲线的调节杆,调节杆控制曲线的曲率,依次绘制曲线,如图2-19所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0034_0007.jpg?sign=1739302559-Qwl9hHQ45GN2doyzUsRSznai0Oae0egA-0-99ef2b5bd2d92f985b0ea5c318e64c23)
图2-19
Step 5 此外,也可以激活【转换锚点工具】,在有转换角的锚点上按住鼠标拖曳,拖出调节杆,继续拖曳鼠标指针,调整曲线的曲率,将转换角曲线调整为平滑曲线,如图2-20所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0034_0008.jpg?sign=1739302559-vW7iyB1Ipw9d3pHXKpI8Sm59YK81VMyZ-0-b82db0c37d8aea1719c03ba72cd03de0)
图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=1739302559-4pIse5YJSvKNwasizGrBiMVhnBnchGup-0-73af13140f886d61c3e8e5dcb7434ee2)
图2-21
Step 2 打开【属性】面板,设置图形的填充颜色、笔触颜色、宽度以及样式等,如图2-22所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0035_0007.jpg?sign=1739302559-sHdmhutYBG3GxcrAZ3bnuj8R7uyHRQ3C-0-4f4354733456a5000faaac2976047385)
图2-22
Step 3 设置完毕后,继续在舞台中拖曳鼠标指针即可绘制圆或椭圆,如果设置了【开始角度】、【结束角度】以及【内径】等选项,则可以绘制半圆或半圆弧,结果如图2-23所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0035_0008.jpg?sign=1739302559-s0O3ch7h5V7QSGAYGA3O3KGOp9aiNTUO-0-c3e0b2f8e6f04a4dc356ed37f7e5bd8a)
图2-23
Step 4 使用【基本椭圆工具】绘制的圆包含节点,可以使用【选择工具】
拖曳节点进行调整,也可以在【属性】面板中设置【开始角度】或【结束角度】,调整圆为饼形图形,如图2-24所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0035_0011.jpg?sign=1739302559-N5EF3NJtXimaDdQWd4KwaKFaWnLyiBAJ-0-99553847c8fec371c58c31b933c64065)
图2-24
2.【矩形工具】与【基本矩形工具】
【矩形工具】与【基本矩形工具】
可以绘制矩形、正方形和圆角矩形。
【任务5】使用【矩形工具】绘制矩形。
Step 1 激活【矩形工具】,在舞台中拖曳鼠标指针,创建矩形图形,如图2-25所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0036_0003.jpg?sign=1739302559-DzzaxeCvqOmmnOzMiY6MllIjKJcwVmqh-0-72cd670408c08048f9da152e1704ad19)
图2-25
Step 2 打开【属性】面板,设置图形的填充颜色、笔触颜色、笔触高度、样式以及圆角度数等,如图2-26所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0036_0004.jpg?sign=1739302559-GXpVgzlwC7mURuG46syelCfkTLuGaL8T-0-bff19cb669e839c0530449549b40e808)
图2-26
Step 3 在舞台中拖曳鼠标指针,即可绘制矩形和圆角矩形,如图2-27所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0036_0005.jpg?sign=1739302559-Jm8tIqrqZ60ZSGqAoDagcTw7mQ733CBM-0-3bf8dc1455700ad49ce067aa368c8580)
图2-27
Step 4 也可以使用【选择工具】拖曳矩形和圆角矩形上的节点,改变矩形和圆角矩形的形态,如图2-28所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0036_0007.jpg?sign=1739302559-mWMVSn518tNZ3tr2nnzvCgSfyOwJwJOw-0-9f50c2465585ffc126aa6003e0310eaa)
图2-28
3.【多角星形工具】
【多角星形工具】用于绘制多边形和星形。
【任务6】使用【多角星形工具】绘制星形图形。
Step 1 激活【多角星形工具】,在舞台中拖曳鼠标指针,创建星形图形,如图2-29所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0037_0003.jpg?sign=1739302559-wnydThfTvMtzfWqDEwft8A4wbTP5NWBT-0-99b35105f88d5f5d596a02ec6eec2933)
图2-29
Step 2 打开【属性】面板,设置图形的填充颜色、笔触颜色、笔触高度、样式以及圆角度数等。
Step 3 单击【选项】按钮,在打开的【工具选项】对话框中设置多边形的边数、样式等,如图2-30所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0037_0004.jpg?sign=1739302559-5GNSecyWuR3DwKGApuQ54Cn8jsPa5aJ2-0-1f3b05b24302fe6f8bbb248b2a02e909)
图2-30
Step 4 设置完成后,在舞台拖曳鼠标指针,即可绘制多边形或星形,如图2-31所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0037_0005.jpg?sign=1739302559-vmRIgoa3o7hP7tEpINAq5V1zRmMp9kG1-0-4d2c3f3bda3832149279fde7206b8ae9)
图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=1739302559-IxhFtltctUaTWKkTQ2UaZXvOVwpJSGFV-0-f7c52030e86351efbce332f7504fbdb0)
图2-32
Step 2 打开【属性】面板,设置颜色和平滑度等,如图2-33所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0038_0001.jpg?sign=1739302559-J89pzB8sjJhr9DpiyScJOmm0eTW5zVhy-0-1c9ce603d8bff6623d65e8bdb5e5457f)
图2-33
Step 3 在舞台中拖曳鼠标指针,即可绘制特殊图形,如图2-34所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0038_0002.jpg?sign=1739302559-UuBw4hjxVBmX4rCBcXnMnrJgGmLGv3l5-0-f1944fe1e02a398714352cd25b7291d5)
图2-34
Step 4 另外,激活【刷子工具】后,还可以在工具栏下方选择刷子形状、设置刷子大小以及设置刷子模式,如图2-35所示。其模式包括【标准绘制】
、【颜料填充】
、【后面绘画】
、【颜料选择】
以及【内部绘画】
,具体如下。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0038_0003.jpg?sign=1739302559-ItIiLCUXnr8uhCbE8TX8Cxvz8rTB6pGp-0-457f087c23454faa7a18ef3c5719a789)
图2-35
● 【标准绘制】:笔刷经过的地方,线条和填充全部被笔刷填充所覆盖,如图2-36所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0038_0007.jpg?sign=1739302559-Zx1PQPZyWWOVsNSEuW22vxwwDWcG8X5d-0-ea942b0a84af314bb860189cb88338ec)
图2-36
● 【颜料填充】:笔刷只将鼠标指针经过的填充进行覆盖,对线条不起作用,如图2-37所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0038_0008.jpg?sign=1739302559-EPMKYJzKexr1zYzj6kHKhfFXnXfAWxRm-0-12341db20c4d07faea87d3eb69512ec2)
图2-37
● 【后面绘制】:在图像的后面着色,笔刷的笔触可自动放置到图形的后面,不覆盖原有图形,如图2-38所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0038_0009.jpg?sign=1739302559-qo2i2GU0outhKmFGhGkJdZlElsHVrxpK-0-3649c89d934f62b4bf139376a071c9a6)
图2-38
● 【颜料选择】:在选定的区域着色,只有用选择工具选取的部分才可以着色,如图2-39所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0038_0012.jpg?sign=1739302559-djJcJak26gwDCP3QSkDUg5Gf5ZLBbaHY-0-8001839b77e3debe22094cb88e478611)
图2-39
● 【内部绘画】:刷子的笔触只能在完全闭合的区域绘画,不会对其他区域着色。
2.【喷涂刷工具】
【喷涂刷工具】用于在舞台上随机喷涂默认形状或元件,该工具类似于粒子喷涂器,可以一次将形状图案喷涂到舞台上。
【任务8】使用【喷涂刷工具】绘制图形。
Step 1 激活【喷涂刷工具】,在舞台中拖曳鼠标指针创建图形,默认情况下,【喷涂刷工具】使用当前选择的填充颜色喷射粒子点,如图2-40所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0038_0017.jpg?sign=1739302559-kVtNuKZmS36ZqUNgbMGdPTWq40doALlq-0-034e3a820a8e71fae66e134fc1989a4d)
图2-40
Step 2 打开【属性】面板,设置喷涂方法、颜色,画笔宽度、高度、角度等,如图2-41所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0039_0001.jpg?sign=1739302559-GnzOKVIkRvosSZvtD4a3AJNmybPAe3HF-0-f0277211cd375158bb89b5311b21bc38)
图2-41
Step 3 如果启用【随机缩放】选项,则喷涂的粒子点会随机发生大小以及位置的变化,如图2-42所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0039_0002.jpg?sign=1739302559-t60Pxa2I4SNLt9cMT7mSqL8B9HfNbeoB-0-74e1670a582b3287c3384eb96ddf6197)
图2-42
Step 4 另外,该工具还可以对任何影片进行剪辑或将图形元件作为图案进行应用,方法是:创建任意图形的元件,如创建一个星形图形,按【F8】键将其转换为元件,如图2-43所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0039_0004.jpg?sign=1739302559-tNXWYz48sreXBTSs2dBD91OY4czt2J41-0-5c1065281aad8995c64cd95ec416b008)
图2-43
Step 5 激活【喷涂刷工具】,在其【属性】面板单击【编辑】按钮,在打开的【选择元件】对话框选择创建的“元件1”,如图2-44所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0039_0005.jpg?sign=1739302559-0ev88Iqm1TYaAwIunHO4SV1bFrtEc7zf-0-525e0438915ec039f8488733a9dcc410)
图2-44
Step 6 单击按钮确认,然后在舞台上拖曳鼠标指针即可喷涂该元件,结果如图2-45所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0040_0001.jpg?sign=1739302559-OeB8qxm5lJRqBBXrzi1hLvZ3ScGdyFFK-0-2de1c5bf60dd11780ab3c514f9223513)
图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=1739302559-FjFvwQF74qRZ5ZiEUEwFeLbfIsmkTs4K-0-e9c66e93470dc92097ff82b9c77c4c93)
图2-46
Step 2 打开【属性】面板,在【绘制效果】组中单击【藤蔓式填充】下拉按钮,在弹出的下拉列表中有多种填充效果供选择,如图2-47所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0040_0008.jpg?sign=1739302559-SlDcFMnSxBel6BbUU7qzeYAR3IMPFbH7-0-4dee8484e80dcb16ba0e723e4c8dd572)
图2-47
Step 3 选择不同的填充模式,则可以进行相关设置,然后绘制不同的填充效果,如图2-48所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0040_0009.jpg?sign=1739302559-3s3lofAbuie1IBsjSCgpJroR8yIHOgud-0-b28fbba31078281d23f1c47fb5d56d16)
图2-48
Step 4 单击【编辑】按钮,在打开的【选择元件】对话框选择创建的“元件1”,如图2-49所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0041_0002.jpg?sign=1739302559-jlZyvFk3LWZL2Yt2aT4rWCrNWA2gejVd-0-1993947a8e94e7f416d4ced93934bec9)
图2-49
Step 5 单击按钮确认,然后在舞台上拖曳鼠标指针即可喷涂由该元件所组成的图案,如图2-50所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0041_0003.jpg?sign=1739302559-NdStcRvjuqZFosfwu2BA6ugdqXbnLUUN-0-e937e9a511245a03761f75a09a944fd4)
图2-50
Step 6 当选择【火焰动画】绘制效果后,在舞台中拖曳鼠标指针,即可创建一个火焰动画,如图2-51所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0041_0004.jpg?sign=1739302559-eFCadljIt2hzz7MBLAJmojFJVb1ePOZ3-0-1b328caabe9fb16ff4568f928bc1c57c)
图2-51