设为首页收藏本站
开启辅助访问
 找回密码
 注册
返回列表 发新帖

螺旋动态边框的制作原理和方法 [复制链接] (0/635)

来无踪去无影
鲜花(24) 鸡蛋(0)
发表于 2013-11-9 23:58 | 显示全部楼层 |阅读模式

马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。

您需要 登录 才可以下载或查看，没有帐号？注册

x
    作前准备
    1.准备一张规格为550*400的背景图片(宽只能等于或大于550)，经过制图软件（ps、fw）处理后，保存到指定的文件夹待用。
    2.准备一首缓冲效果好，有效期久远的mp3歌曲地址，保存到指定的文件夹待用。
    制作过程
    1.启动flash8软件。
    2.确立文档属性 设置动画尺寸为550*400，幀频12，其它默认,点击确定，进入场景1。如图1所示：
图1
    3.首先将准备好的素材图片导入库中，待用。

（素材图）
    4.创建图形元件
    （1）选择“插入－新建元件”，建立一个名为“组合”的图形元件，点击确定，进入元件编辑区。就一个图层。
    选择图层1第一帧，从库中拖出背景素材图片到舞台规格550*400，右对齐－垂直中齐。如图1所示：
图1
在从库中拖出该素材图片到舞台，规格为550*400，水平翻转后，左对齐－垂直中齐。如图2所示：
图2
点击第一幀，选中舞台所有实例，选择“修改－组合”后，右对齐－垂直中齐。如图3所示：
图3
在从库中拖出该素材图片到舞台，规格为550*400，左对齐－垂直中齐。如图4所示：
图4
    （2）选择“插入－新建元件”，建立一个名为“01”的图形元件，点击确定，进入元件编辑区。就一个图层。
    选择图层1第一帧，用矩形工具在舞台拖一个规格为30*30的正方形，颜色随意，全居中。点击该实例，打开混色器，设置其参数，如图5所示：

图5
完成后的舞台实例，如图6所示：
图6
    5.创建影片剪辑元件
    （1）选择“插入－新建元件”，建立一个名为“滚动”的影片剪辑元件，点击确定，进入元件编辑区。就一个图层。
    选择图层1第一帧，从库中拖出“组合”图形元件到舞台，规格不变，右对齐－垂直中齐。如图5所示：

图5
在第150幀插入关键帧，按方向键，将该幀舞台实例向左平移到第3张图片的有边缘和舞台中心重合。如图6所示：
图6
创建本区域间的动画补间，在第149幀插入关键帧，删除第150幀。上锁。第149幀舞台实例的位置，如图7所示：
图7
*这样处理的目的是让组图滚动起来不停顿、不抖动、不空挡。（至于为什么自己在制作中慢慢领悟）
    （2）选择“插入－新建元件”，建立一个名为“02”影片剪辑元件，点击确定，进入元件编辑区。就一个图层。
    选择图层1第一帧，从库中拖出“01”图形元件到舞台，规格不变，全居中。如图8所示：

                               
登录/注册后可看大图
图8
在第100幀插入关键帧，点击第1幀，在属性面板创建本区域间的动画补间，并设置其顺时针旋转一周。如图9所示：
图9
在第99幀插入关键帧，删除第100幀。完成后的时间轴，如图10所示：
图11
完成后的舞台实例，如图12所示：
图12
    （3）选择“插入－新建元件”，建立一个名为“03”的影片剪辑元件，点击确定，进入元件编辑区。就一个图层。
    选择图层1第一帧，从库中拖出“02”影片剪辑元件到舞台，规格不变，位置随意。如图11所示：
图12
（此图放大一倍）
复制－粘贴该实例一次，用任意变形工具选中将新转贴的实例，将其旋转一个角度（约18°），然后将移到和前一个实例相衔接的合适的位置上，垂直中齐。如图13所示：
图13
（此图放大一倍）
复制－粘贴该实例一次，用任意变形工具选中将新转贴的实例，将其旋转一个角度（约18°），然后将移到和前一个实例相衔接的合适的位置上，垂直中齐。如图14所示：
图14
（此图放大一倍）
复制－粘贴该实例一次，用任意变形工具选中将新转贴的实例，将其旋转一个角度（约18°），然后将移到和前一个实例相衔接的合适的位置上，垂直中齐。如图15所示：

图15
（此图放大一倍）
复制－粘贴该实例一次，用任意变形工具选中将新转贴的实例，将其旋转一个角度（约18°），然后将移到和前一个实例相衔接的合适的位置上，垂直中齐。如图16所示：

图16
（此图放大一倍）
复制－粘贴该实例一次，用任意变形工具选中将新转贴的实例，将其旋转一个角度（约18°），然后将移到和前一个实例相衔接的合适的位置上，垂直中齐。如图17所示：
图17
（此图放大一倍）
    （4）选择“插入－新建元件”，建立一个名为“04”的影片剪辑元件，点击确定，进入元件编辑区。添加一个图层，共两个图层。自下而上命名为图层1、图层2。
    选择图层1第一帧，从库中拖出“03”影片剪辑元件到舞台，规格不变，左对齐－垂直中齐。上锁。如图18所示：
图18
（此图放大一倍）
    选择图层1第一帧，从库中再拖出“03”影片剪辑元件到舞台，规格不变，将其放置在上一个实例的右侧相衔接，调整好位置，垂直中齐。如图19所示：
图19
（此图放大一倍）
    （5）选择“插入－新建元件”，建立一个名为“05”的影片剪辑元件，点击确定，进入元件编辑区。添加一个图层，就一个图层。
    选择图层1第一帧，从库中拖出“04”影片剪辑元件到舞台，规格不变，左对齐－垂直中齐。上锁。如图20所示：
图20
（此图放大一倍）
复制－粘贴该实例一次，然后将其移到和前一个实例相衔接的合适的位置上，垂直中齐。如图21所示：

图21  
（此图放大一倍）
再粘贴该实例一次，然后将其移到和前一个实例相衔接的合适的位置上，垂直中齐。如图22所示：
图22
（此图放大一倍）
同理同种方法，依次再粘贴该实例5次，完成彼此间的相互衔接，使其总长度超过550。如图23所示：
图23
    6.编辑制作场景
返回场景1，添加三个图层，共四个图层。自下而上命名为滚动、螺旋、蝴蝶、as。   
    （1）选择滚动图层第1幀，从库中拖出“滚动”影片剪辑元件到舞台，规格不变，左对齐－垂直中齐。上锁。如图24所示：



图24
    （2）选择螺旋图层第1幀，从库中拖出“05”影片剪辑元件到舞台，规格不变，水平中齐－上对齐。如图25所示：
图25
再从库中拖出“05”影片剪辑元件到舞台，规格不变，将其垂直翻转，水平中齐－下对齐。上锁。如图26所示：
图26
再从库中拖出“05”影片剪辑元件到舞台，规格不变，将其顺时针翻转90°，再垂直翻转。右对齐－垂直中齐。如图27所示：
图27
再从库中拖出“05”影片剪辑元件到舞台，规格不变，将其逆时针翻转90°，再垂直翻转。左对齐－垂直中齐。上锁。如图28所示：
图28
    （3）选择蝴蝶图层第1幀，依次从库中拖出四个“蝴蝶”影片剪辑元件到舞台，将其放置在螺旋边框的四个角上，调整好规格、位置。上锁。如图29所示：
图29
    （4）选择as图层第1幀，按f9，打开作面板在as编辑区输入，如下幀语句：
var music:Sound = new Sound();
music.onSoundComplete = function() { music.start();};
music.loadSound("http://www.duliya.com/UploadFiles/User/229/201209/2012090909170617691.mp3", true);
*语句中红色部分为你准备加载的歌曲地址。上锁。
    7.本作业完成后的时间轴如图30所示：


图30
    8.测试存盘
    说明：
    我在02影片剪辑中各实例的衔接摆放不是太好，你制作时要好好调整各实例的位置和角度，这一步十分关键，它直接影响动态螺旋的合理性和协调性。
   
最终效果显示效果：
祝你成功
回复 鲜花(24) 鸡蛋(0)

使用道具 举报

返回列表 发新帖
高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 注册

本版积分规则


GMT+8, 2024-12-22 12:03 , Processed in 0.048122 second(s), 17 queries , Gzip On, Redis On.


快速回复 返回顶部 返回列表