Flash基础精彩实例教程：飘动的彩旗

日期：2007年8月11日作者：查看:[大字体中字体小字体]

[前言]1、初学者写的教程面向初学者，让我们一起成为高手吧！（我写的比较啰嗦，但制作起来却是很简单的）
2、我在论坛发过此贴——请初学者用遮罩做出此效果，很多如我一样的初学者都很踊跃地跟贴交作业，但效果还是差一点点。现将我的制作思路写出来。

[效果]：

[要求]

1、防止靠近旗杆的旗上下抖动
2、使旗在滚动时畅而不滞

[目的]

熟练掌握引导层和遮罩的使用方法

[步骤]

第一步：新建图形元件，名称为“静止的旗”；在里面画一个无边框的矩形，宽30像素、高40像素、填充红色、相对于舞台左对齐和上对齐；按下工具栏中的“选择工具”，不选中矩形，把鼠标移到矩形的上边位置，当鼠标下方出现一条黑色的弧线时，按住鼠标往上拖；同样，把矩形的下边也往上拖。选中变形后的矩形，按住Ctrl键的同时往右拖出一个（即复制一个），选中复制出来的图形，然后选择“修改”菜单下的“变形”中的“垂直翻转”，并把X坐标设置为30、Y坐标设置为0；用鼠标在图形点击选中，按住Ctrl键的同时往右拖出一个，其X坐标设置为60、Y坐标与左边的图形相同（变形后的图形X坐标发生了变化，已经不为0了）。具体设置和效果如图1：

第二步：在库中选中元件“静止的旗”，右键选择“直接复制”，在弹出的对话框中将名称改为“遮罩原图”，点击“确定”按钮；在库中双击元件“遮罩原图”，进入“遮罩原图”的编辑场景；选中图形（记住其高度），用“选择工具”删除下部分的波浪形，再把其高度设置为原来的高度(不一定与图中的高度一样）。具体设置和效果如图2：

第三步：新建影片剪辑元件，名称为“滚动的旗”，在里面创建两个图层，图层名称从上到下依次为“引导层”、“静止的旗”；把“静止的旗”元件拖入到“静止的旗”图层上，相对于舞台左对齐和上对齐；双击该元件，进入“静止的旗”元件编辑场景中，在工具栏中选择“墨水瓶”工具，给图形描边黑色的边线，选中边线，双击边线按住Ctrl+X键剪切；回到“飘动的旗”的编辑场景中，再按住Ctrl+X键粘贴到“引导层”图层上，删除两边和下边的线，只留下上边线，相对于舞台水平中齐和上对齐，并延长帧至第30帧处，锁定该图层；选中元件“静止的旗”，按下工具栏中的“任意变形工具”，把图中出现的小白圆拖到上边的黑线上，在第30帧处插入关键帧，并创建补间动画，把第30帧的元件X坐标设置为-58，并把元件往上移，直到小白圆在黑线上为止；选中“引导层”图层，右键选择引导层；选中“静止的旗”图层稍稍往上拖（注意引导层图层图标的变化）。具体设置和效果如图3：

第四步：新建影片剪辑元件，名称为“遮罩层动画”，把库中的元件“遮罩原图”拖入，相对于舞台左对齐和上对齐；在第30帧处插入关键帧，把第30帧处的元件X坐标设置为-58，并创建补间动画。具体设置和效果如图4：

第五步：新建影片元件，名称为“飘动的旗”，创建两个图层，图层名称从上到下依次为“遮罩层动画”、“滚动的旗”;把“遮罩层动画”和“滚动的旗”分别拖入到相应的图层中；把“遮罩层动画”元件顺时针旋转90°，并把各个图层上的元件均设置成为相对于舞台左对齐和上对齐；选中“遮罩层动画”图层，右键选择遮罩层。具体设置和效果如图5：

第六步：创建“旗杆”新图形元件，用渐变工具画一细长矩形；把“旗杆”拖入到主场景中，在下层把“飘动的旗”也拖入，分别放到合适的位置上。

[思考与交流]

1、你是否能用形状补间做出飘动的效果？
[1] [2] 下一页
Flash基础精彩实例教程：飘动的彩旗相关文章：
·非主流ps教程实用的技巧大全
·解读身份认证技术现实化
·Vista系统实现自动关机技巧
·Illustrator传统风格名片设计实例
·AutoCAD造型实例：十字形螺丝刀头
·AutoCAD造型实例：一字形螺丝刀头
·Mac+Win实测 Boot Camp还是虚拟机？
·Illustrator绘制精美三维图表实例
·JavaScript/JS实现标题栏跑马灯
·CSS实例布局:上中下三行中间自适应
Flash基础精彩实例教程：飘动的彩旗相关软件
·《实况足球2007》粤语存档繁体中文版
·《NBA实况篮球》街机模拟器
·《实况足球8》欧洲PC版商店所有物品存档
·超任游戏《实况足球4》模拟器
·《实况足球9》实用工具集
·大案纪实：惊天绑架案
·《沙嘴红灯区》(长篇纪实小说)
·真实摔跤
·中国第一颗原子弹制造纪实：596秘史
·实况足球2008

上一篇:Adobe Flex Builder 3 新功能预览

下一篇:小心行驶万年船升级XP到VISTA技巧

特别声明：本站除部分特别声明禁止转载的专稿外的其他文章可以自由转载，但请务必注明出处和原始作
者.文章版权归文章原始作者所有.对于被本站转载文章的个人和网站，我们表示深深的谢意。如果本站转
载的文章有版权问题请联系编辑人员,我们尽快予以更正. 转载请注明来源：http://www.hackhome.com

Flash基础精彩实例教程：飘动的彩旗

精品推荐

热点TOP10

特别推荐