第2 章 图形的绘制与编辑

第2章 图形的绘制与编辑

本章将介绍Flash CC绘制图形的功能和编 辑图形的技巧,详细讲解多种选择图形的方法以 及设置图形色彩的技巧。通过对本章的学习,读 者可以掌握绘制图形、编辑图形的方法和技巧, 能独立绘制出所需的各种图形效果并对其进行编 辑,为进一步学习Flash CC打下坚实的基础。

课堂学习目标

  • 掌握基本线条与图形的绘制
  • 熟练掌握多种图形编辑工具的使用方法和技巧
  • 了解图形的色彩,并掌握几种常用的色彩面板

2.1 基本线条与图形的绘制

在Flash CC中设计的充满活力的作品都是由基本图形组成的,Flash CC提供了各种工具来绘制线条和图形。

2.1.1 课堂案例——绘制青蛙卡片

案例学习目标

使用不同的绘图工具绘制图形并组合成图像效果。

案例知识要点

使用“铅笔”工具和“颜料桶”工具,绘制白云和飘带图形;使用“椭圆”工具,绘制脸部和眼睛,效果如图2-1所示。

效果所在位置

资源包/Ch02/效果/绘制青蛙卡片.fla。

图像说明文字

图2-1

1.新建文档并绘制白云

STEP 1 选择“文件 > 新建”命令,在弹出的“新建文档”对话框中选择“ActionScript 3.0”选项,将“宽”选项设为198,“高”选项设为283,将“背景颜色”颜色设为浅黄色(#F4E8DA),如图2-2所示,单击“确定”按钮,完成文档的创建,如图2-3所示。

图像说明文字

绘制青蛙卡片1

02002.tif

图2-2

02003.tif

图2-3

STEP 2  按Ctrl+F8组合键,弹出“创建新元件”对话框,在“名称”选项的文本框中输入“白云”,在“类型”选项下拉列表中选择“图形”选项,如图2-4所示,单击“确定”按钮,新建图形元件“白云”,如图2-5所示。舞台窗口也随之转换为图形元件的舞台窗口。

02004.tif

图2-4

02005.tif

图2-5

STEP 3 选择“铅笔”工具02tb001.tif,在工具箱中将“笔触颜色”设为黑色,并在工具箱下方的“铅笔模式”选项组的下拉菜单中选中“平滑”选项02tb002.tif。在舞台窗口中绘制出1条闭合曲线,效果如图2-6所示。

图像说明文字

图2-6

STEP 4  选择“颜料桶”工具02tb003.tif,在工具箱中将“填充颜色”设为白色,在闭合曲线的内部单击鼠标填充颜色,效果如图2-7所示。选择“选择”工具02tb004.tif,双击边线将其选中,如图2-8所示,按Delete键将其删除,效果如图2-9所示。

02007.tif

图2-7

02008.tif

图2-8

02009.tif

图2-9

2.绘制脸部图形

STEP 1  单击文档窗口左上方的“场景1”图标02tb005.tif,进入“场景1”的舞台窗口中。将“图层1”重命名为“白云1”,如图2-10所示。将“库”面板中的图形元件“白云”向舞台窗口中拖曳多次并调整适当的大小与角度,效果如图2-11所示。

图像说明文字

绘制青蛙卡片2

02010.tif

图2-10

02011.tif

图2-11

STEP 2  单击“时间轴”面板下方的“新建图层”按钮02tb006.tif,创建新图层并将其命名为“脸蛋”。选择“椭圆”工具02tb007.tif,在工具箱中将“笔触颜色”设为无,“填充颜色”设为红色(#E60027),选中工具箱下方的“对象绘制”按钮02tb008.tif,按住Shift键的同时在舞台窗口中绘制1个圆形,效果如图2-12所示。

STEP 3  单击“时间轴”面板下方的“新建图层”按钮02tb006.tif,创建新图层并将其命名为“眼睛”。按住Shift键的同时在舞台窗口中绘制1个圆形,效果如图2-13所示。在工具箱中将“填充颜色”设为白色,按住Shift键的同时在舞台窗口中绘制1个白色的圆形,效果如图2-14所示。

02012.tif

图2-12

02013.tif

图2-13

02014.tif

图2-14

STEP 4  在工具箱中将“填充颜色”设为黑色,按住Shift键的同时在舞台窗口中绘制1个黑色的圆形,效果如图2-15所示。在工具箱中将“填充颜色”设为白色,按住Shift键的同时在舞台窗口中绘制两个白色的圆形,效果如图2-16所示。用相同的方法绘制出如图2-17所示的效果。

STEP 5  单击“时间轴”面板下方的“新建图层”按钮02tb006.tif,创建新图层并将其命名为“嘴和装饰”。选择“线条”工具02tb009.tif,在线条工具“属性”面板中,将“笔触颜色”设为黑色,“笔触”选项设为1,在舞台窗口中绘制1条直线,如图2-18所示。

02015.tif

图2-15

02016.tif

图2-16

02017.tif

图2-17

STEP 6   选择“选择”工具01tb01.tif,将鼠标光标放置在直线的中心部位,当鼠标光标变为02tb010.tif时,如图2-19所示,单击鼠标并向下拖曳到适当的位置,将直线转换为弧线,效果如图2-20所示。

02018.tif

图2-18

02019.tif

图2-19

02020.tif

图2-20

STEP 7  选择“椭圆”工具02tb011.tif,在工具箱中将“笔触颜色”设为无,“填充颜色”设为肉色(#F3A7A3),选中工具箱下方的“对象绘制”按钮02tb012.tif,按住Shift键的同时在舞台窗口中绘制1个圆形,效果如图2-21所示。

STEP 8  选择“选择”工具02tb013.tif,选中圆形,按住Alt键的同时拖曳鼠标到适当的位置,复制圆形,效果如图2-22所示。按3次Ctrl+Y组合键,重复复制圆形,效果如图2-23所示。

02021.tif

图2-21

02022.tif

图2-22

02023.tif

图2-23

STEP 9  选择“铅笔”工具02tb015.tif,在工具箱中将“笔触颜色”设为黑色,并在工具箱下方的“铅笔模式”选项组的下拉菜单中选中“平滑”选项02tb002.tif。在舞台窗口中绘制出1条闭合曲线,效果如图2-24所示。

STEP 10  选择“颜料桶”工具02tb028.tif,在工具箱中将“填充颜色”设为黄色(#FABE00),在闭合曲线的内部单击鼠标填充颜色,效果如图2-25所示。选择“选择”工具01tb01.tif,双击边线将其选中,按Delete键将其删除,效果如图2-26所示。

02024.tif

图2-24

02025.tif

图2-25

02026.tif

图2-26

3.导入素材绘制小山

STEP 1  单击“时间轴”面板下方的“新建图层”按钮02tb022.tif,创建新图层并将其命名为“文字”。选择“文件 > 导入 > 导入到舞台”命令,在弹出的“导入”对话框中选择“Ch02 > 素材 > 绘制青蛙卡片 > 01”文件,单击“打开”按钮,弹出“Adobe Flash Professional”对话框,单击“否”按钮,弹出“将“01”.ai导入到舞台”对话框,单击“确定”按钮,图像被导入到舞台窗口中,如图2-27所示。

图像说明文字

绘制青蛙卡片3

STEP 2  单击“时间轴”面板下方的“新建图层”按钮02tb022.tif,创建新图层并将其命名为“下体”。选择“文件 > 导入 > 导入到库”命令,在弹出的“导入到库”对话框中选择“Ch02 > 素材 > 绘制青蛙卡片 > 02、03”文件,单击“打开”按钮,弹出提示对话框,单击“确定”按钮,图像被导入到“库”面板中,如图2-28所示。将“库”面板中的图形元件“03”拖曳到舞台窗口中,并放置在适当的位置,如图2-29所示。

02027.tif

图2-27

02028.tif

图2-28

02029.tif

图2-29

STEP 3  单击“时间轴”面板下方的“新建图层”按钮02tb022.tif,创建新图层并将其命名为“白云2”。将“库”面板中的图形元件“白云”向舞台窗口中拖曳两次,并分别调整其大小及角度,效果如图2-30所示。

STEP 4  单击“时间轴”面板下方的“新建图层”按钮02tb022.tif,创建新图层并将其命名为“降落伞”。将“库”面板中的图形元件“02”拖曳到舞台窗口中,如图2-31所示。

02030.tif

图2-30

02031.tif

图2-31

STEP 5  单击“时间轴”面板下方的“新建图层”按钮02tb022.tif,创建新图层并将其命名为“小山”。选择“线条”工具02tb014.tif,在线条工具“属性”面板中,将“笔触颜色”设为黑色,“笔触”选项设为1,在舞台窗口中绘制两条直线和一条斜线,使斜线和直线形成闭合路径,效果如图2-32所示。

STEP 6  选择“选择”工具02tb004.tif,将鼠标光标放置在斜线的中心部位,当鼠标光标变为02tb010.tif 时,单击鼠标并向上拖曳到适当的位置,将直线转换为弧线,效果如图2-33所示。

02032.tif

图2-32

02033.tif

图2-33

STEP 7  选择“颜料桶”工具02tb003.tif,在工具箱中将“填充颜色”设为黄绿色(#AB9E4B),在闭合曲线的内部单击鼠标填充颜色,效果如图2-34所示。选择“选择”工具02tb004.tif,双击边线将其选中,按Delete键将其删除,效果如图2-35所示。

02034.tif

图2-34

02035.tif

图2-35

STEP 8  用上述的方法绘制出如图2-36所示的效果。青蛙卡片绘制完成,按Ctrl+Enter组合键即可查看效果,如图2-37所示。

02036.tif

图2-36

02037.tif

图2-37

2.1.2 线条工具

选择“线条”工具02tb014.tif,在舞台上单击鼠标,按住鼠标左键不放并向右拖动到需要的位置,绘制出一条直线,松开鼠标,直线效果如图2-38所示。可以在直线工具“属性”面板中设置不同的线条颜色、线条粗细和线条类型,如图2-39所示。

设置不同的线条属性后,绘制的线条如图2-40所示。

02038.tif

图2-38

02039.tif

图2-39

02040.tif

图2-40

提示


选择“线条”工具时,如果按住Shift键的同时拖动鼠标绘制,则限制线条只能在45°或45°的倍数方向绘制直线。无法为线条工具设置填充属性。

2.1.3 铅笔工具

选择“铅笔”工具02tb015.tif,在舞台上单击鼠标,按住鼠标左键不放,在舞台上随意绘制出线条,松开鼠标,线条效果如图2-41所示。如果想要绘制出平滑或伸直线条和形状,可以在工具箱下方的选项区域中为铅笔工具选择一种绘画模式,如图2-42所示。

02041.tif

图2-41

02042.tif

图2-42

  • “伸直化”选项:可以绘制直线,并将接近三角形、椭圆、圆形、矩形和正方形的形状转换为这些常见的几何形状。

  • “平滑”选项:可以绘制平滑曲线。

  • “墨水”选项:可以绘制不用修改的手绘线条。

可以在铅笔工具“属性”面板中设置不同的线条颜色、线条粗细和线条类型,如图2-43所示。设置不同的线条属性后,绘制的图形如图2-44所示。

单击“属性”面板样式选项右侧的“编辑笔触样式”按钮02tb016.tif,弹出“笔触样式”对话框,如图2-45所示,在对话框中可以自定义笔触样式。

  • “4倍缩放”选项:可以放大4倍预览设置不同选项后所产生的效果。

  • “粗细”选项:可以设置线条的粗细。

  • “锐化转角”选项:勾选此选项可以使线条的转折效果变得明显。

  • “类型”选项:可以在下拉列表中选择线条的类型。

02043.tif

图2-43

02044.tif

图2-44

02045.tif

图2-45

提示


选择“铅笔”工具时,如果按住Shift键的同时拖动鼠标绘制,则可将线条限制为垂直或水平方向。

2.1.4 椭圆工具

选择“椭圆”工具02tb017.tif,在舞台上单击鼠标,按住鼠标左键不放,向需要的位置拖曳,绘制出椭圆图形后松开鼠标,图形效果如图2-46所示。若按住Shift键的同时绘制图形,可以绘制出圆形,效果如图2-47所示。

可以在椭圆工具“属性”面板中设置不同的边框颜色、边框粗细、边框线型和填充颜色,如图2-48所示。设置不同的边框属性和填充颜色后,绘制的图形如图2-49所示。

02046.tif

图2-46

02047.tif

图2-47

02048.tif

图2-48

02049.tif

图2-49

2.1.5 刷子工具

选择“刷子”工具02tb018.tif,在舞台上单击鼠标,按住鼠标左键不放,随意绘制出笔触后松开鼠标,图形效果如图2-50所示。可以在刷子工具“属性”面板中设置不同的笔触颜色和平滑度,如图2-51所示。

02050.tif

图2-50

02051.tif

图2-51

在工具箱的下方应用“刷子大小”选项02tb019.tif、“刷子形状”选项02tb020.tif,可以设置刷子的大小与形状。设置不同的刷子形状后所绘制的笔触效果如图2-52所示。

系统在工具箱的下方提供了5种刷子的模式可供选择,如图2-53所示。

02052.tif

图2-52

02053.tif

图2-53

  • “标准绘画”模式:会在同一层的线条和填充上以覆盖的方式涂色。

  • “颜料填充”模式:对填充区域和空白区域涂色,其他部分(如边框线)不受影响。

  • “后面绘画”模式:在舞台上同一层的空白区域涂色,但不影响原有的线条和填充。

  • “颜料选择”模式:在选定的区域内进行涂色,未被选中的区域不能涂色。

  • “内部绘画”模式:在内部填充上绘图,但不影响线条。如果在空白区域中开始涂色,该填充不会影响任何现有填充区域。

应用不同模式绘制出的效果如图2-54所示。

图像说明文字

图2-54

  • “锁定填充”按钮02tb021.tif:先为刷子选择径向渐变色彩,当没有选择此按钮时,用刷子绘制线条,每个线条都有自己完整的渐变过程,线条与线条之间不会互相影响,如图2-55所示。当选择此按钮时,颜色的渐变过程形成一个固定的区域,在这个区域内,刷子绘制到的地方,就会显示出相应的色彩,如图2-56所示。

02055.tif

图2-55

02056.tif

图2-56

在使用刷子工具涂色时,可以使用导入的位图作为填充。

导入图片,效果如图2-57所示。选择“窗口 > 颜色”命令,弹出“颜色”面板,将“颜色类型”选项设为“位图填充”,用刚才导入的位图作为填充图案,如图2-58所示。选择“刷子”工具02tb018.tif,在窗口中随意绘制一些笔触,效果如图2-59所示。

02057.tif

图2-57

02058.tif

图2-58

02059.tif

图2-59

2.2 图形的绘制与选择

应用绘制工具可以绘制多变的图形与路径。若要在舞台上修改图形对象,则需要先选择对象,再对其进行修改。

2.2.1 课堂案例——绘制网络公司网页标志

案例学习目标

使用不同的绘图工具绘制标志图形。

案例知识要点

使用“文本”工具,输入标志名称;使用“钢笔”工具,添加画笔效果;使用“属性”面板,改变元件的颜色使标志产生阴影效果,如图2-60所示。

效果所在位置

资源包/Ch02/效果/绘制网络公司网页标志.fla。

图像说明文字

图2-60

1.输入文字

STEP 1  选择“文件 > 新建”命令,在弹出的“新建文档”对话框中选择“ActionScript 3.0”选项,将“宽”选项设为500,“高”选项设为350,单击“确定”按钮,完成文档的创建。

图像说明文字

绘制网络公司网页标志1

STEP 2  按Ctrl+L组合键,弹出“库”面板,单击“库”面板下方的“新建元件”按钮02tb022.tif,弹出“创建新元件”对话框,在“名称”选项的文本框中输入“标志”,在“类型”选项的下拉列表中选择“图形”选项,单击“确定”按钮,新建图形元件“标志”,如图2-61所示,舞台窗口也随之转换为图形元件的舞台窗口。

图像说明文字

图2-61

STEP 3  将“图层1”图层重新命名为“文字”。选择“文本”工具02tb023.tif,在文本工具“属性”面板中进行设置,在舞台窗口中适当的位置输入大小为60,字体为“迷你简汉真广标”的蓝色(#0B2C88)文字,文字效果如图2-62所示。选择“选择”工具02tb024.tif,在舞台窗口中选中文字,按两次Ctrl+B组合键,将文字打散,效果如图2-63所示。

02062.tif

图2-62

02063.tif

图2-63

2.添加笔画

STEP 1  单击“时间轴”面板下方的“新建图层”按钮02tb022.tif,创建新图层并将其命名为“钢笔绘制”。选择“钢笔”工具02tb026.tif,在钢笔工具“属性”面板中,将“笔触颜色”设为黑色,在“度”字的右下方单击鼠标,设置起始点,如图2-64所示。在空白处单击鼠标,设置第2个节点,按住鼠标左键不放,向右上拖曳控制手柄,调节控制手柄改变路径的弯度,效果如图2-65所示。使用相同的方法,应用“钢笔”工具02tb026.tif绘制出如图2-66所示的边线效果。

图像说明文字

绘制网络公司网页标志2

02064.tif

图2-64

02065.tif

图2-65

02066.tif

图2-66

STEP 2  在工具箱中将“填充颜色”设为蓝色(#0B2C88)。选择“颜料桶”工具02tb028.tif,在边线内部单击鼠标,填充图形,如图2-67所示。选择“选择”工具02tb029.tif,双击边线将其选中,如图2-68所示,按Delete键将其删除。使用相同的方法,在“升”字的上方绘制图形,效果如图2-69所示。

02067.tif

图2-67

02068.tif

图2-68

02069.tif

图2-69

STEP 3  选择“选择”工具02tb029.tif,在“度”字的上方拖曳出一个矩形,如图2-70所示,松开鼠标,将其选中,按Delete键将其删除,效果如图2-71所示。按住Shift键的同时,选中“升”字左方、“科”字左方和“技”字的左下方的笔画,按Delete键将其删除,效果如图2-72所示。

02070.tif

图2-70

02071.tif

图2-71

02072.tif

图2-72

STEP 4  单击“时间轴”面板下方的“新建图层”按钮02tb025.tif,创建新图层并将其命名为“线条绘制”。选择“椭圆”工具01tb14.tif,在工具箱中将“笔触颜色”设为无,“填充颜色”设为蓝色(#0B2C88),按住Shift键的同时绘制圆形,效果如图2-73所示。选择“选择”工具01tb01.tif,选择圆形,按住Alt键的同时拖曳鼠标到适当的位置,复制圆形,效果如图2-74所示。

02073.tif

图2-73

02074.tif

图2-74

STEP 5  选择“线条”工具01tb12.tif,在线条工具“属性”面板中,将“笔触颜色”设为蓝色(#0B2C88),“笔触”选项设为10,其他选项的设置如图2-75所示。将“升”字绘出如图2-76所示效果。

STEP 6  选择“选择”工具01tb01.tif,选择直线,按住Alt键的同时拖曳光标到适当的位置,复制直线,效果如图2-77所示。用相同的方法再次复制一条直线,效果如图2-78所示。

02075.tif

图2-75

02076.tif

图2-76

02077.tif

图2-77

02078.tif

图2-78

3.制作标志

STEP 1  单击舞台窗口左上方的“场景1”图标02tb031.tif,进入“场景1”的舞台窗口。将“图层1”图层重命名为“底图”。按Ctrl+R组合键,在弹出的“导入”对话框中选择“Ch02 > 素材 > 制作网络公司网页标志 > 01”文件,单击“打开”按钮,文件被导入舞台窗口中,效果如图2-79所示。

图像说明文字

绘制网络公司网页标志3

STEP 2  单击“时间轴”面板下方的“新建图层”按钮01tb30.tif,创建新图层并将其命名为“标志”。将“库”面板中的图形“标志”拖曳到舞台窗口中,效果如图2-80所示。

02079.tif

图2-79

02080.tif

图2-80

STEP 3  选择“选择”工具01tb01.tif,在舞台窗口中选中“标志”实例,在图形“属性”面板中的“样式”选项下拉列表中选择“色调”,各选项的设置如图2-81所示,舞台效果如图2-82所示。

STEP 4  将“库”面板中的图形元件“标志”再次拖曳到舞台窗口中,并将其放置到适当的位置,使标志产生阴影效果,效果如图2-83所示。

02081.tif

图2-81

02082.tif

图2-82

02083.tif

图2-83

STEP 5  单击“时间轴”面板下方的“新建图层”按钮01tb30.tif,创建新图层并将其命名为“英文”。选择“文本”工具02tb023.tif,在文本工具“属性”面板中进行设置,在舞台窗口中适当的位置输入大小为30,字体为“Kunstler Script”的蓝色(#0B2C88)文字,文字效果如图2-84所示。

STEP 6  选择“选择”工具01tb01.tif,选择英文,按住Alt键的同时拖曳光标到适当的位置,复制英文,在工具箱中将“填充颜色”设为白色,效果如图2-85所示。网络公司网页标志效果绘制完成,如图2-86所示。

02084.tif

图2-84

02085.tif

图2-85

02086.tif

图2-86

2.2.2 矩形工具

选择“矩形”工具02tb033.tif,在舞台上单击鼠标,按住鼠标左键不放,向需要的位置拖曳,绘制出矩形图形,松开鼠标,矩形图形效果如图2-87所示。按住Shift键的同时绘制图形,可以绘制出正方形,效果如图2-88所示。

图像说明文字

图2-87

图像说明文字

图2-88

可以在矩形工具“属性”面板中设置不同的边框颜色、边框粗细、边框线型和填充颜色,如图2-89所示。设置不同的边框属性和填充颜色后,绘制的图形如图2-90所示。

02089.tif

图2-89

02090.tif

图2-90

可以应用矩形工具绘制圆角矩形。选择“属性”面板,在“矩形边角半径”选项的数值框中输入需要的数值,如图2-91所示。输入的数值不同,绘制出的圆角矩形也相对不同,效果如图2-92所示。

02091.tif

图2-91

02092.tif

图2-92

2.2.3 多角星形工具

应用多角星形工具可以绘制出不同样式的多边形和星形。选择“多角星形”工具02tb034.tif,在舞台上按住鼠标左键不放,向需要的位置拖曳,绘制出多边形,松开鼠标,多边形效果如图2-93所示。

可以在多角星形工具“属性”面板中设置不同的边框颜色、边框粗细、边框线型和填充颜色,如图2-94所示。设置不同的边框属性和填充颜色后,绘制的图形如图2-95所示。

02093.tif

图2-93

02094.tif

图2-94

02095.tif

图2-95

单击“属性”面板下方的“选项”按钮,弹出“工具设置”对话框,如图2-96所示,在对话框中可以自定义多边形的各种属性。

  • “样式”选项:在此选项中选择绘制多边形或星形。

  • “边数”选项:设置多边形的边数。其选取范围为3~32。

  • “星形顶点大小”选项:输入一个0~1之间的数字以指定星形顶点的深度。此数字越接近0,创建的顶点就越深。此选项在多边形形状绘制中不起作用。

设置不同数值后,绘制出的多边形和星形也相应不同,如图2-97所示。

02096.tif

图2-96

02097.tif

图2-97

2.2.4 钢笔工具

选择“钢笔”工具01tb10.tif,将光标放置在舞台上想要绘制曲线的起始位置,然后按住鼠标左键不放,此时出现第一个锚点,并且钢笔尖光标变为箭头形状,如图2-98所示。松开鼠标,将光标放置在想要绘制的第二个锚点的位置,单击鼠标左键并按住不放,绘制出一条直线段,如图2-99所示。将光标向其他方向拖曳,直线转换为曲线,如图2-100所示。松开鼠标,一条曲线绘制完成,如图2-101所示。

02098.tif

图2-98

02099.tif

图2-99

02100.tif

图2-100

02101.tif

图2-101

用相同的方法可以绘制出多条曲线段组合而成的不同样式的曲线,如图2-102所示。

在绘制线段时,如果按住Shift键,再进行绘制,绘制出的线段将被限制为倾斜45°的倍数,如图2-103所示。

02102.tif

图2-102

02103.tif

图2-103

在绘制线段时,“钢笔”工具02tb035.tif的光标会产生不同的变化,其表示的含义也不同。

  • 增加节点:当光标变为带加号时02tb036.tif,如图2-104所示,在线段上单击鼠标就会增加一个节点,这样有助于更精确地调整线段。增加节点前后效果对照如图2-105所示。

02104.tif

图2-104

02105.tif

图2-105

  • 删除节点:当光标变为带减号时02tb037.tif,如图2-106所示,在线段上单击节点,就会将这个节点删除。删除节点前后效果对照如图2-107所示。

02106.tif

图2-106

02107.tif

图2-107

  • 转换节点:当光标变为带折线时02tb038.tif,如图2-108所示,在线段上单击节点,就会将这个节点从曲线节点转换为直线节点。转换节点前后效果对照如图2-109所示。

02108.tif

图2-108

02109.tif

图2-109

提示


当选择钢笔工具绘画时,若在用铅笔、刷子、线条、椭圆或矩形工具创建的对象上单击,就可以调整对象的节点,以改变这些线条的形状。

2.2.5 选择工具

选择“选择”工具01tb01.tif,工具箱下方会出现图2-110所示的按钮,利用这些按钮可以完成以下工作。

  • “贴紧至对象”按钮02tb039.tif:自动将舞台上两个对象定位到一起,一般制作引导层动画时可利用此按钮将关键帧的对象锁定到引导路径上。此按钮还可以将对象定位到网格上。

  • “平滑”按钮02tb040.tif:可以柔化选择的曲线条。当选中对象时,此按钮变为可用。

  • “伸直”按钮02tb041.tif:可以锐化选择的曲线条。当选中对象时,此按钮变为可用。

1.选择对象

选择“选择”工具01tb01.tif,在舞台中的对象上单击鼠标进行点选,如图2-111所示,点选了头部。按住Shift键,可以同时选中多个对象,如图2-112所示,在选中头部的同时又选中了左手臂和左腿。在舞台中拖曳出一个矩形可以框选对象,如图2-113所示。

02110.tif

图2-110

02111.tif

图2-111

02112.tif

图2-112

02113.tif

图2-113

2.移动和复制对象

选择“选择”工具01tb01.tif,选中对象,如图2-114所示。按住鼠标左键不放,直接将对象拖曳到任意位置,如图2-115所示。

选择“选择”工具01tb01.tif,选中对象,按住Alt键,拖曳选中的对象到任意位置,选中的对象被复制,如图2-116所示。

02114.tif

图2-114

02115.tif

图2-115

02116.tif

图2-116

3.调整向量线条和色块

选择“选择”工具01tb01.tif,将光标移至对象上,光标下方出现圆弧02tb042.tif,如图2-117所示。拖动鼠标,对选中的线条和色块进行调整,如图2-118所示,效果如图2-119所示。

02117.tif

图2-117

02118.tif

图2-118

02119.tif

图2-119

2.2.6 部分选取工具

选择“部分选取”工具02tb043.tif,在对象的外边线上单击,对象上出现多个节点,如图2-120所示。拖动节点来调整控制线的长度和斜率,从而改变对象的曲线形状,如图2-121所示。

02120.tif

图2-120

02121.tif

图2-121

提示


若想增加图形上的节点,可选择“钢笔”工具在图形上单击来增加节点。

在改变对象的形状时,“部分选取”工具02tb043.tif的光标会产生不同的变化,其表示的含义也不同。

带黑色方块的光标02tb044.tif:当光标放置在节点以外的线段上时,光标变为02tb044.tif,如图2-122所示。这时,可以移动对象到其他位置,如图2-123和图2-124所示。

带白色方块的光标02tb045.tif:当光标放置在节点上时,光标变为02tb045.tif,如图2-125所示。这时,可以移动单个的节点到其他位置,如图2-126和图2-127所示。

02122.tif

图2-122

02123.tif

图2-123

02124.tif

图2-124

02125.tif

图2-125

02126.tif

图2-126

02127.tif

图2-127

变为小箭头的光标02tb046.tif:当光标放置在节点调节手柄的尽头时,光标变为02tb046.tif,如图2-128所示。这时,可以调节与该节点相连的线段的弯曲度,如图2-129和图2-130所示。

02128.tif

图2-128

02129.tif

图2-129

02130.tif

图2-130

提示


在调整节点的手柄时,调整一个手柄,另一个相对的手柄也会随之发生变化。如果只想调整其中的一个手柄,按住Alt键,再进行调整即可。

可以将直线节点转换为曲线节点,并进行弯曲度调节。选择“部分选取”工具02tb043.tif,在对象的外边线上单击,对象上显示出节点,如图2-131所示。用鼠标单击要转换的节点,节点从空心变为实心,表示可编辑,如图2-132所示。

按住Alt键,将节点向外拖曳,节点增加出两个可调节手柄,如图2-133所示。应用调节手柄可调节线段的弯曲度,如图2-134所示。

02131.tif

图2-131

02132.tif

图2-132

02133.tif

图2-133

02134.tif

图2-134

2.2.7 套索工具

选择“套索”工具02tb048.tif,在场景中导入一幅位图,按Ctrl+B组合键,将位图进行分离。用鼠标在位图上任意勾选想要的区域,形成一个封闭的选区,如图2-135所示。松开鼠标,选区中的图像被选中,如图2-136所示。

02135.tif

图2-135

02136.tif

图2-136

2.2.8 多边形工具

选择“多边形”工具02tb049.tif,在场景中导入一幅位图,按Ctrl+B组合键,将位图进行分离。在图像上单击鼠标,确定第一个定位点,松开鼠标并将鼠标移至下一个定位点,再单击鼠标,用相同的方法直到勾画出想要的图像,并使选取区域形成一个封闭的状态,如图2-137所示。双击鼠标,选区中的图像被选中,如图2-138所示。

02137.tif

图2-137

02138.tif

图2-138

2.2.9 魔术棒工具

选中“魔术棒”按钮02tb050.tif,在场景中导入一幅位图,按Ctrl+B组合键,将位图进行分离。将光标放在位图上,光标变为02tb051.tif,在要选择的位图上单击鼠标,如图2-139所示。与取点颜色相近的图像区域被选中,如图2-140所示。

可以在魔术棒工具“属性”面板中设置阈值和平滑,如图2-141所示。设置不同数值后,所产生的不同效果如图2-142所示。

02139.tif

图2-139

02140.tif

图2-140

02141.tif

图2-141

图像说明文字

图2-142

2.3 图形的编辑

图形的编辑工具可以改变图形的色彩、线条和形态等属性,可以创建充满变化的图形效果。

2.3.1 课堂案例——绘制新春卡片

案例学习目标

使用不同的绘图工具绘制卡通小羊图形。

案例知识要点

使用“钢笔”工具、“颜料桶”工具,来完成卡通小羊的绘制,如图2-143所示。

效果所在位置

资源包/Ch02/效果/绘制新春卡片.fla。

图像说明文字

图2-143

1.导入素材绘制头部图形

STEP 1  选择“文件 > 新建”命令,在弹出的“新建文档”对话框中选择“ActionScript 3.0”选项,将“宽”选项设为596,“高”选项设为402,单击“确定”按钮,完成文档的创建。

图像说明文字

绘制新春卡片1

STEP 2  选择“文件 > 导入 > 导入到库”命令,在弹出的“导入到库”对话框中选择“Ch02 >素材 > 绘制新春卡片 > 01、02、03”文件,单击“打开”按钮,文件被导入到“库”面板中,如图2-144所示。

STEP 3  在“库”面板下方单击“新建元件”按钮01tb30.tif,弹出“创建新元件”对话框,在“名称”选项的文本框中输入“羊娃”,在“类型”选项的下拉列表中选择“图形”,单击“确定”按钮,新建图形元件“羊娃”,如图2-145所示,舞台窗口也随之转换为图形元件的舞台窗口。

02144.tif

图2-144

02145.tif

图2-145

STEP 4  将“图层1”重命名为“头部”。选择“钢笔”工具01tb10.tif,在钢笔工具“属性”面板中,将“笔触颜色”设为土红色(#A34935),“笔触”选项设为2,如图2-146所示,在舞台窗口中绘制一个闭合路径,如图2-147所示。

02146.tif

图2-146

02147.tif

图2-147

STEP 5  选择“颜料桶”工具01tb20.tif,在工具箱中将“填充颜色”设为黄色(#FDDC9E),在闭合路径的内部单击鼠标填充图形,效果如图2-148所示。

STEP 6  选择“钢笔”工具01tb10.tif,选择工具箱下方的“对象绘制”按钮02tb053.tif,在钢笔工具“属性”面板中,将“笔触颜色”设为黑色,“笔触”选项设为1,在舞台窗口中绘制一个闭合路径,如图2-149所示。

STEP 7  选择“颜料桶”工具01tb20.tif,在工具箱中将“填充颜色”设为深黄色(#FBCC7E),在闭合路径的内部单击鼠标填充图形,效果如图2-150所示。选择“选择”工具01tb01.tif,选中边线,如图2-151所示,在工具箱中将“笔触颜色”设为无,效果如图2-152所示。

02148.tif

图2-148

02149.tif

图2-149

02150.tif

图2-150

02151.tif

图2-151

02152.tif

图2-152

STEP 8  选择“椭圆”工具01tb14.tif,在椭圆工具“属性”面板中,将“笔触颜色”设为无,“填充颜色”设为白色,“Alpha”选项设为20%,在舞台窗口中绘制一个椭圆,如图2-153所示。

STEP 9  单击“时间轴”面板下方的“新建图层”按钮01tb30.tif,创建新图层并将其命名为“眼睛”。在椭圆工具“属性”面板中,将“笔触颜色”设为无,“填充颜色”设为土红色(#A34935),“Alpha”选项设为100%,在舞台窗口中绘制一个圆形,如图2-154所示。选择“选择”工具01tb01.tif,按住Alt+Shift组合键的同时,水平向右拖曳圆形,复制圆形,效果如图2-155所示。

STEP 10  单击“时间轴”面板下方的“新建图层”按钮01tb30.tif,创建新图层并将其命名为“腮红”。在椭圆工具“属性”面板中,将“填充颜色”设为洋红色(#F6BCB7),在舞台窗口中绘制一个椭圆,如图2-156所示。选择“选择”工具01tb01.tif,按住Alt+Shift组合键的同时,水平向右拖曳圆形,复制椭圆形,效果如图2-157所示。

02153.tif

图2-153

02154.tif

图2-154

02155.tif

图2-155

02156.tif

图2-156

02157.tif

图2-157

STEP 11  在“时间轴”面板中单击“腮红”图层,将其图层中的图形全部选中,舞台窗口中的效果如图2-158所示。选择“修改 > 形状 > 柔化填充边缘”命令,在弹出的“柔化填充边缘”对话框中进行设置,如图2-159所示,单击“确定”按钮,效果如图2-160所示。

02158.tif

图2-158

02159.tif

图2-159

02160.tif

图2-160

STEP 12  单击“时间轴”面板下方的“新建图层”按钮01tb30.tif,创建新图层并将其命名为“鼻孔”。选择“钢笔”工具01tb10.tif,选择工具箱下方的“对象绘制”按钮02tb053.tif,在钢笔工具“属性”面板中,将“笔触颜色”设为黑色,“笔触”选项设为1,在舞台窗口中绘制一个闭合路径,如图2-161所示。选择“选择”工具01tb01.tif,选中边线,如图2-162所示,在工具箱中将“笔触颜色”设为无,“填充颜色”设为土褐色(#7E2F00),效果如图2-163所示。

STEP 13  保持图形的选取状态,按住Alt+Shift组合键的同时,水平向右拖曳圆形,复制圆形,效果如图2-164所示。选择“修改 > 变形 > 水平翻转”命令,将组合图形水平翻转,如图2-165所示。

02161.tif

图2-161

02162.tif

图2-162

02163.tif

图2-163

02164.tif

图2-164

02165.tif

图2-165

STEP 14  单击“时间轴”面板下方的“新建图层”按钮01tb30.tif,创建新图层并将其命名为“犄角”。选择“钢笔”工具01tb10.tif,选择工具箱下方的“对象绘制”按钮02tb053.tif,在钢笔工具“属性”面板中,将“笔触颜色”设为土红色(#A34935),“笔触”选项设为1,在舞台窗口中绘制一个闭合路径,如图2-166所示。选择“选择”工具01tb01.tif,选中边线,如图2-167所示,在工具箱中将“填充颜色”设为橘黄色(#F0831F),效果如图2-168所示。

STEP 15  选择“钢笔”工具01tb10.tif,选择工具箱下方的“对象绘制”按钮02tb053.tif,在钢笔工具“属性”面板中,将“笔触颜色”设为土红色(#A34935),“笔触”选项设为1,在舞台窗口中绘制多个开放路径,如图2-169所示。

02166.tif

图2-166

02167.tif

图2-167

02168.tif

图2-168

02169.tif

图2-169

STEP 16  用相同的方法绘制右侧的犄角,效果如图2-170所示。单击“时间轴”面板下方的“新建图层”按钮01tb30.tif,创建新图层并将其命名为“装饰”。选择“钢笔”工具01tb10.tif,选择工具箱下方的“对象绘制”按钮02tb053.tif,在钢笔工具“属性”面板中,将“笔触颜色”设为黑色,“笔触”选项设为1,在舞台窗口中绘制一个闭合路径,如图2-171所示。选择“选择”工具01tb01.tif,选中边线,如图2-172所示,在工具箱中将“笔触颜色”设为无,“填充颜色”设为土红色(#A34935),效果如图2-173所示。

02170.tif

图2-170

02171.tif

图2-171

02172.tif

图2-172

02173.tif

图2-173

2.绘制身体

STEP 1 单击“时间轴”面板下方的“新建图层”按钮01tb30.tif,创建新图层并将其命名为“衣服”。选择“钢笔”工具01tb10.tif,选择工具箱下方的“对象绘制”按钮02tb053.tif,在钢笔工具“属性”面板中,将“笔触颜色”设为土红色(#A34935),“笔触”选项设为1,在舞台窗口中绘制一个闭合路径,如图2-174所示。选择“选择”工具01tb01.tif,选中边线,如图2-175所示,在工具箱中将“笔触颜色”设为无,“填充颜色”设为米黄色(#FFF6E9),效果如图2-176所示。

图像说明文字

绘制新春卡片2

02174.tif

图2-174

02175.tif

图2-175

02176.tif

图2-176

STEP 2  选择“钢笔”工具01tb10.tif,选择工具箱下方的“对象绘制”按钮02tb053.tif,在钢笔工具“属性”面板中,将“笔触颜色”设为黑色,“笔触”选项设为1,在舞台窗口中绘制一个闭合路径,如图2-177所示。选择“选择”工具01tb01.tif,选中边线,如图2-178所示,在工具箱中将“笔触颜色”设为无,“填充颜色”设为灰黄色(#F4E5CF),效果如图2-179所示。

02177.tif

图2-177

02178.tif

图2-178

02179.tif

图2-179

STEP 3  在“时间轴”面板中,将“衣服”图层拖曳到“头”图层的下方,如图2-180所示,效果如图2-181所示。

02180.tif

图2-180

02181.tif

图2-181

STEP 4  在“时间轴”面板中选择“装饰”图层,单击“时间轴”面板下方的“新建图层”按钮01tb30.tif,创建新图层并将其命名为“羊手”。选择“钢笔”工具01tb10.tif,在工具箱中将“笔触颜色”设为黑色,“笔触”选项设为1,在舞台窗口中绘制一个闭合路径,如图2-182所示。选择“选择”工具01tb01.tif,选中边线,如图2-183所示,在工具箱中将“笔触颜色”设为无,“填充颜色”设为土红色(#A34935),效果如图2-184所示。

02182.tif

图2-182

02183.tif

图2-183

02184.tif

图2-184

STEP 5  选择“钢笔”工具01tb10.tif,在工具箱中将“笔触颜色”设为黑色,“笔触”选项设为1,在舞台窗口中绘制一个闭合路径,如图2-185所示。选择“选择”工具01tb01.tif,选中边线,如图2-186所示,在工具箱中将“笔触颜色”设为无,“填充颜色”设为黄色(#FDDC9E),效果如图2-187所示。

02185.tif

图2-185

02186.tif

图2-186

02187.tif

图2-187

STEP 6  选择“钢笔”工具01tb10.tif,在工具箱中将“笔触颜色”设为黑色,“笔触”选项设为1,在舞台窗口中绘制一个闭合路径,如图2-188所示。选择“选择”工具01tb01.tif,选中边线,如图2-189所示,在工具箱中将“笔触颜色”设为无,“填充颜色”设为橘红色(#ED6D00),效果如图2-190所示。

STEP 7 选择“钢笔”工具01tb10.tif,在工具箱中将“笔触颜色”设为土红色(#A34935),“笔触”选项设为1,在舞台窗口中绘制多个开放路径,如图2-191所示。

02188.tif

图2-188

02189.tif

图2-189

02190.tif

图2-190

02191.tif

图2-191

STEP 8 用相同的方法绘制出如图2-192所示的效果。单击“时间轴”面板下方的“新建图层”按钮01tb30.tif,创建新图层并将其命名为“羊脚”。选择“钢笔”工具01tb10.tif,在工具箱中将“笔触颜色”设为黑色,“笔触”选项设为1,在舞台窗口中绘制一个闭合路径,如图2-193所示。选择“选择”工具01tb01.tif,选中边线,如图2-194所示,在工具箱中将“笔触颜色”设为无,“填充颜色”设为土红色(#A34935),效果如图2-195所示。

02192.tif

图2-192

02193.tif

图2-193

02194.tif

图2-194

02195.tif

图2-195

STEP 9  选择“钢笔”工具01tb10.tif,在工具箱中将“笔触颜色”设为黑色,“笔触”选项设为1,在舞台窗口中绘制一个闭合路径,如图2-196所示。选择“选择”工具01tb01.tif,选中边线,如图2-197所示,在工具箱中将“笔触颜色”设为无,“填充颜色”设为黄色(#FDDC9E),效果如图2-198所示。

STEP 10 选择“钢笔”工具01tb10.tif,在工具箱中将“笔触颜色”设为黑色,“笔触”选项设为1,在舞台窗口中绘制一个闭合路径,如图2-199所示。选择“选择”工具01tb01.tif,选中边线,如图2-200所示,在工具箱中将“笔触颜色”设为无,“填充颜色”设为橘红色(#ED6D00),效果如图2-201所示。

02196.tif

图2-196

02197.tif

图2-197

02198.tif

图2-198

02199.tif

图2-199

02200.tif

图2-200

02201.tif

图2-201

STEP 11  在“时间轴”面板中单击“羊脚”图层,将其图层中的图形全部选中,舞台窗口中的效果如图2-202所示。按Ctrl+G组合键,将其组合,如图2-203所示。选择“选择”工具01tb01.tif,按住Alt+Shift组合键的同时,水平向右拖曳圆形,复制椭圆形,效果如图2-204所示。

02202.tif

图2-202

02203.tif

图2-203

02204.tif

图2-204

STEP 12 选择“修改 > 变形 > 水平翻转”命令,将组合图形水平翻转,效果如图2-205所示。在“时间轴”面板中,将“羊脚”图层拖曳到“衣服”图层的下方,如图2-206所示,效果如图2-207所示。

02205.tif

图2-205

02206.tif

图2-206

02207.tif

图2-207

3.填充图案效果

STEP 1  单击舞台窗口左上方的“场景1”图标02tb005.tif,进入“场景1”的舞台窗口。将“图层1”重新命名为“底图”,如图2-208所示。将“库”面板中的位图“01”拖曳到舞台窗口中,效果如图2-209所示。

图像说明文字

绘制新春卡片3

02208.tif

图2-208

02209.tif

图2-209

STEP 2 单击“时间轴”面板下方的“新建图层”按钮01tb30.tif,创建新图层并将其命名为“图案”。选择“矩形”工具01tb13.tif,在工具箱中将“笔触颜色”设为无,“填充颜色”设为黄色(#FFCC00),绘制一个矩形,如图2-210所示。按Alt+Shift+F9组合键,弹出“颜色”面板,将“笔触颜色”设为无,单击“填充颜色”按钮02tb056.tif,在“颜色类型”选项的下拉列表中选择“位图填充”,选择“滴管”工具02tb057.tif,单击面板中的“祥云”图案,吸取图形为填充颜色,选择“颜料桶”工具02tb058.tif,在黄色矩形上单击鼠标填充图形,效果如图2-211所示。

02210.tif

图2-210

02211.tif

图2-211

STEP 3  选择“渐变变形”工具02tb059.tif,在填充位图上单击,出现控制点。向内拖曳左下方的方形控制点改变大小,效果如图2-212所示。在“时间轴”面板中单击“图案”图层,按F8键,在弹出的“转换为元件”对话框中进行设置,如图2-213所示,单击“确定”按钮,位图转换为图形元件。

02212.tif

图2-212

02213.tif

图2-213

STEP 4  选择“选择”工具01tb01.tif,在舞台窗口中选择“祥云”实例,在图形“属性”面板中选择“色彩效果”选项组,在“样式”选项的下拉列表中选择“Alpha”,将其值设为20%,如图2-214所示。舞台窗口中的效果如图2-215所示。

02214.tif

图2-214

02215.tif

图2-215

STEP 5  单击“时间轴”面板下方的“新建图层”按钮01tb30.tif,创建新图层并将其命名为“文字”。将“库”面板中的位图“03”拖曳到舞台窗口中,并放置在适当的位置,如图2-216所示。

STEP 6  单击“时间轴”面板下方的“新建图层”按钮01tb30.tif,创建新图层并将其命名为“羊娃”。将“库”面板中的图形元件“羊娃”拖曳到舞台窗口中,并放置在适当的位置,如图2-217所示。新春卡片绘制完成,按Ctrl+Enter组合键即可查看效果。

02216.tif

图2-216

02217.tif

图2-217

2.3.2 墨水瓶工具

使用墨水瓶工具可以修改矢量图形的边线。

导入花瓣图形,如图2-218所示。选择“墨水瓶”工具02tb060.tif,在墨水瓶工具“属性”面板中设置笔触颜色、笔触以及笔触样式,如图2-219所示。

02218.tif

图2-218

02219.tif

图2-219

这时,光标变为02tb061.tif,在图形上单击鼠标,为图形增加设置好的边线,如图2-220所示。在“属性”面板中设置不同的属性,所绘制的边线效果也不同,如图2-221所示。

02220.tif

图2-220

图像说明文字

图2-221

2.3.3 颜料桶工具

绘制花瓣线框图形,如图2-222所示。选择“颜料桶”工具02tb058.tif,在颜料桶工具“属性”面板中设置填充颜色,如图2-223所示。在花瓣的线框内单击鼠标,线框内被填充颜色,如图2-224所示。

系统在工具箱的下方设置了4种填充模式可供选择,如图2-225所示。

02222.tif

图2-222

02223.tif

图2-223

02224.tif

图2-224

02225.tif

图2-225

  • “不封闭空隙”模式:选择此模式时,只有在完全封闭的区域颜色才能被填充。

  • “封闭小空隙”模式:选择此模式时,当边线上存在小空隙时,允许填充颜色。

  • “封闭中等空隙”模式:选择此模式时,当边线上存在中等空隙时,允许填充颜色。

  • “封闭大空隙”模式:选择此模式时,当边线上存在大空隙时,允许填充颜色。当选择“封闭大空隙”模式时,无论空隙是小空隙还是中等空隙,都可以填充颜色。

根据线框空隙的大小,应用不同的模式进行填充,效果如图2-226所示。

图像说明文字

图2-226

  • “锁定填充”按钮02tb066.tif:可以对填充颜色进行锁定,锁定后填充颜色不能被更改。

没有选择此按钮时,填充颜色可以根据需要进行变更,如图2-227所示。

选择此按钮时,鼠标放置在填充颜色上,光标变为02tb063.tif,填充颜色被锁定,不能随意变更,如图2-228所示。

图像说明文字

图2-227

图像说明文字

图2-228

2.3.4 滴管工具

使用滴管工具可以吸取矢量图形的线型和色彩,然后利用颜料桶工具,快速修改其他矢量图形内部的填充色。利用墨水瓶工具,可以快速修改其他矢量图形的边框颜色及线型。

1.吸取填充色

选择“滴管”工具02tb057.tif,将光标放在左边图形的填充色上,光标变为02tb064.tif,在填充色上单击鼠标,吸取填充色样本,如图2-229所示。

单击后,光标变为02tb065.tif,表示填充色被锁定。在工具箱的下方,取消对“锁定填充”按钮02tb066.tif的选取,光标变为02tb067.tif,在下边图形的填充色上单击鼠标,图形的颜色被修改,如图2-230所示。

02229.tif

图2-229

02230.tif

图2-230

2.吸取边框属性

选择“滴管”工具02tb057.tif,将光标放在右边图形的外边框上,光标变为02tb068.tif,在外边框上单击鼠标,吸取边框样本,如图2-231所示。单击后,光标变为02tb069.tif,在左边图形的外边框上单击鼠标,线条的颜色和样式被修改,如图2-232所示。

02231.tif

图2-231

02232.tif

图2-232

3.吸取位图图案

滴管工具可以吸取外部引入的位图图案。导入图片,如图2-233所示。按Ctrl+B组合键,将位图分离。绘制一个六边形,如图2-234所示。

选择“滴管”工具02tb057.tif,将光标放在位图上,光标变为02tb070.tif,单击鼠标,吸取图案样本,如图2-235所示。单击后,光标变为02tb071.tif,在六边形图形上单击鼠标,图案被填充,如图2-236所示。

02233.tif

图2-233

02234.tif

图2-234

02235.tif

图2-235

02236.tif

图2-236

选择“渐变变形”工具02tb059.tif,单击被填充图案样本的六边形,出现控制点,如图2-237所示。按住Shift键,将左下方的控制点向中心拖曳,如图2-238所示。填充图案变小,效果如图2-239所示。

02237.tif

图2-237

02238.tif

图2-238

02239.tif

图2-239

4.吸取文字属性

滴管工具还可以吸取文字的颜色。选择要修改的目标文字,如图2-240所示。

选择“滴管”工具02tb057.tif,将鼠标放在源文字上,光标变为02tb072.tif,如图2-241所示。在源文字上单击鼠标,源文字的文字属性被应用到了目标文字上,如图2-242所示。

02240.tif

图2-240

02241.tif

图2-241

02242.tif

图2-242

2.3.5 橡皮擦工具

选择“橡皮擦”工具02tb073.tif,在图形上想要删除的地方按下鼠标并拖动,图形被擦除,如图2-243所示。在工具箱下方的“橡皮擦形状”按钮02tb020.tif的下拉菜单中,可以选择橡皮擦的形状与大小。

如果想得到特殊的擦除效果,系统在工具箱的下方设置了5种擦除模式可供选择,如图2-244所示。

  • “标准擦除”模式:擦除同一层的线条和填充。选择此模式擦除图形的前后对照效果如图2-245所示。

图像说明文字

图2-243

02244.tif

图2-244

图像说明文字

图2-245

  • “擦除填色”模式:仅擦除填充区域,其他部分(如边框线)不受影响。选择此模式擦除图形的前后对照效果如图2-246所示。

  • “擦除线条”模式:仅擦除图形的线条部分,但不影响其填充部分。选择此模式擦除图形的前后对照效果如图2-247所示。

图像说明文字

图2-246

图像说明文字

图2-247

  • “擦除所选填充”模式:仅擦除已经选择的填充部分,但不影响其他未被选择的部分(如果场景中没有任何填充被选择,那么擦除命令无效)。选择此模式擦除图形的前后对照效果如图2-248所示。

  • “内部擦除”模式:仅擦除起点所在的填充区域部分,但不影响线条填充区域外的部分。选择此模式擦除图形的前后对照效果如图2-249所示。

图像说明文字

图2-248

图像说明文字

图2-249

要想快速删除舞台上的所有对象,双击“橡皮擦”工具02tb073.tif即可。

要想删除矢量图形上的线段或填充区域,选择“橡皮擦”工具02tb073.tif,再选中工具箱中的“水龙头”按钮02tb075.tif,然后单击舞台上想要删除的线段或填充区域即可,如图2-250和图2-251所示。

图像说明文字

图2-250

图像说明文字

图2-251

提示


因为导入的位图和文字不是矢量图形,不能擦除它们的部分或全部,所以必须先选择“修改 > 分离”命令,将它们分离成矢量图形,才能使用橡皮擦工具擦除它们的部分或全部。

2.3.6 任意变形工具和渐变变形工具

在制作图形的过程中,可以应用任意变形工具来改变图形的大小及倾斜度,也可以应用填充变形工具改变图形中渐变填充颜色的渐变效果。

1.任意变形工具

选中图形,按Ctrl+B组合键,将其打散。选择“任意变形”工具02tb076.tif,在图形的周围出现控制点,如图2-252所示。拖动控制点改变图形的大小,如图2-253和图2-254所示(按住Shift键,再拖动控制点,可成比例改变图形大小)。

光标放在4个角的控制点上时,光标变为02tb077.tif,如图2-255所示。拖动鼠标旋转图形,如图2-256和图2-257所示。

02252.tif

图2-252

02253.tif

图2-253

02254.tif

图2-254

02255.tif

图2-255

02256.tif

图2-256

02257.tif

图2-257

系统在工具箱的下方设置了4种变形模式可供选择,如图2-258所示。

  • “旋转与倾斜”模式02tb078.tif:选中图形,选择“旋转与倾斜”模式,将鼠标放在图形上方中间的控制点上,光标变为02tb079.tif,按住鼠标左键不放,向右水平拖曳控制点,如图2-259所示,松开鼠标,图形变为倾斜,如图2-260所示。

02258.tif

图2-258

02259.tif

图2-259

02260.tif

图2-260

  • “缩放”模式02tb080.tif:选中图形,选择“缩放”模式,将鼠标放在图形右上方的控制点上,光标变为02tb081.tif,按住鼠标左键不放,向右上方拖曳控制点,如图2-261所示,松开鼠标,图形变大,如图2-262所示。

  • “扭曲”模式02tb082.tif:选中图形,选择“扭曲”模式,将鼠标放在图形右上方的控制点上,光标变为02tb083.tif,按住鼠标左键不放,拖曳右上方的控制点,如图2-263所示,松开鼠标,图形扭曲,如图2-264所示。

02261.tif

图2-261

02262.tif

图2-262

02263.tif

图2-263

02264.tif

图2-264

  • “封套”模式02tb084.tif:选中图形,选择“封套”模式,图形周围出现一些节点,调节这些节点来改变图形的形状,光标变为02tb083.tif,拖动节点,如图2-265所示,松开鼠标,图形扭曲,如图2-266所示。

02265.tif

图2-265

02266.tif

图2-266

2.渐变变形工具

使用渐变变形工具可以改变选中图形中的填充渐变效果。当图形填充色为线性渐变色时,选择“渐变变形”工具02tb059.tif,用鼠标单击图形,出现3个控制点和2条平行线,如图2-267所示。向图形中间拖动方形控制点,渐变区域缩小,如图2-268所示,效果如图2-269所示。

02267.tif

图2-267

02268.tif

图2-268

02269.tif

图2-269

将光标放置在旋转控制点上,光标变为02tb086.tif,拖动旋转控制点来改变渐变区域的角度,如图2-270所示,效果如图2-271所示。

02270.tif

图2-270

02271.tif

图2-271

当图形填充色为径向渐变色时,选择“渐变变形”工具02tb059.tif,用鼠标单击图形,出现4个控制点和1个圆形外框,如图2-272所示。向图形外侧水平拖动方形控制点,水平拉伸渐变区域,如图2-273所示,效果如图2-274所示。

02272.tif

图2-272

02273.tif

图2-273

02274.tif

图2-274

将光标放置在圆形边框中间的圆形控制点上,光标变为02tb087.tif,向图形内部拖动鼠标,缩小渐变区域,如图2-275所示,效果如图2-276所示。将光标放置在圆形边框外侧的圆形控制点上,光标变为02tb086.tif,向下旋转拖动控制点,改变渐变区域的角度,如图2-277所示,效果如图2-278所示。

02275.tif

图2-275

02276.tif

图2-276

02277.tif

图2-277

02278.tif

图2-278

提示


通过移动中心控制点可以改变渐变区域的位置。

2.3.7 手形工具和缩放工具

手形工具和缩放工具都是辅助工具,它们本身并不直接创建和修改图形,而只是在创建和修改图形的过程中辅助用户进行操作。

1.手形工具

如果图形很大或被放大得很大,那么需要利用“手形”工具02tb088.tif调整观察区域。选择“手形”工具02tb088.tif,光标变为手形,按住鼠标左键不放,拖动图像到需要的位置,如图2-279所示。

提示


当使用其他工具时,按“空格”键即可切换到“手形”工具。双击“手形”工具,将自动调整图像大小以适合屏幕的显示范围。

2.缩放工具

利用缩放工具放大图形以便观察细节,缩小图形以便观看整体效果。选择“缩放”工具02tb089.tif,在舞台上单击可放大图形,如图2-280所示。

图像说明文字

图2-279

图像说明文字

图2-280

要想放大图像中的局部区域,可在图像上拖曳出一个矩形选取框,如图2-281所示,松开鼠标后,所选取的局部图像被放大,如图2-282所示。

选中工具箱下方的“缩小”按钮02tb090.tif,在舞台上单击可缩小图像,如图2-283所示。

02281.tif

图2-281

02282.tif

图2-282

图像说明文字

图2-283

提示


当使用“放大”按钮时,按住Alt键单击也可缩小图形。用鼠标双击“缩放”工具,可以使场景恢复到100%的显示比例。

2.4 图形的色彩

根据设计的要求,可以应用“纯色编辑”面板、“颜色”面板和“样本”面板来设置所需要的纯色、渐变色和颜色样本等。

2.4.1 课堂案例——绘制透明按钮

案例学习目标

使用绘图工具绘制图形,使用“颜色”面板设置图形的颜色。

案例知识要点

使用“颜色”面板和“椭圆”工具,绘制按钮效果;使用“渐变变形”工具,调整高光效果;使用“文本”工具,输入文字;使用“导入到舞台”命令,导入素材,如图2-284所示。

效果所在位置

资源包/Ch02/效果/绘制透明按钮.fla。

图像说明文字

图2-284

图像说明文字

绘制透明按钮1

图像说明文字

绘制透明按钮2

STEP 1  选择“文件 > 新建”命令,在弹出的“新建文档”对话框中选择“ActionScript 3.0”选项,单击“确定”按钮,进入新建文档舞台窗口。在“时间轴”面板中将“图层1”图层重命名为“渐变圆”,如图2-285所示。

STEP 2  选择“椭圆”工具02tb093.tif,在工具箱中将“笔触颜色”设为黑色,“填充颜色”设为无,在舞台窗口中绘制出一个圆形,效果如图2-286所示。

02285.tif

图2-285

02286.tif

图2-286

STEP 3 再次绘制一个同心圆,效果如图2-287所示。选择“线条”工具01tb12.tif,在圆形中绘制多条斜线,效果如图2-288所示。

02287.tif

图2-287

02288.tif

图2-288

STEP 4  选择“窗口 > 颜色”命令,弹出“颜色”面板,单击“填充颜色”按钮02tb056.tif,在“颜色类型”下拉列表中选择“径向渐变”,在色带上添加控制点,将控制点颜色依次设为深灰色(#666666)、红色(#FF0000)、浅红色(E62626)、深灰色(#666666),如图2-289所示。

图像说明文字

图2-288

STEP 5  选择“颜料桶”工具02tb058.tif,在闭合路径中单击鼠标填充渐变,如图2-290所示。选择“渐变变形”工具02tb059.tif,单击渐变图形,向下拖曳中心控制点到适当位置,如图2-291所示。改变渐变大小,效果如图2-292所示。

02290.tif

图2-290

02291.tif

图2-291

02292.tif

图2-292

STEP 6  在“颜色”面板中的色带上添加控制点,将控制点颜色依次设为深灰色(# 999999)、白色、白色、深灰色(#999999),如图2-293所示。分别在闭合路径中添加渐变,并选择“渐变变形”工具02tb059.tif,改变渐变位置和大小,效果如图2-294所示。在“颜色”面板中的色带上添加控制点,将控制点颜色依次设为深灰色(#999999)、浅灰色(#CCCCCC)、浅灰色(#CCCCCC)、深灰色(#999999),如图2-295所示。

STEP 7  分别在闭合路径中添加渐变,并选择“渐变变形”工具02tb059.tif,改变渐变位置和大小,效果如图2-296所示。选择“选择”工具01tb01.tif,删除斜线路径,效果如图2-297所示。在“颜色”面板中将渐变颜色设为由白到黑,如图2-298所示。

02293.tif

图2-293

02294.tif

图2-294

02295.tif

图2-295

02296.tif

图2-296

02297.tif

图2-297

02298.tif

图2-298

STEP 8  选择“颜料桶”工具02tb058.tif,在闭合路径中单击鼠标填充渐变,如图2-299所示。选择“渐变变形”工具02tb059.tif,改变渐变位置和大小,效果如图2-300所示。

STEP 9  选择“选择”工具01tb01.tif,删除内部的圆形路径,选取外部的圆形路径,如图2-301所示,按Ctrl+X组合键,剪切选中的路径,单击“时间轴”面板下方的“新建图层”按钮01tb30.tif,创建新图层并将其命名为“透明圆”。选择“编辑 > 粘贴到当前位置”,将图形原位粘贴到“透明圆”图层中。

02299.tif

图2-299

02300.tif

图2-300

02301.tif

图2-301

STEP 10  在“颜色”面板“渐变类型”下拉列表中选择“纯色”,将“填充颜色”设为白色,“Alpha”选项设为30,如图2-302所示。选择“颜料桶”工具02tb058.tif,在圆形路径中单击鼠标填充颜色,删除路径,效果如图2-303所示。

STEP 11 在“时间轴”中创建新图层并将其命名为“文字”。选择“文本”工具01tb11.tif,在文本工具“属性”面板中进行设置,将“颜色”选项设置为黑色,其他选项的设置如图2-304所示。

02302.tif

图2-302

02303.tif

图2-303

02304.tif

图2-304

STEP 12 在舞台窗口中输入需要的文字,效果如图2-305所示。在文本工具“属性”面板中进行设置,如图2-306所示。在舞台窗口中输入需要的英文,效果如图2-307所示。

02305.tif

图2-305

02306.tif

图2-306

02307.tif

图2-307

STEP 13 选择“选择”工具01tb01.tif,按住Shift键,将需要的文字选中,如图2-308所示。在文本“属性”面板中,将“颜色”选项设为红色(#990000),效果如图2-309所示。

02308.tif

图2-308

02309.tif

图2-309

STEP 14 在“时间轴”面板中创建新图层并将其命名为“说明文字”。选择“文件 > 导入 > 导入到舞台”命令,在弹出的“导入”对话框中选择“Ch02 > 素材 > 绘制透明按钮 > 01、02”文件,单击“打开”按钮,文件分别被导入到舞台窗口中,选择“任意变形”工具02tb076.tif,分别调整图像大小并拖曳到适当的位置,效果如图2-310所示。

STEP 15 用步骤11的方法输入需要的文字,并调整适当的字体、字号和颜色,效果如图2-311所示。透明按钮制作完成,按Ctrl+Enter组合键即可查看效果。

02310.tif

图2-310

02311.tif

图2-311

2.4.2 “纯色编辑”面板

在工具箱的下方单击“填充颜色”按钮02tb056.tif,弹出“纯色”面板,如图2-312所示。在面板中可以选择系统设置好的颜色,如想自行设定颜色,单击面板右上方的颜色选择按钮02tb099.tif,弹出“颜色选择器”面板,在面板左侧的颜色选择区中,可以选择颜色的明度和饱和度。垂直方向表示的是明度的变化,水平方向表示的是饱和度的变化。选择要自定义的颜色,如图2-313所示。拖动面板右侧的滑块来设定颜色的亮度,如图2-314所示。

设定颜色后,在对话框的右上方的颜色框中预览设定结果。右下方是所选颜色的明度、亮度、透明度、红绿蓝和十六进制,选择好颜色后,单击“确定”按钮,所选择的颜色将变化为工具箱中的填充颜色。

02312.tif

图2-312

02313.tif

图2-313

02314.tif

图2-314

2.4.3 “颜色”面板

选择“窗口 > 颜色”命令,或按Ctrl+Shift+F9组合键,弹出“颜色”面板。

1.自定义纯色

在“颜色”面板“颜色类型”选项中的下拉列表中选择“纯色”选项,面板效果如图2-315所示。

  • “笔触颜色”按钮02tb100.tif:可以设定矢量线条的颜色。

  • “填充颜色”按钮02tb101.tif:可以设定填充色的颜色。

  • “黑白”按钮02tb102.tif:单击此按钮,线条与填充色恢复为系统默认的状态。

  • “没有颜色”按钮02tb103.tif:用于取消矢量线条或填充色块。当选择“椭圆”工具02tb093.tif或“矩形”工具01tb13.tif时,此按钮为可用状态。

  • “交换颜色”按钮02tb104.tif:单击此按钮,可以将线条颜色和填充色相互切换。

  • “H”“S”“B”和“R”“G”“B”选项:可以用精确数值来设定颜色。

  • “A”选项:用于设定颜色的不透明度,数值选取范围为0~100。

在面板左侧中间的颜色选择区域内,可以根据需要选择相应的颜色。

图像说明文字

图2-315

2.自定义线性渐变色

在“颜色”面板的“颜色类型”选项中选择“线性渐变”选项,面板如图2-316所示。将光标放置在滑动色带上,光标变为02tb105.tif,在色带上单击鼠标增加颜色控制点,并在面板下方为新增加的控制点设定颜色及明度,如图2-317所示。当要删除控制点时,只需将控制点向色带下方拖曳。

3.自定义径向渐变色

在“颜色”面板的“颜色类型”选项中选择“径向渐变”选项,面板效果如图2-318所示。用与定义线性渐变色相同的方法在色带上定义放射状渐变色,定义完成后,在面板的左下方显示出定义的渐变色,如图2-319所示。

02316.tif

图2-316

02317.tif

图2-317

02318.tif

图2-318

02319.tif

图2-319

4.自定义位图填充

在“颜色”面板的“颜色类型”选项中,选择“位图填充”选项,如图2-320所示。弹出“导入到库”对话框,在对话框中选择要导入的图片,如图2-321所示。

单击“打开”按钮,图片被导入“颜色”面板中。选择“椭圆形”工具01tb14.tif,在场景中绘制出一个椭圆形,椭圆形被刚才导入的位图所填充,如图2-322所示。

选择“渐变变形”工具02tb059.tif,在填充位图上单击,出现控制点。向内拖曳左下方的方形控制点,如图2-323所示。松开鼠标后效果如图2-324所示。

向上拖曳右上方的圆形控制点,改变填充位图的角度,如图2-325所示。松开鼠标后效果如图2-326所示。

02320.tif

图2-320

02321.tif

图2-321

02322.tif

图2-322

02323.tif

图2-323

02324.tif

图2-324

02325.tif

图2-325

02326.tif

图2-326

2.4.4 “样本”面板

在“样本”面板中可以选择系统提供的纯色或渐变色。选择“窗口 > 样本”命令,弹出“样本”面板,如图2-327所示。在控制面板中部的纯色样本区,系统提供了216种纯色。控制面板下方是渐变色样本区。单击控制面板右上方的按钮02tb107.tif,弹出下拉菜单,如图2-328所示。

02327.tif

图2-327

02328.tif

图2-328

  • “直接复制样本”命令:可以将选中的颜色复制出一个新的颜色。

  • “删除样本”命令:可以将选中的颜色删除。

  • “添加颜色”命令:可以将系统中保存的颜色文件添加到面板中。

  • “替换颜色”命令:可以将选中的颜色替换成系统中保存的颜色文件。

  • “加载默认颜色”命令:可以将面板中的颜色恢复到系统默认的颜色状态中。

  • “保存颜色”命令:可以将编辑好的颜色保存到系统中,方便再次调用。

  • “保存为默认值”命令:可以将编辑好的颜色替换系统默认的颜色文件,在创建新文档时自动替换。

  • “清除颜色”命令:可以清除当前面板中的所有颜色,只保留黑色与白色。

  • “Web216色”命令:可以调出系统自带的符合Internet标准的色彩。

  • “按颜色排序”命令:可以将色标按色相进行排列。

  • “帮助”命令:选择此命令,将弹出帮助文件。

2.5 课堂练习——绘制童子拜年贺卡

练习知识要点

使用“打开”命令,打开素材;使用“椭圆”工具、“选择”工具、“颜色”面板和“颜料桶”工具,绘制童子的身体;使用“渐变变形”工具,调整图案填充的大小,效果如图2-329所示。

文件所在位置

资源包/Ch02/效果/绘制童子拜年贺卡.fla。

图像说明文字

图2-329

图像说明文字

绘制童子拜年贺卡1

图像说明文字

绘制童子拜年贺卡2

图像说明文字

绘制童子拜年贺卡3

2.6 课后习题——绘制圣诞贺卡

习题知识要点

使用“钢笔”和“颜料桶”工具,绘制房子效果;使用“椭圆”工具和“柔化填充边缘”命令,绘制雪花效果;使用“导入”命令,导入装饰图形,效果如图2-330所示。

文件所在位置

资源包/Ch02/效果/绘制圣诞贺卡.fla。

图像说明文字

图2-330

图像说明文字

绘制圣诞贺卡

目录

人邮微信
本地服务
人邮微信
教师服务
二维码
读者服务
读者服务
返回顶部
返回顶部