![边用边学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=1739273052-hmo1P2jFJQGmv1NIZwgHofr0HYbXt7EP-0-c0bc65b45b2472b5e75f9cb44394def9)
图2-8
Step 2 打开【属性】面板,可以设置线条的笔触颜色、笔触高度、笔触样式等,如图2-9所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0032_0013.jpg?sign=1739273052-0s2mh8MbRrVfMrl7w9qq5IAjfduRoMRA-0-ceeed84b9f076b27ea54d6ab8c6594a3)
图2-9
Step 3 设置完成后,即可绘制不同高度、不同颜色和不同样式的线条,如图2-10所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0033_0001.jpg?sign=1739273052-iCoOWIVc1DVG91B2HesubKX7TGxl9XnU-0-7ffc04e695cee36ccfbc1aa43e16917f)
图2-10
2.【铅笔工具】
【铅笔工具】用于绘制不规则的曲线或者直线。
【任务2】使用【铅笔工具】绘制线条。
Step 1 激活【铅笔工具】,在舞台中拖曳鼠标指针,绘制线条,如图2-11所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0033_0006.jpg?sign=1739273052-nyEGAQCSQkpVVB4MZu8CRaDFcFKYStXY-0-3bdec323658f6f3afd49fda6c7033650)
图2-11
Step 2 打开【属性】面板,设置铅笔的笔触颜色、笔触高度、笔触样式等,如图2-12所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0033_0007.jpg?sign=1739273052-1T0bZnl5KLro9gxAB065NhMCxzkHJPqi-0-97c773d70ea44fd5c011d74ddae73509)
图2-12
另外,还可以在工具栏下方选择使用何种模式进行绘制,包括【伸直】、【平滑】和【墨水】3种模式。
● 【伸直】模式可以自动规则绘制的的曲线,使其贴近规则曲线,只要勾勒出图像的大致轮廓,系统会自动将图形转化为接近的规则图形,如图2-13所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0033_0011.jpg?sign=1739273052-59ZAdqUU4utdedlYjfVKNLI4Eql3CElw-0-8c06b10348c3d0bb18c98d2af09a0aa8)
图2-13
● 【平滑】模式可以平滑所绘制的曲线,使曲线的线条更加光滑,如图2-14所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0033_0012.jpg?sign=1739273052-GgPRTgZF8Qb1KIPgyqJTgwCcKGBbKftg-0-d276115e1a89a6e6fbbe21530dc15a85)
图2-14
● 【墨水】模式对绘制的图形不进行任意加工,使绘制的线条保持原样,如图2-15所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0033_0013.jpg?sign=1739273052-FSG1AtjAyVIftaEqXTPsEcmhCy5VWu9Y-0-726d8ad067a23e0a8e95d708debd078a)
图2-15
3.【钢笔工具】
【钢笔工具】可以绘制光滑、精确的曲线,同时可以通过调整曲线的曲率改变曲线的形态。
【任务3】使用【钢笔工具】绘制曲线。
Step 1 激活【钢笔工具】,在舞台中单击创建锚点,创建由转换角连接的直线段组成的路径,如图2-16所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0034_0003.jpg?sign=1739273052-byqG04cge5be4tQoqrH9pt2Lu3qkorOM-0-99ecb6b5c3ef59dc64e79e80c2234bde)
图2-16
Step 2 打开【属性】面板,设置笔触颜色、笔触高度、笔触样式等,如图2-17所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0034_0004.jpg?sign=1739273052-LIWELZrlzzWcHNz1nRPhw1Qq1lWAOehT-0-598478af139197a28e4c8e97db3f6547)
图2-17
Step 3 在舞台上单击创建锚点,创建由转换角连接的直线段组成的路径,如图2-18所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0034_0005.jpg?sign=1739273052-iYiGld43ygHy3rjx8F7tMUsUi0YQ6GyQ-0-96fa8e7a0b3789cbba1c612dcfbbd31f)
图2-18
Step 4 如果要创建曲线,则可以在创建第2个锚点时按住鼠标左键拖曳,此时出现控制曲线的调节杆,调节杆控制曲线的曲率,依次绘制曲线,如图2-19所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0034_0007.jpg?sign=1739273052-Fhazf1GNXGLG76pb39BKVfGyDmFcJWZk-0-43597198f051dfe87c0ef7017ffab32a)
图2-19
Step 5 此外,也可以激活【转换锚点工具】,在有转换角的锚点上按住鼠标拖曳,拖出调节杆,继续拖曳鼠标指针,调整曲线的曲率,将转换角曲线调整为平滑曲线,如图2-20所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0034_0008.jpg?sign=1739273052-HQbfxN6QFfQ5za1SAdZW8jsvRtSPmmBE-0-803f64320dc84dd23a6356efc1f11086)
图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=1739273052-YYJvsV6LpbBblxnxaqwRzFMdXfjKfGtY-0-c50eee42d29f1cbccf81fa3c0046dc59)
图2-21
Step 2 打开【属性】面板,设置图形的填充颜色、笔触颜色、宽度以及样式等,如图2-22所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0035_0007.jpg?sign=1739273052-5K9P4mwakxB8isqvenBSuFsXzyfKSYKO-0-725b00cf3b004fea3d685fb6385514d2)
图2-22
Step 3 设置完毕后,继续在舞台中拖曳鼠标指针即可绘制圆或椭圆,如果设置了【开始角度】、【结束角度】以及【内径】等选项,则可以绘制半圆或半圆弧,结果如图2-23所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0035_0008.jpg?sign=1739273052-stKhihamkGlZIab8tEsrNG1I4dhxyCwR-0-d8b977b3e96a118e2cdb8b1a269fd682)
图2-23
Step 4 使用【基本椭圆工具】绘制的圆包含节点,可以使用【选择工具】
拖曳节点进行调整,也可以在【属性】面板中设置【开始角度】或【结束角度】,调整圆为饼形图形,如图2-24所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0035_0011.jpg?sign=1739273052-1KnIgS72WC2Xlngg4FlhWLmUWKlyOvtn-0-002371bcd4d0c73e672e0aa039e2c482)
图2-24
2.【矩形工具】与【基本矩形工具】
【矩形工具】与【基本矩形工具】
可以绘制矩形、正方形和圆角矩形。
【任务5】使用【矩形工具】绘制矩形。
Step 1 激活【矩形工具】,在舞台中拖曳鼠标指针,创建矩形图形,如图2-25所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0036_0003.jpg?sign=1739273052-XBt8YeZA4MacUIHflZdsW07K5se7HZgZ-0-28435d76f2ef5f82b1f602ac8dcbdcb9)
图2-25
Step 2 打开【属性】面板,设置图形的填充颜色、笔触颜色、笔触高度、样式以及圆角度数等,如图2-26所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0036_0004.jpg?sign=1739273052-eiq8daTJwgJi0K7NP2PSVV6baqPo5D3y-0-b354dfc5f0acc786397cc2b83759804f)
图2-26
Step 3 在舞台中拖曳鼠标指针,即可绘制矩形和圆角矩形,如图2-27所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0036_0005.jpg?sign=1739273052-an47BPO85E2q71HALYjNaoZjiHuilM01-0-53e91291d5f524a4d103c206761f24d1)
图2-27
Step 4 也可以使用【选择工具】拖曳矩形和圆角矩形上的节点,改变矩形和圆角矩形的形态,如图2-28所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0036_0007.jpg?sign=1739273052-uK2yseMc2MnYja8VNjOrWmDkLjmabQIn-0-bf7d25b7954439e442d6c8d327a2aef7)
图2-28
3.【多角星形工具】
【多角星形工具】用于绘制多边形和星形。
【任务6】使用【多角星形工具】绘制星形图形。
Step 1 激活【多角星形工具】,在舞台中拖曳鼠标指针,创建星形图形,如图2-29所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0037_0003.jpg?sign=1739273052-QqpKTZS7cGX9PFBHYFbYJ3gZVGi5tBdm-0-1e64308d88a4dd27df014f125c888272)
图2-29
Step 2 打开【属性】面板,设置图形的填充颜色、笔触颜色、笔触高度、样式以及圆角度数等。
Step 3 单击【选项】按钮,在打开的【工具选项】对话框中设置多边形的边数、样式等,如图2-30所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0037_0004.jpg?sign=1739273052-88D1L0ZUfKODkstmdF3NlpFox1mjeIgi-0-73455682d859d923a4bbd46395453cad)
图2-30
Step 4 设置完成后,在舞台拖曳鼠标指针,即可绘制多边形或星形,如图2-31所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0037_0005.jpg?sign=1739273052-p7sxftACpYb1Qu76SS9rbkZI4J2kegLs-0-aa00af4867ed258dc9f2c1264c0c0c17)
图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=1739273052-aTaITxTKF6t451mGsPzeZuejfBfmG5hg-0-7428c006c44f725bd1cdffe69bb4924c)
图2-32
Step 2 打开【属性】面板,设置颜色和平滑度等,如图2-33所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0038_0001.jpg?sign=1739273052-wED84NxRP4wd1j1Rl1tmXKuwoYWGKaJW-0-dc821dfaa21fa2305c301cdae6553356)
图2-33
Step 3 在舞台中拖曳鼠标指针,即可绘制特殊图形,如图2-34所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0038_0002.jpg?sign=1739273052-wAGbfQzhQqHQvns3hzCtCOGi34S5HPaP-0-0c895c2c7032144947213a5fd86f5a3b)
图2-34
Step 4 另外,激活【刷子工具】后,还可以在工具栏下方选择刷子形状、设置刷子大小以及设置刷子模式,如图2-35所示。其模式包括【标准绘制】
、【颜料填充】
、【后面绘画】
、【颜料选择】
以及【内部绘画】
,具体如下。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0038_0003.jpg?sign=1739273052-cE9sER1IZFTB8PbLlMXDgcbkjde9aCI5-0-a0585c34c5e7ac2c4fdd81cbe4164e50)
图2-35
● 【标准绘制】:笔刷经过的地方,线条和填充全部被笔刷填充所覆盖,如图2-36所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0038_0007.jpg?sign=1739273052-sAa1deNGKbYDzPzKmnKnaUQc4df8Tltb-0-282fbfaa6096b8aa7740924a412f4be3)
图2-36
● 【颜料填充】:笔刷只将鼠标指针经过的填充进行覆盖,对线条不起作用,如图2-37所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0038_0008.jpg?sign=1739273052-chkhIRw6QN7lNAghXdzOxMDx5lOCbqzu-0-776b1d0f3b739677460700c172779af2)
图2-37
● 【后面绘制】:在图像的后面着色,笔刷的笔触可自动放置到图形的后面,不覆盖原有图形,如图2-38所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0038_0009.jpg?sign=1739273052-TTjKA8IWvyLFEjCzvlm5kyTzuSUEWO3Q-0-7be5a34d0f3075dc42172f57f996eee6)
图2-38
● 【颜料选择】:在选定的区域着色,只有用选择工具选取的部分才可以着色,如图2-39所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0038_0012.jpg?sign=1739273052-8qclCXKBAA2jxrlDP5dmaP6b9H6cjGc2-0-93072c8bf90f981a953b9f2612605c31)
图2-39
● 【内部绘画】:刷子的笔触只能在完全闭合的区域绘画,不会对其他区域着色。
2.【喷涂刷工具】
【喷涂刷工具】用于在舞台上随机喷涂默认形状或元件,该工具类似于粒子喷涂器,可以一次将形状图案喷涂到舞台上。
【任务8】使用【喷涂刷工具】绘制图形。
Step 1 激活【喷涂刷工具】,在舞台中拖曳鼠标指针创建图形,默认情况下,【喷涂刷工具】使用当前选择的填充颜色喷射粒子点,如图2-40所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0038_0017.jpg?sign=1739273052-6iAdY9LaalR1iuachJQJCAke5ycuc0GQ-0-fa018f6fee4f61f889ac371ff90622c0)
图2-40
Step 2 打开【属性】面板,设置喷涂方法、颜色,画笔宽度、高度、角度等,如图2-41所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0039_0001.jpg?sign=1739273052-GdHslKiOTPut6njfN7trgmlujWbPPlN5-0-b8dcfa097eb1b21715367746a5ea5b74)
图2-41
Step 3 如果启用【随机缩放】选项,则喷涂的粒子点会随机发生大小以及位置的变化,如图2-42所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0039_0002.jpg?sign=1739273052-smIjiwGM74QSiuXAmcicpzDmsuUWoXDg-0-279bb4637d7c03bd35ae6d7b24a49cdb)
图2-42
Step 4 另外,该工具还可以对任何影片进行剪辑或将图形元件作为图案进行应用,方法是:创建任意图形的元件,如创建一个星形图形,按【F8】键将其转换为元件,如图2-43所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0039_0004.jpg?sign=1739273052-N4j9s3jSrutbnOSnLvRs4sERMpEcmtyB-0-9a8f2c4529269e3e3dbbe03b72d039e2)
图2-43
Step 5 激活【喷涂刷工具】,在其【属性】面板单击【编辑】按钮,在打开的【选择元件】对话框选择创建的“元件1”,如图2-44所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0039_0005.jpg?sign=1739273052-hrsnDwWVSX6IPcCZbqQWilPmXASYDMQK-0-c040da6813b9ecc53b59059d2f3c2d72)
图2-44
Step 6 单击按钮确认,然后在舞台上拖曳鼠标指针即可喷涂该元件,结果如图2-45所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0040_0001.jpg?sign=1739273052-YJlSaCITZNEqts2JUjJvvYw7x5gWfbGk-0-c0da8aa4398e18da35d40080b6150494)
图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=1739273052-zL07WQkncp0r3Sx6R3aM1BMFw0zLjsSZ-0-8f3c59c8fe46483f5f55f2067b6409db)
图2-46
Step 2 打开【属性】面板,在【绘制效果】组中单击【藤蔓式填充】下拉按钮,在弹出的下拉列表中有多种填充效果供选择,如图2-47所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0040_0008.jpg?sign=1739273052-nhqzBT2stu2pTI0sHX47u1AjziBSqpnJ-0-b2c9987cc93584e155889cc608bf6c0f)
图2-47
Step 3 选择不同的填充模式,则可以进行相关设置,然后绘制不同的填充效果,如图2-48所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0040_0009.jpg?sign=1739273052-pBIvcmhwhomGFGZbB5KPu36qGCbyqsWU-0-802c0ad1ee42b4b4fb86b6be74c5c846)
图2-48
Step 4 单击【编辑】按钮,在打开的【选择元件】对话框选择创建的“元件1”,如图2-49所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0041_0002.jpg?sign=1739273052-O5LNMHWoJZ0QLQ7QsAjyFmNWqWEXgSJd-0-ebfc42eef9d71d7d2c8c743c1eb4f35a)
图2-49
Step 5 单击按钮确认,然后在舞台上拖曳鼠标指针即可喷涂由该元件所组成的图案,如图2-50所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0041_0003.jpg?sign=1739273052-ZeBTyWxyk1oDrgVhBs684vDZBhIthH9t-0-f554b485335a504d0173528e1ef02f46)
图2-50
Step 6 当选择【火焰动画】绘制效果后,在舞台中拖曳鼠标指针,即可创建一个火焰动画,如图2-51所示。
![](https://epubservercos.yuewen.com/5BB0C4/11229190603864706/epubprivate/OEBPS/Images/figure_0041_0004.jpg?sign=1739273052-JztbHcy97TuWakaQdAWn6Wa2Vn4LwsnO-0-6f7095d950de614511a78c9db6c01f7f)
图2-51