论坛交流
首页办公自动化| 网页制作| 平面设计| 动画制作| 数据库开发| 程序设计| 全部视频教程
应用视频: Windows | Word2007 | Excel2007 | PowerPoint2007 | Dreamweaver 8 | Fireworks 8 | Flash 8 | Photoshop cs | CorelDraw 12
编程视频: C语言视频教程 | HTML | Div+Css布局 | Javascript | Access数据库 | Asp | Sql Server数据库Asp.net  | Flash AS
当前位置 > 文字教程 > Flash教程
Tag:flash cs,flash 8,鼠绘,as,手绘,工具,文字,loading,入门,初学,mc,影片剪辑,声音,mtv,游戏,引导,遮罩,菜单,补间,广告条,时钟,视频教程

小草教材第五篇<解析韩国菜单>

文章类别:Flash | 发表日期:2008-9-21 20:07:07

  
韩国的FLASH起步也许比我们要早一些,有很多的动画做得很精典。提到这儿,并不是我没有爱国热情,而是优秀的文化成果很值得我们借鉴和学习,从而促进我国FLASH动画的发展。 见到有很多的网友询问这个菜单的制作方法与步骤,小草以仅有的一点点能力,将其大致步骤作个解析。有些不当之处,请各位同行多多指正! 一样的,我们先看一下文件的效果吧!
点击浏览该文件
源文件:
点击浏览该文件
http://www.flash8.net/bbs/UploadFile/2005-1/200516123535145.swf

1、费话少说,我们来看一下它的制作步骤。首先我们打开FLASH MX2004,新建一个文档,并将其保存为main.fla。

按此在新窗口浏览图片

2、打开文档的属性,设置影片的大小为770*250,帧频为第秒36帧,白色背景。如图所示:

按此在新窗口浏览图片

3、单击“文件”==》“导入”==》“导入到舞台”命令,向主场景中导入一幅背景图片。(选一幅漂亮一点的吧!

按此在新窗口浏览图片

按此在新窗口浏览图片

4、另外再导入几幅所需要用到的图片文件,在制作影片剪辑的时候要用的。找几幅好看的图片,点击“打开”按钮,我们将其导入到库中。

按此在新窗口浏览图片

5、新建起6个图层,从上到下的命名为:主场景动作层、特效动作层、FLASH8—LOGO层、特效层、菜单影片层和背景层。在背景层中放置导入的背景图片,我们将其锁定。在菜单影片层中,从库中托出一幅图片到当前场景中的适当位置。


按此在新窗口浏览图片

6、在此图片上单击右键,在弹出的菜单中选择“转换为元件”命令,将其转换为名为“menu1”的影片元件。

按此在新窗口浏览图片

7、在此元件上双击,进入menu1影片元件的编辑状态。

按此在新窗口浏览图片

8、这其实就是一个新的小影片,你可以在这里发挥你的聪明才智,将其表现得尽善尽美!这儿你可以自由的发挥你的想法和表现力。(本实例中加入了特效影片,遮罩等非凡效果,如图所示:) 按此在新窗口浏览图片

9、返回主场景,打开库面板。选中menu1,单击右键,在弹出的菜单中选择“重制”命令,将刚才制作完成的影片元件menu1复制元件为menu2 ,menu3, menu4, menu5, menu6。(这样做的目的是可以节省时间。)然后将它们托到主场景菜单元件层中,双击进入menu2的编辑场景,对其进行编辑。其它几个也是如此:

按此在新窗口浏览图片

10、编辑好后的如图所示:

按此在新窗口浏览图片

11、在主场景的属性栏,现在我们将menu1影片元件命名为“menu1”,以便于AcitionScript对其进行控制。其它5个元件也依次命名为:menu2,menu3,menu4,menu5,menu6。如图所示:

按此在新窗口浏览图片

按此在新窗口浏览图片

12、然后将这菜单影片层也锁定,在特效层里放置一影片元件Sy2,这是一个由场景左边飞到右边的白色箭头影片。由于要添加动作对其控制,所以在主场景中我们将其命名为“spe”。如图所示:

按此在新窗口浏览图片

13、(Sy2元件的内部结构:很简单的,不要忘了最后一帧加上"stop" 。)
按此在新窗口浏览图片


按此在新窗口浏览图片

14、编辑完成后,我们返回主场景。(为了便于区分,我这里将动作分别用到两个图层中)我们在特效动作层中添加动作:

按此在新窗口浏览图片

time = 20;
vHeight = 200;
vSpace = 25;
_root.i = 0;
_root.onEnterFrame = function ()
{
if (random(time) == 0)
{
_root.speedbar.duplicateMovieClip("spe" + _root.i, _root.i);
_root["spe" + _root.i]._y = random(vHeight) + vSpace;
_root["spe" + _root.i]._x = random(300) - 100;
_root["spe" + _root.i]._xscale = random(80) + 30;
_root["spe" + _root.i]._yscale = _root["spe" + _root.i]._xscale;
_root["spe" + _root.i]._alpha = random(70) + 20;
_root.i++;
}
};
15、然后在主场景影片动作层添加动作,用于控制菜单影片的!

按此在新窗口浏览图片

动作如下:

_root, ball.onEnterFrame=function () {
for (var j = 0; j<5; j++) {
mc = this.duplicateMovieClip("ball"+i, i);
mc._rotation = random(360);
i++;
}
};
MovieClip.prototype.sMove = function(spx, tarX) {
speedX = spx*(tarX-this._x);
this._x += speedX;
};
var mtx1 = 650;
var mtx2 = 670;
var mtx3 = 690;
var mtx4 = 710;
var mtx5 = 730;
var mtx6 = 750;
_root.menu1.onEnterFrame = function() {
this.sMove(0.5, mtx1);
};
_root.menu2.onEnterFrame = function() {
this.sMove(0.5, mtx2);
};
_root.menu3.onEnterFrame = function() {
this.sMove(0.5, mtx3);
};
_root.menu4.onEnterFrame = function() {
this.sMove(0.5, mtx4);
};
_root.menu5.onEnterFrame = function() {
this.sMove(0.5, mtx5);
};
_root.menu6.onEnterFrame = function() {
this.sMove(0.5, mtx6);
};
_root.menu1.hit.onRollOver = function() {
_root.mtx1 = 430;
_root.mtx2 = 670;
_root.mtx3 = 690;
_root.mtx4 = 710;
_root.mtx5 = 730;
_root.mtx6 = 750;
_root.menu1.gotoAndPlay(2);
_root.menu2.gotoAndStop(1);
_root.menu3.gotoAndStop(1);
_root.menu4.gotoAndStop(1);
_root.menu5.gotoAndStop(1);
_root.menu6.gotoAndStop(1);
};
_root.menu2.hit.onRollOver = function() {
_root.mtx1 = 430;
_root.mtx2 = 450;
_root.mtx3 = 690;
_root.mtx4 = 710;
_root.mtx5 = 730;
_root.mtx6 = 750;
_root.menu2.gotoAndPlay(2);
_root.menu1.gotoAndStop(1);
_root.menu3.gotoAndStop(1);
_root.menu4.gotoAndStop(1);
_root.menu5.gotoAndStop(1);
_root.menu6.gotoAndStop(1);
};
_root.menu3.hit.onRollOver = function() {
_root.mtx1 = 430;
_root.mtx2 = 450;
_root.mtx3 = 470;
_root.mtx4 = 710;
_root.mtx5 = 730;
_root.mtx6 = 750;
_root.menu3.gotoAndPlay(2);
_root.menu2.gotoAndStop(1);
_root.menu1.gotoAndStop(1);
_root.menu4.gotoAndStop(1);
_root.menu5.gotoAndStop(1);
_root.menu6.gotoAndStop(1);
};
_root.menu4.hit.onRollOver = function() {
_root.mtx1 = 430;
_root.mtx2 = 450;
_root.mtx3 = 470;
_root.mtx4 = 490;
_root.mtx5 = 730;
_root.mtx6 = 750;
_root.menu4.gotoAndPlay(2);
_root.menu2.gotoAndStop(1);
_root.menu3.gotoAndStop(1);
_root.menu1.gotoAndStop(1);
_root.menu5.gotoAndStop(1);
_root.menu6.gotoAndStop(1);
};
_root.menu5.hit.onRollOver = function() {
_root.mtx1 = 430;
_root.mtx2 = 450;
_root.mtx3 = 470;
_root.mtx4 = 490;
_root.mtx5 = 510;
_root.mtx6 = 750;
_root.menu5.gotoAndPlay(2);
_root.menu2.gotoAndStop(1);
_root.menu3.gotoAndStop(1);
_root.menu4.gotoAndStop(1);
_root.menu1.gotoAndStop(1);
}
_root.menu6.hit.onRollOver = function() {
_root.mtx1 = 430;
_root.mtx2 = 450;
_root.mtx3 = 470;
_root.mtx4 = 490;
_root.mtx5 = 510;
_root.mtx6 = 530;
_root.menu6.gotoAndPlay(2);
_root.menu2.gotoAndStop(1);
_root.menu3.gotoAndStop(1);
_root.menu4.gotoAndStop(1);
_root.menu1.gotoAndStop(1);
_root.menu5.gotoAndStop(1);
};

16、出于对闪吧的热爱,将闪吧的LOGO放上来啦!

按此在新窗口浏览图片

17、按CTRL+ENTER组合键,测试看一下吧!

按此在新窗口浏览图片

再附上源文件和做这个教程时所抓的屏幕截图,便于大家参照对比!(各位闪友:假如你有更好的做法,或是你也做好了,也请你跟贴上传大家一起交流好吗?)

源文件:
点击浏览该文件

屏幕截图:
点击浏览该文件
点击浏览该文件

视频教程列表
文章教程搜索
 
Flash推荐教程
Flash热门教程
看全部视频教程
购买方式/价格
购买视频教程: 咨询客服
tel:15972130058