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

.

彼岸桃花专版风格

 
 
 

日志

 
 

FLASH原创动画教材实例;旋转相册  

2012-01-29 18:00:09|  分类: FLASH教程 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

FLASH原创动画教材实例;旋转相册

 

舞动的探戈 

 

*** 先分析一下:

1、从画面看场景中有二个影片剪辑,一个是中间的大图的影片剪辑(我简称为d),一个是像“快乐大转盘”的影片剪辑(我简称为sl)。

2、“快乐大转盘”的影片剪辑sl,在转动的时候,里面的缩略图也在自转,这缩略图就是sl的子mc,里面共有8个子mc.那么为什么要自转呢,因为如果不自转,缩略图就不能保持水平状态。动一下脑子,可以断定sl顺时针旋转,缩略图必定逆时针旋转,这样就能保持平衡(sl和缩略图影片剪辑它们的帧数的长度肯定是一样,要不然就不能平衡)。

3、把鼠标移到sl上任意一个缩略图上,sl就停止转动,里面的缩略图也停止转动;按下鼠标就显示大图;鼠标离开缩略图sl又旋转了,里面的缩略图也自转了。这一条所述的效果肯定由as代码操从。

4、代码涉及到:当(鼠标移到缩略图上时){停止播放sl、停止播放缩略图mc}。
             当(鼠标离开缩略图上时){播放sl、播放缩略图mc}。
             当(鼠标在缩略图上按下时){播放大图d}(其实大图d不止一个,共有8个)。
      另外还有一句至关重要,就是因为大图在主场景中分八个层,影片播放时显示的是最上层的图,如果你不加命令控制,这8张图全部显示出来,因此当你点击非第一张缩略图时,尽管它播放了d的大图,但被上面一张大图所说覆盖,所以我们必须再加一句命令来控制(这一句我是跟博士老师学的。):
             当(鼠标在缩略图上按下时){除了该缩略图的大图可见外,其他大图mc均为不可见}。
分析以后我们写教程就比较简单了。

***具体操作:

新建文档,导入8张图片。图片最好处理过,大小一样为最佳,另外要考虑圆形取景的因素。

下面分三个大步骤来叙述:

一、制作大转盘mc:大转盘mc是一个嵌套的影片剪辑,先要从最里面的做起:
1、制作8个圆形的缩略图mc:
⑴ 插入/新建元件/影片剪辑(名为m1);
⑵ 建立二个层,第一层第一帧拖入图片1,把它调小到适当的尺寸;
⑶ 第二层第一帧,画一个无边线正圆,大小与图片相同(我取100),设为遮罩层。
⑷ 其他7个缩略图mc(m2~m8),如法炮制。

2、制作8个会自转的缩略图mc:
⑴ 插入/新建元件/影片剪辑(名为z1);
⑵ 第一层第一帧拖入m1,第100帧插入关键帧,在1~100帧中间点一下,在属性面板里“补间”选择“动画”;“旋转”选择“逆时针”1周。
⑶ 其他7个会自转的缩略图mc(z2~z8),如法炮制。

3、再做一个静止的大转盘mc:
⑴ 插入/新建元件/影片剪辑(名为s);
⑵ 第一层第一帧画一个大圆,大小自定(我取350),圆周等分一下,分为8等分,具体分法不再赘述(提示:可以画一条穿过圆心的直线,利用变形复制的办法)。
⑶ 第二层第一帧把z1~z8分别拖入到场景,位置放在大圆的外边,中心与八个点对齐。每个mc在属性面板里都为它填上实例名z1~z8。然后把图层一删除,不过为了在主场景中制作方便,这一步你可以以后再做。

4、制作转动的大转盘mc:
⑴ 插入/新建元件/影片剪辑(名为sl);
⑵ 第一层第一帧拖入s实例名s,第100帧插入关键帧,创建动画补间,顺时针旋转一周。

二、制作8个大圆mc:
⑴ 插入/新建元件/影片剪辑(名为d1)只要把原图片拖入场景就可以了。(注意:大图的序号要和缩略图的序号相对应,后面输入代码时不要搞错。)
⑵ 其余d2~d8如法炮制。

注意:制作8个大圆mc还有一个非常好的办法,那是博士版主提供的,请见6楼。

三、组装:
⑴ 回到主场景建立10个图层,
⑵ 图层1拖入转动的大转盘mc,在属性面板里为它填上实例名sl,居中对齐;
⑶ 图层2~9分别拖入d1~d8mc,每个mc在属性面板里都为它填上实例名(d1~d8),全部居中对齐;
⑷ 图层10做一个大图的遮罩层,按照“大转盘”的圆画一个无边线的圆(画的时候可先隐藏图层2~9),大小与其一样。设置为遮罩层。
(然后回到s中把图层一删除。)

四、加代码:
下面的代码看似很多,其实你仔细辨认一下,都是一个品种,不要害怕。

回到静止的大转盘mc(s)中,分别点击每个自转的缩略图mc,为它们加入as代码。
例如:选中z1,打开动作面板,输入代码:
on (release) {
        _root.d1._visible = true;
        _root.d1.play();
        _root.d2._visible = false;
        stop();
        _root.d3._visible = false;
        stop();
        _root.d4._visible = false;
        stop();
        _root.d5._visible = false;
        stop();
        _root.d6._visible = false;
        stop();
        _root.d7._visible = false;
        stop();
        _root.d8._visible = false;
        stop();
}

以上这段代码意思是:当(鼠标在z1上按下时){
                       主场景中的d1设置为可见;
                       主场景中的d1播放;
                       主场景中的d2~d8设置为不可见;
                       停止;}

on (rollOver) {
        _root.sl.stop();
        _root.sl.s.z1.stop();
        _root.sl.s.z2.stop();
        _root.sl.s.z3.stop();
        _root.sl.s.z4.stop();
        _root.sl.s.z5.stop();
        _root.sl.s.z6.stop();
        _root.sl.s.z7.stop();
        _root.sl.s.z8.stop();
}

以上这段代码意思是:当(鼠标滑到z1时){
                       主场景中的sl停止播放;
                       主场景中的sl中的s中的z1~z8停止播放;                      
                       }


on (rollOut) {
        _root.sl.play();
        _root.sl.s.z1.play();
        _root.sl.s.z2.play();
        _root.sl.s.z3.play();
        _root.sl.s.z4.play();
        _root.sl.s.z5.play();
        _root.sl.s.z6.play();
        _root.sl.s.z7.play();
        _root.sl.s.z8.play();
}

以上这段代码意思是:当(鼠标滑离z1时){
                       主场景中的sl播放;
                       主场景中的sl中的s中的z1~z8播放;                      
                       }

注意:
①以上三段代码一起写入z1中,中间的注解不要。
②然后根据这个原理z2~z8分别写入这三段代码,要注意的是每个mc的第一段有三句要更改一下,具体我不讲了,要求你动一下脑子,很简单的。(提示:当你每选中一个缩略图mc时,因为对象不一样所以播放、停止、可见、不可见的对象也不一样,说白了就是把z1~z8的名字换来换去。)
③另外要说一下的是路径,路径其实和电脑中的文件存储的路径一样,它的分隔符不是“/”,而是“.”。
“_root” 代表根时间轴就是主场景的意思,
“_root.sl.s.z1.play();”这句意思是:主场景中的sl影片剪辑中的s影片剪辑中的z1影片剪辑播放。“.”的意思相当于“的”。

教程完,测试!

最后说明一下:我这种做法并不很高明,对高手来说,肯定会笑我那是笨办法。但对as不熟悉的人来说可能会有所启发,有点帮助。

添加中

添加中

12.16更新

FLASH制作眨眼睛动画

flash制作卷轴

FLASH图片羽化效果(转载)

flash制作毛笔写字效果《转载》

flash条形旋转遮罩的制作

flash方格遮罩的制作

flash风车遮罩的制作

flash旋转遮罩的制作

模糊遮罩及其制作

FLASH音画【爱不释手】视频教程

《Flash教程汇总模块》代码分享放博客首页

FLash音画【色即是空】视频教程

音画《鸿雁》FLASH实例教程

Flash音画《爱的思念》视频教程

flash动画《寻找卓玛》视频教程

FLASH音画【思凡】视频教程

如何将多个透明FLASH导入FLASH软件中

FLASH模糊遮罩制作的文字教程

如何用遮罩和加特效 (闪客精灵下载)

怎样用FLASH做水动

FLASH专辑音乐播放器制作

[教材]控制动画的开始和停止

[教材]水中倒影效果的制作

《炫彩线条制作》FLASH实例教程

翻页制作(FLASH实例教程)

音画《红红好姑娘》fLASH实例教程

硕思闪客精灵的使用教程

模糊遮罩的制作 (视频教材) [Flash]

如何在FLASH中导入视频

如何将透明特效导入flash作品中

如何把GIF动画弄到FLASH里使用

Flash初学者入门常见问题大总结 [Flash]

简单的声音编辑和控制 [Flash实例教程]

FLASH制作初级教材 [Flash]

《音乐导入和遮罩层的制作》FLASH视频教程

FLASH视频实例第二十六课 连接你需要的网址

《如何制作FLASH音画边框》视频语音教程

FLASH视频实例第二十五课 人物/抠图制作

FLASH视频实例第二十四课 滤镜/渐变文字制作

FLASH视频实例第二十三课 序幕缓缓拉开制作

FLASH视频实例第二十二课 淡入飘移动画制作

《奈何天》 flash音画 (附教程)

FLASH视频实例第二十一课 淡出飘移动画制作

FLASH视频实例第二十课 淡出飘移动画制作

FLASH视频实例第十九课 人物淡出放大动画制作

FLASH视频实例第十七课《人物淡入淡出的制作》

flash音画《人间四月天》实例教程

FLASH视频实例第十六课 淡入淡出移动文字制作

FLASH视频实例第十五课 渐隐渐出旋转图片制作

FLASH视频实例第十四课 透明遮罩/扫光动画制作

FLASH音画制作教程 下雨场景的制作

教你全程制作FLASH音画

 FLASH 视频教程[五]

 FLASH CS5 视频教程[四] [Flash]

 FLASH CS5 视频教程[三]

 FLASH CS5 视频教程[二]

 FLASH CS5 视频教程[一]

 手绘视频教程 [Flash]

 决战天下收集FLASH【视频教程】全套【精】

 怎样制作一部完整的flash作品

 生日贺卡的制作(五)

 生日贺卡的制作(四)

 生日贺卡的制作(三)

 生日贺卡的制作(二)

 生日贺卡的制作(一)

彼岸桃花日志目录总导航

PS教程(彼岸桃花收集整理)

近千首精选FLASH音乐汇总

 彼岸桃花部分原创音画作品

 Flash教程汇总(彼岸桃花整理)

  

彼岸桃花点击分享导航模块代码 

  评论这张
 
阅读(2536)| 评论(12)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

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

页脚

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