注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

清风的博客

我为人人,人人为我。

 
 
 

日志

 
 

对开透明卷轴  

2014-12-08 16:40:22|  分类: 【flash教程】 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |
制作步骤

    1.启动FLASH8 软件。

    2.确立文档属性 设置动画尺寸为700*450,帧频为12,背景颜色黑色,其它默认,点击确定,进入场景1。如图1所示:


screen.width-333)this.width=screen.width-333" border=0>


 
图1
 
    3.创建图形元件 创建三个图形元件。
 
    (1)选择“插入-新建元件”,创建一个名为“画面”的图形元件,点击确定,进入元件编辑区。添加一个图层,共两个图层。下层为背景,上层为图片。
    a.点击背景图层第一帧,用矩形工具在工作区拖一个规格为600*360,颜色为黑红色的无边矩形,全居中,上锁。
    b.点击图片图层第一帧,导入已准备好的图片至工作区,设置其规格为510*320,全居中,上锁。如图2所示:
 

screen.width-333)this.width=screen.width-333" border=0>


 
  图2 
 
    (2)选择“插入-新建元件”,创建一个名为“矩形”的图形元件,点击确定,进入元件编辑区。 用矩形工具在工作区拖一个规格为40*360。颜色为白色的无边框的矩形,全居中。如图3所示:

screen.width-333)this.width=screen.width-333" border=0>


图3
 
    (3)选择“插入-新建元件”,创建一个名为“画轴”的图形元件,点击确定,进入元件编辑区。用矩形和椭圆形工具画一个画轴,规格为14*422,颜色随意。如图4所示:

screen.width-333)this.width=screen.width-333" border=0>


图4
 
    4.组织制作场景 返回场景1,添加九个图层,共十个图层。自下而上分别命名为,如图5所示:
 

screen.width-333)this.width=screen.width-333" border=0>


图5
 
     (1)选择画面图层第一帧,从库中拖出画面图形元件至工作区,全居中。在第150帧插入帧,上锁。如图6所示:
 
screen.width-333)this.width=screen.width-333" border=0>
 
图6
 
     (2)选择蔗罩图层第一帧,从库中拖出矩形图形元件至工作区,将其打散,并设置其规格为64*375,并将其改为黄色。全居中。如图7所示:
 

screen.width-333)this.width=screen.width-333" border=0>


图7
 
在第100帧插入关键帧,用任意变形工具将该实例放大为600*375。如图8所示:
 

screen.width-333)this.width=screen.width-333" border=0>


图8
 
点击第1帧,创建本区域间的形状补间。在第150帧插入帧。设置该图层为蔗罩层。
 
     (3)选择画轴左图层第一帧,从库中拖出画轴图形元件至工作区,全居中后向左平移20个像素。如图9所示:
 

screen.width-333)this.width=screen.width-333" border=0>


图9
 
在第100帧插入关键帧,将画轴再向左平移到画面的左边。如图10所示:
 

screen.width-333)this.width=screen.width-333" border=0>

图10

点击第1帧,创建本区域间的动画补间。在第150帧插入帧。上锁。

     (4)选择背面左图层第一帧,从库中拖出矩形图形元件至工作区,全居中后,向左平移20个像素。如图11所示:

screen.width-333)this.width=screen.width-333" border=0>

图11

在第100帧插入关键帧,将该实例向左平移到画面左边。如图12所示:

screen.width-333)this.width=screen.width-333" border=0>

图12

点击第1帧,创建本区域间的动画补间。在第101帧插入空白关键帧,再在第150帧插入帧。上锁。

     (5)选择画面左图层第一帧,从库中拖出画面图形元件至工作区,设置透明度为30%。全居中后,向右平移约60个像素。在第150帧插入帧。如图13所示:

screen.width-333)this.width=screen.width-333" border=0>

图13

     (6)选择蔗罩左图层第一帧,从库中拖出矩形图形元件至工作区,改其颜色为绿色,全居中后,向左平移20个像素,和背面左完全重合。如图14所示:

screen.width-333)this.width=screen.width-333" border=0>

图14

在第100帧插入关键帧,之后,将该实例向左平移到和白色背面左重合,用任意变形工具将其缩小到8*360。如图15所示:

screen.width-333)this.width=screen.width-333" border=0>

图15

点击第1帧,创建本区域间的形状补间。在第150帧插入帧。设置该图层为蔗罩层。

    点击背面左图层前端(该图层变黑),将其向上推到蔗罩左的下边,然后再返回原处,上锁。此时它也成为蔗罩左的被蔗罩层。


     (7)选择画轴右图层第一帧,从库中拖出画轴图形元件至工作区,全居中后向右平移20个像素。如图16所示:

screen.width-333)this.width=screen.width-333" border=0>

图16

在第100帧插入关键帧,将画轴再向右平移到画面的右边。如图17所示:

screen.width-333)this.width=screen.width-333" border=0>

图17

     (8)选择背面右图层第一帧,从库中拖出矩形图形元件至工作区,全居中后,向右平移20个像素(这时背面左的右边和背面右的左边相连接)如图18所示:

screen.width-333)this.width=screen.width-333" border=0>

图18

在第100帧插入关键帧,将该实例向右平移到画面右边。如图19所示:

screen.width-333)this.width=screen.width-333" border=0>

图19

点击第1帧,创建本区域间的动画补间。在第101帧插入空白关键帧,再在第150帧插入帧。上锁。

     (9)选择画面右图层第一帧,从库中拖出画面图形元件至工作区,设置其透明度为30%。全居中后,向左平移约60个像素。在第150帧插入帧。如图20所示:

screen.width-333)this.width=screen.width-333" border=0>

图20

     (10)选择蔗罩右图层第一帧,从库中拖出矩形图形元件至工作区,全居中后,向右平移20个像素,和背面右完全重合。如图21所示:

screen.width-333)this.width=screen.width-333" border=0>

图21

将其打散后转变为绿色,在第100帧插入关键帧,之后,将该实例向右平移到和白色背面右重合,用任意变形工具将其缩小到8*360。如图22所示:

screen.width-333)this.width=screen.width-333" border=0>

图22

点击第1帧,创建本区域间的形状补间。在第150帧插入帧。设置该图层为蔗罩层。

    点击背面右图层前端(该图层变黑),将其向上推到蔗罩右的下边,然后再返回原处,上锁。此时它也成为蔗罩右的被蔗罩层。


  
    5.该作业完成后的时间轴如图23所示:
 

screen.width-333)this.width=screen.width-333" border=0>


图23
 

    6.测试存盘

 

    *说明:如果想要关闭卷轴方法有二:

    1.分别右键每个图层的第100帧,复制帧,然后,在第151帧粘贴帧;再右键第1帧,在第250帧粘贴帧。然后创建相应的补间。

    2.将各图层第1-100帧刮黑,然后,右键刮黑处,复制帧,在第151帧粘贴帧,再将第151帧-250帧刮黑,右键刮黑处,翻转帧即可。(使用此种方法移到要注意:刮黑所有帧时,且不可使实例串帧变层)

 

      最终效果显示:


http://hsb345.16789.net/domName/hsb345/200851022313367791.swf

全屏下载

  评论这张
 
阅读(53)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017