网站首页 手机版
 注册 登录
您现在的位置: 畅无忧设计 >> 媒体动画 >> Flash教程 >> Flash基础 >> 正文
最新文章
· 完整把握Flash动画设计的知识体系
· Flash8与javascript集成
· 第十七课 综合应用范例―幻彩图片
· 第十六课 时间轴特效应用范例―满天花
· 第十五课 混合模式应用范例―动画片头
· 第十四课 滤镜应用范例―水波荡漾
· 第十三课 行为和行为面板
· 第十二课 在Flash中应用视频
· 第十一课 在Flash中应用声音
· 第十课 按钮元件
热门文章
 第九课 自定义缓入/缓出动画范例―
 完整把握Flash动画设计的知识体系
 第一课 Flash8 工作环境
 第十六课 时间轴特效应用范例―满天
 第十四课 滤镜应用范例―水波荡漾
 第六课 动作补间动画
 第四课 逐帧动画
 第十五课 混合模式应用范例―动画片
 第二课 Flash8基础绘图工具
 第十课 按钮元件
相关文章
第十七课 综合应用范例―幻彩图片
第十六课 时间轴特效应用范例―满天花雨
第十五课 混合模式应用范例―动画片头
第十四课 滤镜应用范例―水波荡漾
第十三课 行为和行为面板
第十二课 在Flash中应用视频
第十一课 在Flash中应用声音
第十课 按钮元件
第九课 自定义缓入/缓出动画范例―逼真弹
第八课 引导路径动画
第七课 遮罩动画
第六课 动作补间动画
第五课 形状补间动画
第四课 逐帧动画
第二课 Flash8基础绘图工具
第一课 Flash8 工作环境
Flash基础教程专题
第三课 绘图综合练习—情人节贺卡
来源:闪客启航 更新时间:2009/5/2 3:06:25 阅读次数:
字体:[ ] 我要投稿
    本节要制作一个综合范例――情人节贺卡。在这个范例的制作过程中会使用前面学习的很多绘图工具,并且讲解一些新的绘图方法和技巧。
另外,由于这个范例图形比较复杂,我们还使用了“图形元件”这个对象类型,利用“图形元件”可以更加方便的制作复杂图形。
范例最终效果如图2-105所示。
图2-105 情人节贺卡

1. 绘制“烛焰”元件

(1)新建一个Flash8影片文档。设置舞台背景颜色为蓝色,其他保持默认设置。
(2)执行【插入】|【新建元件】命令,或者按快捷键Ctrl+F8,弹出【创建新元件】对话框,在【名称】文本框中输入元件名称为“烛焰”,选择【行为】为【图形】。如图2-106所示。
图2-106 新建图形元件
(3)单击“确定”按钮,进入到“烛焰”元件的编辑场景。使用【椭圆工具】绘制一个仅有边框无填充色的椭圆,使用【选择工具】调整,如图2-107所示。
图2-107 绘制烛焰边框
(4)执行【窗口】|【混色器】命令,填充样式设为放射状。在渐变条上将左边色标设置为白色,并拖动到偏右方以加大白色在整个渐变色中的比例。将右边色标设置为黄色,如图2-108所示。
图2-108 混色器设置
(5)将场景中的图形填充渐变色后,烛焰的色彩并不尽如人意,需要使用【填充变形工具】进行调整。选择【填充变形工具】单击填充色,会出现一个边上带有三个手柄的环形边框。我们用鼠标分别按住中心的圆圈或边上的手柄里推外拉、上下左右的进行调整,现在将烛焰的颜色调整为上下略带一点黄色,上边黄色略多,如图2-109所示。
图2-109 调整填充色

2. 绘制“烛身”元件

(1)执行【插入】|【新建元件】命令,或者按快捷键Ctrl+F8,弹出【创建新元件】对话框,在【名称】文本框中输入元件名称为“烛身”,选择【行为】为【图形】。
(2)单击“确定”按钮,进入到“烛身”元件的编辑场景。使用【椭圆工具】绘制一个仅有边框无填充色的椭圆,使用【选择工具】略加调整,并使用【任意变形工具】进行旋转,如图2-110所示。
图2-110 绘制烛身元件
(3)打开【混色器】面板,填充样式设为放射状。在渐变条上将左边色标设置为黄色(#F5DD38),并拖动到偏右方;将右边色标设置为红色(#F76648),如图2-111所示。
图2-111 设置填充色
(4)填充渐变色后,使用【填充变形工具】调整,如图2-112所示。
图2-112 调整填充色
(5)为使烛身更漂亮,在刚刚作好的图形旁边画一个无边框的椭圆,颜色填充设置如图2-113所示。左边色标设置为#F76648,右边色标设置为#F5DD38。
图2-113 设置填充色
(6)椭圆画好后用【任意变形工具】调整倾斜,如图2-114所示。
图2-114 绘制椭圆
(7)使用【选择工具】将画好的椭圆拖放到烛身上,如图2-115所示。
图2-115 调整椭圆位置
(8)选择【刷子工具】,在选项中将刷子大小选择略小一点的笔刷,填充色设为淡黄色,在烛身上添加高光,删除边框线条,完成烛身元件造型。如图2-116所示。
图2-116 绘制高光

3. 绘制“烛光”元件

(1)执行【插入】|【新建元件】命令,或者按快捷键Ctrl+F8,弹出【创建新元件】对话框,在【名称】文本框中输入元件名称为“烛光”,选择【行为】为【图形】。
(2)单击“确定”按钮,进入到“烛光”元件的编辑场景。打开【混色器】面板,填充样式设为放射状。将鼠标移近渐变条,当鼠标指针右下角出现一个加号时,单击鼠标,在渐变条上增加一个色标。将左边色标设置为黄色,并稍向右移;中间色标为红色;右边色标为白色,为使光焰呈模糊虚幻而不突兀,将右边白色色标的Alpha值调整为零,如图2-117所示。
图2-117 设置填充色
(3)使用【椭圆工具】绘制一个无边框的正圆,如图2-118所示。
图2-118 绘制无边框正圆
(4)使用【任意变形工具】将其纵向收缩。如图2-119所示。
图2-119 收缩变形

4. 组装“蜡烛”元件

(1)新建一个名字为“蜡烛”的图形元件。进入到这个元件的编辑场景中。
(2)“蜡烛”元件共分三层。先制作烛身层。双击时间轴上“图层1”,将“图层1”改名为“烛身”。如图2-120所示。
图2-120 修改图层名
(3)按Ctrl+L组合键打开【库】面板,将“烛身”元件拖放到舞台上。选中该元件按住Alt键向下拖放进行复制,如图2-121所示。
图2-121 复制烛身元件
(4)选中所有元件,执行【修改】|【对齐】|【左对齐】命令,再执行【按高度均匀分布】命令,效果如图2-122所示。
图2-122 对齐元件
(5)使用【任意变形工具】旋转最上面和最下面的元件,如图2-123所示。
图2-123 旋转上下元件
(6)将鼠标指向“烛身”图层上,单击右键,在弹出的快捷菜单中选择【插入图层】命令。系统默认插入图层为“图层2”,双击“图层2”,改名为“烛焰”。将【库】面板中“烛焰”元件拖放到合适位置。如图2-124所示。
图2-124 放置烛光元件
(7)插入一个新图层,将图层改名为“烛光”。将“烛光”元件拖放到舞台上。因为烛光在蜡烛的后面,所以用鼠标选择“烛光”层,将它拖放到“烛身”层下方。现在三层的排列顺序如图2-125所示。
图2-125 图层顺序
(8)在【属性】面板中将背景色改为黑色,使蜡烛的色彩更明亮。完成后的蜡烛如图2-126所示。
图2-126 蜡烛完成效果

5. 绘制“心”元件

(1)执行【插入】|【新建元件】命令,或者按快捷键Ctrl+F8,弹出【创建新元件】对话框,在【名称】文本框中输入元件名称为“心”,选择【行为】为【图形】。
(2)单击“确定”按钮,进入到“心”元件的编辑场景。使用【线条工具】绘制一条竖线,再使用【选择工具】将其调整为曲线,如图2-127所示。
图2-127 将直线调整为曲线
(3)选择【部分选取工具】,单击曲线端点,端点上会出现调节手柄。上下左右移动手柄,将该曲线调整为如图2-128所示形状。
图2-128 调整曲线形状
(4)选中该该曲线,执行【编辑】|【复制】命令,再执行【编辑】|【粘贴到中心位置】命令,选择粘帖得到的曲线,执行【修改】|【变形】|【水平翻转】命令,如图2-129所示。
图2-129 复制曲线后水平翻转
(5)将该两条曲线拖放连接好,成为一个心形,如图2-130所示。
图2-130 完成心形
(6)打开【混色器】面板,填充样式设为线性。在渐变条上将左边色块设置为#AF057C,将右边色块设置为#E207C8,如图2-131所示。
图2-131 设置填充色
(7)使用【颜料桶工具】从右下向左上拖动鼠标填充颜色,并删除白色边框线,如图2-132所示。
图2-132 填充颜色
(8)选中这个心形,右击它,在弹出的快捷菜单中选择“复制”命令,然后在时间轴上将此层锁定。
(9)插入新图层,系统默认为“图层2”,执行“编辑”|“粘贴到当前位置”命令。创建此层的目的是为使心形下方边上呈现白色高光,所以此层的心形比图层1上的心形略小。如果使用【任意变形工具】来调节是很不容易达到这个目的。这里执行【窗口】|【设计面板】|【变形】命令,弹出【变形】面板,设置变形宽度为97%,约束默认为打勾状态,按回车键确定,就可以使图形实现精确的变形。变形面板设置如图2-133所示。
图2-133 “变形”面板
(10)打开【混色器】面板,填充样式设为放射状。在渐变条上将左边色块设置为玫红色(#F91CEE),将右边色块设置为白色,白色的Alpha值为78%,如图2-134所示。
图2-134 设置填充色
(11)将“图层2”的心形填充上述调整好的填充色,并使用【填充变形工具】进行调整,按住方形手柄向外拖动,使填充色变为椭圆状,再按住中心点向上移动。为了使大家能够清楚观察调整的情况,特将背景色暂改为蓝色,如图2-135所示。
图2-135 调整填充色
(12)现在只是使这一层的心形下方颜色变亮了,但并未因此而形成高光状态,所以我们还得在此层上再加一层,掩盖住多余的白色,只留出两边的高光。复制“图层2”的心形,然后锁定“图层2”。
(13)插入一个新图层,系统默认为“图层3”,执行“编辑”|“粘贴到当前位置”命令。
(14)将此层的心形填充新的渐变色。设置渐变色样式为放射状,左边色块为#FA3AF0,右边色块为#F444C9,Alpha值为62%,如图2-136所示。
图2-136 设置填充色
(15)填充此色后会发现并没有出现我们希望的效果。因为填充的色彩虽然外周是半透明的,但这个透明色是圆形,无论怎么样调整都无法达到心形状态。执行【修改】|【形状】|【柔化填充边缘】命令,弹出“柔化填充边缘”对话框,设置距离30px,步骤数为10,如图2-137所示。
图2-137 柔化填充边缘设置
现在看效果已经出来了。如图2-138所示。
图2-138 柔化后效果
(16)目前这个心形的立体感并不强,因为主要的高光部分还没添加上去。锁定“图层3”,插入新图层,在“图层4”中将刚刚复制的“图层2”的心形再次执行【编辑】|【粘帖到当前位置】命令,使用【选择工具】框选心形的下半部分并将其删除,如图2-139所示。
图2-139 删除心形下半部分
(17)使用【部分选取工具】将下端的直线调整为曲线,并使两端尽量圆滑。如图2-140所示。
图2-140 调整圆滑
(18)打开“混色器”面板,将填充色样式改变线性,设置两边色块均为白色,右边色块Alpha为0%,如图2-141所示。
图2-141 设置填充色
填充颜色后,使用【填充变形工具】进行调整,如图2-142所示。
图2-142 调整填充色
到此为止,“心”元件制作完毕。

6. 绘制“珍珠”元件

(1)“珍珠”元件的制作很简单,关键是填充色的设置。使用【椭圆工具】画一个无填充色的正圆。
(2)打开【混色器】面板,填充样式设为放射状。左边色块设置为灰色(#A09696),并稍向右移,右边色块为浅黄色(#F5F0D8),如图2-143所示。
图2-143 设置填充色
(3)使用【颜料桶工具】在靠圆心左上的地方单击鼠标,或者在任意地方单击鼠标后再用【填充变形工具】进行调整。如图2-144所示。
图2-144 调整填充色
(4)复制该圆形,插入新图层,在“图层2”执行【编辑】|【粘贴到当前位置】命令。将填充色更改为如图2-145所示设置。样式放射状,左边色块白色,右边色块浅黄色(#F4F1CC),Alpha为0%。
图2-145 设置填充色
完成后的珍珠如图2-146所示。
图2-146 珍珠效果

7. 制作“项链”元件

(1)新建一个名字为“项链”的图形元件。
(2)这个元件分两层。图层1画上心形曲线,如图2-147所示。
图2-147 绘制心形曲线
(3)在“图层2”上沿上面的曲线将“珍珠”元件均匀的放置好。如图2-148所示。
图2-148 放置珍珠元件

8. 制作“情人节”元件

(1)新建一个名字为“情人节”的图形元件。
(2)在这个元件的编辑场景中。选择【文字工具】,在“属性”面中设置文本类型为【静态文本】,【字体】为方正行楷简体,字体大小、颜色随意,因为后面还会再作调整。
(3)在舞台上输入“情人节”三字,连续执行两次【修改】|【分离】命令,使其呈网点状成为可编辑形状的图形状态。如图2-149所示。
图2-149 分离文字
(4)用【橡皮擦工具】擦去“情”字两点,再使用【选择工具】将鼠标放到“节”字下端向左下方拖动将其拉长。如图2-150所示。
图2-150 使文字变化
(5)使用【选择工具】将“节”字下方被拉长部分调整为曲线状。
(6)在【混色器】面板中设置填充样式为线性,左边和右边色块为红色,中间色块为白色,如图2-151所示。
图2-151 设置填充色
(7)使用【选择工具】框选所有文字,使用【颜料桶工具】在文字上从上向下拖动鼠标填充颜色,然后将笔触颜色设为白色,使用【墨水瓶工具】,挨个单击文字,给文字加上白色边框。效果2-152如图所示。
图2-152 填充颜色
(8)插入新图层,打开“库”面板。在“图层2”上拖放入“心”元件,用【任意变形工具】调整到适合大小,分别放到情字和节字上,如图2-153所示。
图2-153 放置心形元件

9. 完成整个画面制作

(1)单击“时间轴”上的按钮,返回到“场景1”。
(2)新建2个图层,并将所有图层分别重新命名为“蜡烛”、“心”和“项链”。
(3)在“蜡烛”图层放入“蜡烛”元件,在“心”图层放入“心”和“情人节”元件,在“项链”图层放入“项链”元件。将这些对象摆放成合适的位置。
(4)还可以绘制一些光影元件(这里不再详述制作方法,请参看源文件)放在“蜡烛”图层中,以增加效果。范例最终如图2-105所示。
至此,本范例制作完毕。
  • 上一篇文章:
  • 下一篇文章:
  • 关于我们 - 联系我们 - 广告服务 - 在线投稿 - 友情链接 - 网站地图 - 版权声明
    CopyRight 2008-2010, CWYDESIGN.COM - 畅无忧设计, Inc. All Rights Reserved
    滇ICP备09005765号