您的位置:积木首页 >> 图形图象频道 >> FLASH >> 正文:
标题:网上教程
时间:2005-1-27 来源:不详 浏览数:

              msound.stop();

              }

};

onEnterFrame = function () {                   

   if (show == 1) {                            

          if (square._alpha>10 && fadeOut) {                       square._alpha -= 20;                      

                 }

          if (square._alpha<10) {                       

                 loadMovie("bk/"+whichPic+".jpg", "square");

                 fadeOut = false;fadeIn = true;

                 }

          if (square._alpha<100 && fadeIn && !fadeOut) {  

                 square._alpha += 20;}                      //背景alpha加20

          else {fadeIn = false;}

   }

  if (show == 0) {                                    //如不允许背景显示

          if (square._alpha>10) {square._alpha-= 20;}     

          else{unloadMovie(square);}                    

  }

};

// 初始化变量及属性

//square的属性alpha设为0后,导入图片也是全透明的

//把导入图片的编号纪录变量whichpic预设为1

//背景显示标志位预设为0,即开始不显示

//音乐播放标志位预设为1,开始播放

//在该MovieClip中新建声音对象msound

//把bksound这个声音文件分配给msound

//msound 从第0秒开始播放msound99遍

//按钮功能设置

//点击home键,即连接到网站

//点击mail键,即发邮件(只在浏览器中有效)//音乐切换

//点击close键,即关闭swf(只在播放器中有效)

//点击bk键,根据标志位show的变化决定。

//不显示show==0时,变show为1,显示第一个图片

//可显示show==1时,如果图片没显示完就接着显示下一个,显示完了则禁止显示

/

/点击music键,根据musicshow的变化决定。

//原来不播放,则现在播放;原来播放,则现在停止

//该MovieClip开始第一帧 执行下列语句

//如果允许显示背景

//如背景alpha大于10,要求淡出

//背景alpha减少20。

//如背景alpha小于10

//导入图片

//淡入

//如淡入

//淡出处理

//释放图片

程序填写好后,bk就具备了动态背景变化控制,和背景声音控制功能(其中list,back,next按钮尚未定义)。把bk拖到主场景中,输出为SWF文件,在光盘图像浏览文件夹的bk子目录中放入预先准备好的700X400背景图片1.jpg、2.jpg、3.jpg。运行SWF文件,点击按钮即可看到效果。

二、loadscreen的制作

loadscreen是用来载入浏览器所要浏览的图片的MovieClip。它内部没有Action,由四个层组成,screen层和shadow层共同组成透明且右阴影的载图屏幕;load层用于载入图片,mask层遮在上面使图片不至于超出显示范围。它们的功能和电影片断bk里面的load,mask是一样的。如图24-8所示。

图24-8  loadscreen结构示意图

步骤1:screen的制作。实际上是一个300X300正方形加上四个圆点,请看源程序库中的screen。具体做法从略。值得注意的是它在Loadscreen中的实例是必须起名的,因为后面的Action要对它进行控制。这里给它起名为screen。

步骤2:shadow的制作。在库新建名为Shadow的图像(Graphic)符号。画一个300X300填充颜色为#333333的正方形,连接它的对角线,在正方形内部画一个同心的290X290正方形,整个过程在一个层上完成,如图24-9所示,利用渐变在正方形内切割的四条狭长的梯形上建立#333333到#666666的渐变(渐变制作方法见界面背景的制作步骤2)。最后删除多余的线(包括对角线),shadow就制好了。

图24-9  阴影的制作

步骤3:合成。按照图24-8所示的结构把物件组合起来,其中mask是一个300X300的正方形,load是一个movieclip,它在这里的实例取名叫load使它可控制,另外它的坐标应该是(0,0),这些和电影片断bk中的load是完全一样的。值得注意的是screen和shadow都要设为半透明,这样load就会透过screen显现出来,这不是我们想看到的效果。解决办法就是让movieclip load为空,即没有任何内容,这样它依然是个movieclip,依然可以用来载入电影,然而却不可见。

三、photolist的制作

photolist利用了Flash MX提供的用户界面组件(UI Component)之中的Flist组件。Flash MX提供的每种组件都附有相应的方法,来实现组件各种高级功能,充分利用组件,会使我们的工作事半功倍。Phtotolist外观与结构如图24-10所示。

图24-10  photolist结构示意图

其中close层按钮就是个普通按钮,实例名close;title层的按钮实例名photolist。Screen层是在movieclip loadscreen使用过的,这里改变一下长宽,使之适合即可。

最关键的还是Flist组件的应用。Flash MX共提供了七种组件,在本书第16章有详细的内容,另外,如果有一定英语基础,可查阅Flash附带帮助文件。

首先给场景加入UI组件。从Component面板中拖拽listbox到正在编辑的photolist的list层,调整长宽达到满意。

选中这个实例,在属性)面板起名为list,点选面板右上方参数(Parameters)标签,这是Flash组件特有的面板,用于设置组件中的参数。其中:

label: 一个字符串数组用于存放listbox中项目名称,

data: 存放相应项目相关联的数据,

select multiple : 一个布尔量决定list中的项目是否能多重选择,

change handler: 指向用户点击项目时你所要调用的函数。

可以双击参数面板的label或data选项跳出赋值对话框修改增删项目,对话框内表格前面的数字是项目的序号(用index表示),注意它是从0开始的。不过我们并不打算用这种方法给list添加项目,我们将利用Action实现。实例中涉及到的list方法如下,其中Flist是listbox实例的名称,根据需要变更:

FListBox.addItem(label [, data]) :在list尾部添加一个项目。

FListBox.getSelectedItem():返回list中最近选中过的项目的序号。

FListBox.setChangeHandler(functionName, [location]):制定一个函数,每当被选项目变换时调用它。

FListBox.getSelectedIndex():返回list中选中项目的序号。

FListBox.setScrollPosition(index):是指定序号的项目滚动到list顶部。

List大约支持31种方法,具体功能不再具体叙述。

四、loading的制作

这是一个很简单的MovieClip,用在下载影片和载入外部变量时作为等待的提示。一共一层三帧,产生动画的效果。如图24-11所示。

 图24-11 简单的loading动画

五、Action Script的内容及场景的组织

至此我们已经完成了大部分的物件制作,现在可以进入最后的场景组织阶段了。整个动画的结构如图24-12所示。已经制作完成的loading,loadscreen,photolist以及bk依次排列在相应图层,分别给他们的实例命名为loadvar、loadscreen、photolist和bk。按图24-12所示把物件安排好后,按以下步骤进行Action的编写。


图24-12 场景的组织结构示意图

步骤1:loading画面的制作。前四帧做载入处理,因此只显示loading。在第一帧的Action层写下:IfFrameLoaded (4) {gotoAndPlay(3);}, 即如果整个动画的第4帧已经载入时,就跳到第三帧开始播放,而在第2帧写下gotoAndPlay(1),如此就形成了最简单的载入动画,如果没能载入所有动画,将在1,2帧反复播放。

而在第3帧我们又利用Action实现对读取外部文本的等待。在第3帧写下:

loadVariables("readme.txt",_root.loadvar);stop();

将外部同目录下的文本readme.txt读入到loadvar上面,然后使动画停在该帧。

然后点选loadvar写下:

onClipEvent (data) {

       for (i=1; i<=total; i++) {

       if (i<10){a=eval("nam00" add i);

           b=eval("url00" add i);}

       else{a=eval("nam0" add i);

            b=eval("url0" add i);}

       _root.photolist.list.addItem(a, b);

}

_root.photolist.list.addItem("Unload", 0);     

_root.photolist.list.setChangeHandler("myHandler", _root);

_root.gotoAndPlay(4);                 

}

//当数据读取结束

//从1到总图片数逐一执行

//每个项目的名字变量label为图片名称 nam跟三位数字

//每个项目的数据变量data为图片地址 url跟三位数字

//给list添加label为a data为b的项目

//最后加入一个数据为空的项目用来释放图片

//指定选项相关函数

//主时间轴跳到第4帧播放

大概的思想是一旦readme中的数据被loadvar全部读取,loadvar就按程序把数据一个项目一个项目的加载到photolist之中,做好后跳到第4帧。

步骤2:第四帧Action。这里定义了loadscreen和photolist的鼠标拖拽以及photolist的相关函数myHandler:

fscommand("allowscale", "false"); 

loadscreen.onPress = function() { 

       startDrag(loadscreen);

};

loadscreen.onRelease = function() {

       stopDrag();

};

photolist.drag.onPress = function() {

startDrag(photolist);

};

photolist.drag.onRelease = function() {

stopDrag();

};

photolist.close.onPress = function() {

setProperty(photolist, _visible, "0");

bk.listshow = 0; 

};

function myHandler(component) {

a=photolist.lis

上一页  [1] [2] [3] [4] [5] 下一页


(责任编辑:admin)
最近更新
今日推荐
热点文章