图形的绘制与编辑
2.5课堂练习——绘制冬天夜景
【练习知识要点】使用椭圆工具、多角星形工具和铅笔工
具绘制背景,使用椭圆工具绘制雪人形体,使用钢笔工具和笔
刷工具绘制树枝和积雪,如图2-331所示。
【效果所在位置】光盘/Ch02/效果/绘制冬天夜景.fla。
2.5.1.绘制背景效果
(1)选择“文件>新建”命令,弹出“新建文档”对话框,单击“确定”按钮,进入新建
文档舞台窗口。按Ctrl+F3组合键,弹出文档“属性”面板,单击“大小”选项后面的“编辑”
按钮,在弹出的对话框中将舞台窗口的宽度设为498,高度设为386,如图2-2所示,单
击“确定”按钮。
(2)在“时间轴”面板中将“图层1”重新命名为“背景”。选择“矩形”工具,在工具
箱下方将“笔触颜色”设为无,“填充颜色”设为深蓝色(#075CA8),在舞台窗口中绘制一个与
舞台窗口大小相同的矩形,效果如图2-3所示。
图2-2图2-3
(3)选择“铅笔”工具,在工具箱中将“笔触颜色”设为黑色,并在工具箱下方的“铅笔
图2-1
FlashCS5实例教程(第2版)
2
模式”选项组的下拉菜单中选中“平滑”选项,在舞台窗口中空白处位置绘制出一条曲线。按住
Shift键的同时,在曲线的下方绘制出3条直线,使曲线与直线形成闭合区域,效果如图2-4所示。
(4)选择“窗口>颜色”命令,弹出“颜色”面板,在“颜色类型”选项的下拉列表中选
择“线性渐变”,在色带上单击鼠标,添加色块,选中色带上左侧的色块,将其设为灰白色
(#E8EFEC),选中色带上中间的色块,将其设为浅灰白色(#F5F6F5),选中色带上右侧的色块,
将其设为白色,如图2-5所示。选择“颜料桶”工具,在闭合的区域单击鼠标填充渐变色。选
择“选择”工具,双击渐变图形的边线将其选中,按Delete键,将其删除。并将渐变图形拖曳
到舞台窗口中的适当位置,效果如图2-6所示。
图2-4图2-5图2-6
(5)用上述相同的方法,使用“铅笔”工具分别再绘制出三个不规则的闭合路径,分别将
其填充为淡蓝白色(#EFF5F9),淡蓝色(E5F0F9)和蓝色(E1F2FF),并分别将其拖曳到舞台窗
口中适当的位置,效果如图2-7所示。
(6)选择“多角星形”工具,在多角星形工具“属性”面板中单击“选项设置”选项组下
的“选项”按钮,弹出“工具设置”对话框,在对话框中进行设置如图2-8所示,
单击“确定”按钮,返回到“属性”面板,将“笔触颜色”设为无,“填充颜色”设为白色,在舞
台窗口中绘制星形,效果如图2-9所示。
图2-7图2-8图2-9
(7)选择“选择”工具,将光标放置在星形一条边线上,光标下方出现圆弧形状,向内
拖曳鼠标,将星形的边线转换为曲线,如图2-10所示。用相同的方法将星形的其余边线都转换为
曲线,图形效果如图2-11所示。按住Alt键的同时,向右下方拖曳星形,复制星形,效果如图2-12
所示。
第2章图形的绘制与编辑
3
图2-10图2-11图2-12
(8)用相同的方法按照需要复制出多个星形,并使用“任意变形”工具调整其大小和角度,
并将其放置在适当的位置,效果如图2-13所示。
(9)选择“椭圆”工具,在工具箱中将“填充颜色”设为黄色(#FFCC00),按住Shfit键
的同时,在舞台窗口中绘制一个圆形,效果如图2-14所示。选择“选择”工具,选中黄色圆
形,按住Shift+Alt组合键的同时,水平向右拖曳圆形到适当的位置,复制圆形,并在工具箱下方
将“填充颜色”修改为白色,效果如图2-15所示。
图2-13图2-14图2-15
(10)选择“选择”工具,选中白色圆形,按Delete键,将其删除,图形效果如图2-16所
示。选中黄色图形,将其拖曳到舞台窗口中的左上方,并使用“任意变形”工具旋转图形到适
当的角度,效果如图2-17所示。选择“选择”工具,选中舞台窗口中的所有图形,按Ctrl+G
组合键,将其组合。
图2-16图2-17
2.5.2.绘制雪人图形
(1)单击“时间轴”面板下方的“新建图层”按钮,创建新图层并将其命名为“雪人”,
如图2-18所示。选择“铅笔”工具,在工具箱下方的“铅笔模式”中选择“平滑”选项,在
铅笔工具“属性”面板中进行设置如图2-19所示,在舞台窗口中的右下方绘制一个图形,如图
2-20所示。
FlashCS5实例教程(第2版)
4
图2-18图2-19图2-20
(2)选择“颜色”面板,在“颜色类型”选项的下拉列表中选择“径向渐变”,选中色带上左
侧的色块,将其设为灰白色(#E8EFEC),选中色带上右侧的色块,将其设为灰色(#B1B1B1),
如图2-21所示。选择“颜料桶”工具,在图形内部单击鼠标填充渐变色,效果如图2-22所示。
(3)选择“渐变变形”工具,用鼠标单击渐变图形,出现在4个控制点和1个图形外框,
调整控制点和图形外框到需要的渐变色如图2-23所示,在空白处单击鼠标,取消渐变图形的选取,
效果如图2-24所示。选择“选择”工具,选中图形,按Ctrl+G组合键,将其组合。
图2-21图2-22图2-23图2-24
(4)用相同的方法在适当的再绘制一个图形,将渐变色设为从白色到深灰色(#9B9B9B),选
择“选择”工具,将图形的边线删除,图形效果如图2-25所示。选择“椭圆”工具,在工
具箱中将“笔触颜色”设为无,在舞台窗口中绘制圆形,如图2-26所示。选择“选择”工具,
选中渐变圆形,在“颜色”面板中调整渐变色如图2-27所示,图形效果如图2-28所示。选择“选
择”工具,选中图形,按Ctrl+G组合键,将其组合。
图2-25图2-26图2-27图2-28
第2章图形的绘制与编辑
5
(5)选择“钢笔”工具,在工具箱中将“笔触颜色”设为黑色,“填充颜色”设为无,在
舞台窗口中绘制闭合路径,如图2-29所示。在工具箱中将“填充颜色”设为灰色(#CCCCCC),
选择“颜料桶”工具,在闭合路径内部单击鼠标,填充闭合路径,并将其边线删除,效果如图
2-30所示。
(6)选择“选择”工具,选中图形,按Ctrl+G组合键,将其组合,并将其拖曳到适当的
位置,如图2-31所示。选择“修改>排列>下移一层”命令,将灰色图形放置在渐变圆形的下
方,图形效果如图2-32所示。
图2-29图2-30图2-31图2-32
(7)选择“椭圆”工具,在工具箱中将“笔触颜色”设为无,“填充颜色”设为黑色,按
住Shift键的同时,在舞台窗口中绘制圆形,如图2-33所示。在工具箱中将“填充颜色”设为白
色,按住Shift键的同时,在黑色圆形上再次绘制一个圆形,如图2-34所示。选择“选择”工具,
将两个圆形同时选取,按Ctrl+G组合键,将其组合,并将其拖曳到适当的位置,如图2-35所示。
(8)选中组合圆形,按住Shift+Alt组合键的同时,水平向右拖曳圆形到适当的位置,复制圆
形,如图2-36所示。选择“修改>变形>水平翻转”命令,将复制圆形水平翻转,效果如图
2-37所示。
图2-33图2-34图2-35图2-36图2-37
(9)选择“钢笔”工具,在工具箱中将“笔触颜色”设为黑色,“填充颜色”设为无,在
舞台窗口中绘制闭合路径。在工具箱中将“填充颜色”设为黑色,选择“颜料桶”工具,在闭
合路径内部单击鼠标,填充闭合路径,并删除图形的边线,效果如图2-38所示。按Ctrl+C组合
键,复制图形,按Ctrl+Shift+V组合键,在当前位置粘贴图形,选择“选择”工具,将其拖曳
到适当的位置,如图2-39所示。
图2-38图2-39
FlashCS5实例教程(第2版)
6
(10)选择“颜色”面板,在“颜色类型”选项的下拉列表中选择“线性渐变”,选中色带上
左侧的色块,将其设为橘黄色(#FF3B2E),选中色带上右侧的色块,将其设为黄色(#FFE573),
如图2-40所示,效果如图2-41所示。按住Shift键的同时,将刚刚绘制的两个图形选取,按Ctrl+G
组合键,将图形组合,并将组合图形拖曳到适当的位置,效果如图2-42所示。
图2-40图2-41图2-42
(11)选择“椭圆”工具,在工具箱中将“笔触颜色”设为无,“填充颜色”设为黑色,按
住Shift键的同时,在舞台窗口中绘制圆形,如图2-43所示。选择“选择”工具,选中刚刚绘
制的圆形,按Ctrl+C组合键,复制图形,按Ctrl+Shift+V组合键,在当前位置粘贴图形,并将其
拖曳到适当的位置,如图2-44所示,在工具箱中将“填充颜色”设为粉色(#E72C41),效果如
图2-45所示。按住Shift键的同时,将两个圆形同时选取,按Ctrl+G组合键,将圆形组合,并将
组合圆形拖曳到适当的位置,如图2-46所示。选中组合图形,按住Shift+Alt组合键的同时,垂
直向下拖曳图形到适当的位置,复制图形。使用相同的方法按需要复制多个组合图形,并将其调
整到合适的大小,效果如图2-47所示。
图2-43图2-44图2-45图2-46图2-47
2.5.3.绘制鞋图形
(1)选择“钢笔”工具,在工具箱中将“笔触颜色”设为黑色,“填充颜色”设为无,在
舞台窗口中绘制闭合路径,如图2-48所示。在工具箱中将“填充颜色”设为灰色(#BDBDBD),
选择“颜料桶”工具,在闭合路径内部单击鼠标,填充闭合路径,并删除轮廓线,效果如图
2-49所示。
第2章图形的绘制与编辑
7
图2-48图2-49
(2)选择“选择”工具,选中刚刚绘制的图形,按Ctrl+C组合键,复制图形,按Ctrl+V
组合键,粘贴图形,并将其拖曳到适当的位置,如图2-50所示。选择“颜色”面板,在“颜色类
型”选项的下拉列表中选择“径向渐变”,在色带上单击鼠标,添加色块,选中色带上左侧的色块,
将其设为白色,选中色带上中间的色块,将其设为白色,选中色带上右侧的色块,将其设为灰白
色(#CDCDCD),如图2-51所示,效果如图2-52所示。按住Shift键的同时,将刚刚绘制的两个
图形选取,按Ctrl+G组合键,将图形组合。
图2-50图2-51图2-52
(3)选择“椭圆”工具,在工具箱中将“笔触颜色”设为无,“填充颜色”设为黑色,在
舞台窗口中绘制圆形,如图2-53所示。用相同方法绘制多个圆形,并将所有圆形进行组合,选择
“选择”工具,将其拖曳到适当的位置,效果如图2-54所示。
图2-53图2-54
(4)选择“线条”工具,在工具箱中将“笔触颜色”设为粉色(#E61E42),在线条工具
“属性”面板中设置如图2-55所示,在舞台窗口中绘制闭合图形,如图2-56所示。选择“选择”
工具,将光标放置需要的线条上,光标下方出现圆弧形状,向外拖曳鼠标,改变线条弧度,
如图2-57所示。用相同方法制作其他线条,效果如图2-58所示。双击刚刚绘制的线条,将其选
取,按Ctrl+G组合键,将图形组合,并将其拖曳到适当的位置,如图2-59所示。
FlashCS5实例教程(第2版)
8
图2-55图2-56
图2-57图2-58图2-59
(5)使用圈选的方法将鞋子图形全部选取,按Ctrl+G组合键,将图形组合,并将其拖曳到适
当的位置,如图2-60所示。按住Shift+Alt键的同时,复制鞋子并水平向右拖曳鞋子到适当的位
置,选择“修改>变形>水平翻转”命令,将复制图形水平翻转,效果如图2-61所示。
图2-60图2-61
(6)选择“钢笔”工具,在工具箱中将“笔触颜色”设为黑色,“填充颜色”设为无,在
舞台窗口中绘制闭合路径,如图2-62所示。在工具箱中将“填充颜色”设为黑色,选择“颜料桶”
工具,在闭合路径内部单击鼠标,填充闭合路径,并删除轮廓线,效果如图2-63所示。选择
“选择”工具,选取刚刚绘制的图形,按Ctrl+G组合键,将图形组合,并将其拖曳到舞台窗口
中适当的位置,如图2-64所示。
图2-62图2-63图2-64
(7)在舞台窗口中,选取树枝图形,单击鼠标右键,在弹出的菜单中选择“排列>移至底
第2章图形的绘制与编辑
9
层”命令,将树枝图形放置在渐变圆形的下方,图形效果如图2-65所示。按住Alt键的同时,复
制树枝并拖曳树枝到适当的位置,选择“修改>变形>水平翻转”命令,将复制图形水平翻转,
单击鼠标右键,在弹出的菜单中选择“排列>移至底层”命令,将树枝图形放置在渐变圆形的
下方,效果如图2-66所示。
图2-65图2-66
(8)单击“时间轴”面板下方的“新建图层”按钮,创建新图层并将其命名为“雪”,如
图2-67所示。选择“刷子”工具,在工具箱下方将“笔触颜色”设为白色,并选中“刷子大
小”选项中的第4个刷子,在舞台窗口中的树枝上绘制雪,如图2-68所示。再次拖曳鼠标绘制雪
图形,效果如图2-69所示。用相同方法在另一个树枝上绘制多处雪图形,效果如图2-70所示。
图2-67图2-68
图2-69图2-70
2.5.4.绘制帽子图形
(1)单击“时间轴”面板下方的“新建图层”按钮,创建新图层并将其命名为“雪人帽子”,
如图2-71所示。选择“矩形”工具,在工具箱中将“笔触颜色”设为无,“填充颜色”设为白
色,在舞台窗口中绘制矩形,如图2-72所示。
FlashCS5实例教程(第2版)
10
图2-71图2-72
(2)选择“椭圆”工具,在舞台窗口中绘制椭圆形,如图2-73所示。选择“选择”工具,
选取刚刚绘制的图形,选择“颜色”面板,在“颜色类型”选项的下拉列表中选择“线性渐变”,
在色带上单击鼠标,添加色块,选中色带上左侧的色块,将其设为红色(#FF0000),选中色带上
中间的色块,将其设为白色,选中色带上右侧的色块,将其设为红色(#FF0000),如图2-74所示,
效果如图2-75所示。
图2-73图2-74图2-75
(3)选择“墨水瓶”工具,在工具箱中将“笔触颜色”设为白色,在墨水瓶工具“属性”
面板中设置如图2-76所示,在舞台窗口中帽子图形上单击鼠标,效果如图2-77所示。选择“选
择”工具,圈选帽子图形,并将其拖曳到舞台窗口中适当的位置,效果如图2-78所示。
图2-76图2-77图2-78
(4)单击“时间轴”面板下方的“新建图层”按钮,创建新图层并将其命名为“雪人阴影”,
如图2-79所示。选择“椭圆”工具,在工具箱中将“笔触颜色”设为无,“填充颜色”设为灰
色(#999999),在舞台窗口中绘制椭圆形,如图2-80所示。
第2章图形的绘制与编辑
11
图2-79图2-80
(5)选择“选择”工具,选取椭圆形,选择“窗口>变形”命令,弹出“变形”面板,
设置如图2-81所示,按Enter键,效果如图2-82所示。选取椭圆形,将其拖曳到舞台窗口中适当
的位置,如图2-83所示。在“时间轴”面板中将“雪人阴影”图层拖曳至“雪人”图层的下方,
如图2-84所示。冬天夜景制作完成,如图2-85所示,按Ctrl+Enter组合键,即可查看效果。
图2-81图2-82
图2-83图2-84图2-85
2.6课后习题——绘制花店标志
【习题知识要点】使用选择工具和套索工具删除笔画,使
用钢笔工具和画笔工具绘制曲线和螺旋效果,使用椭圆工具绘
制底图,如图2-1所示。
【效果所在位置】光盘/Ch02/效果/绘制花店标志.fla。
图2-1
FlashCS5实例教程(第2版)
12
2.6.1.制作文字效果
(1)选择“文件>新建”命令,弹出“新建文档”对话框,单击“确定”按钮,进入新建
文档舞台窗口。
(2)在“库”面板下方单击“新建元件”按钮,弹出“创建新元件”对话框,在“名称”
选项的文本框中输入“文字”,在“类型”选项的下拉列表中选择“图形”选项,单击“确定”按
钮,新建一个图形元件“文字”,如图2-2所示,舞台窗口也随之转换为图形元件的舞台窗口。
(3)选择“文本”工具,在文字工具“属性”面板中进行设置,如图2-3所示,在舞台窗
口中输入需要的黑色文字,如图2-4所示。选择“选择”工具,选中文字,按两次Ctrl+B组合
键,将文字打散。框选“美、花”两个子,将其向上、向下、向右移动,效果如图2-5所示。
图2-2图2-3
图2-4图2-5
(3)选择“套索”工具,选中工具箱下方的“多边形模式”按钮,圈选“朵”字上面
的笔画,如图2-6所示,按Delete键将其删除,效果如图2-7所示。用相同的方法删除其他文字
笔画,效果如图2-8所示。
图2-6图2-7图2-8
(4)选择“钢笔”工具,在钢笔工具“属性”面板中,将“笔触颜色”设为黑色,在“美”
字的左下角单击鼠标,设置起始点,如图2-9所示,在左侧的空白处单击,设置第2个节点,按
第2章图形的绘制与编辑
13
住鼠标不放,向上拖曳控制手柄,调节控制手柄改变路径的弯度,效果如图2-10所示。
(5)使用相同方法,应用“钢笔”工具,绘制出边线的效果,如图2-11所示。在工具箱
中将“填充颜色”设为黑色,选择“颜料桶”工具,在边线内部单击鼠标填充图形,效果如图
2-12所示。
图2-9图2-10图2-11图2-12
(6)选择“选择”工具,双击边线,将其选中,如图2-13所示,按Delete键将其删除,
使用相同的方法绘制其他图形,效果如图2-14所示。
、
图2-13图2-14
(7)选择“铅笔”工具,在铅笔工具“属性”面板中将“笔触颜色”设为黑色,其他选项
设置如图2-15所示。在工具箱下方的“铅笔模式”选项组中选中“平滑”选项。在舞台窗口的中
适当的位置绘制出一条曲线,效果如图2-16所示。在“花”字的右上方绘制螺旋图形,如图2-17
所示。
(8)选择“线条”工具,拖曳鼠标绘制直线,如图2-18所示。用相同方法在“朵”字其
他部位添加线条,效果如图2-19所示。
图2-15图2-16
图2-17图2-18图2-19
FlashCS5实例教程(第2版)
14
2.6.2.添加花朵图案
(1)在“库”面板下方单击“新建元件”按钮,弹出“创建新元件”对话框,在“名称”
选项的文本框中输入“花瓣”,在“类型”选项的下拉列表中选择“图形”选项,单击“确定”按
钮,新建一个图形元件“花瓣”,如图2-20所示,舞台窗口也随之转换为图形元件的舞台窗口。
图2-20
(2)选择“椭圆”工具,在工具箱中将“笔触颜色”设为无,“填充颜色”设为黑色,在
舞台窗口中绘制一个垂直椭圆形。选择“选择”工具,选中椭圆,在“形状”属性面板中将“宽”
选项设为10,“高”选项设为22,取消对图形的选取,效果如图2-21所示。
(3)选择“部分”选取工具,在椭圆形的外边线上单击,出现多个节点,如图2-22所示。
单击需要的节点,按Delete键将其删除,效果如图2-23所示。使用相同的方法,删除其他节点,
效果如图2-24所示。
图2-21图2-22图2-23图2-24
(4)双击“库”面板中的“文字”图形元件,进入“文字”图形元件的舞台窗口,将“库”
面板中的图形元件“花瓣”拖曳到舞台窗口。
(5)选择“任意变形”工具,单击花瓣图形,出现控制点,将中心点拖曳到图形的底部中
心位置,如图2-25所示。按Ctrl+T组合键,弹出“变形”面板,选项的设置如图2-26所示,单击
“重制选取和变形”按钮,旋转并复制图形,效果如图2-27所示。
第2章图形的绘制与编辑
15
图2-25图2-26图2-27
(6)按需要多次单击“重制选取和变形”按钮,复制出多个图形,效果如图2-28所示。
选择“选择”工具,选取刚刚绘制所有的花瓣,按Ctrl+G组合键,将其组合。将组合图形拖
曳到适当的位置,并使用“任意变形”工具将其旋转到合适的角度,效果如图2-29所示。按
住Alt键的同时,用鼠标选中花图形,并拖曳到适当的位置,复制当前选中的图形,使用“任意
变形”工具,按住Shift键的同时,将其缩小,效果如图2-30所示。
图2-28图2-29图2-30
2.6.3.添加底图
(1)单击舞台窗口左上方的“场景1”图标,进入“场景1”的舞台窗口。将“时间轴”
面板中的“图层1”图层重命名为“背景”,如图2-31所示。
(2)选择“椭圆”工具,在工具箱中将“笔触颜色”设为无,“填充颜色”设为粉色(#FF3366),
在舞台窗口中绘制一个椭圆形,如图2-32所示。
图2-31图2-32
(3)单击“时间轴”面板下方的“新建图层”按钮,创建新图层并将其命名为“装饰图形”,
FlashCS5实例教程(第2版)
16
如图2-33所示。选择“文件>导入>导入到舞台”菜单命令,在弹出的“导入”对话框中选择
“Ch02>素材>绘制花店标志>01”文件,单击“打开”按钮,文件被导入到舞台中,选择“选
择”工具,将其拖曳到适当位置,效果如图2-34所示。
图2-33图2-34
(4)单击“时间轴”面板下方的“新建图层”按钮,创建新图层并将其命名为“文字”,
如图2-35所示。将“库”面板中的图形元件“文字”拖曳到舞台窗口中,并适当调整大小,如图
2-36所示。选择“选择”工具,选中“文字”实例,选择图形“属性”面板,在“色彩效果”
选项组中单击“样式”选项,在弹出的下拉列表中选择“色调”选项,将“着色”选项设为白色,
如图2-37所示,舞台窗口中的效果如图2-38所示。花店标志绘制完成,按Ctrl+Enter组合键即可
查看效果。
图2-35图2-36
图2-37图2-38
|
|