6.1 按钮功能的实现：
如果要添加按钮功能，首先就得添加按钮，这个道理连小学生都明白。然而，it's easier said than done，具体如何创建按钮，就不是那么简单了。因为图像的数目是不确定的，因此需要动态创建。
创建按钮其实只需要在载入全部图像进入第一轮显示的时候创建一次就可以了，因此，可以把该段创建按钮的代码放在第三帧。为了让美工高手能有发挥自己才华的机会，笔者在这里就不用代码写按钮了，而是先在库里手动创建一个，接着通过attachMovie载入。
为了让按钮的深度更好管理，笔者建议大家把所有按钮载入到一个mc里头。于是，在遮罩层上面新建一个图层，命名为按钮。然后放置一个空的mc，元件名和实例名均为button_Field。位置根据你个人喜好而定。
接着，在第三帧追加代码：

for (var i in imgabbrs) {
       var btn:MovieClip = button_Field.attachMovie("button", "button"+i, i);//从库里载入button元件，创建方法在后面介绍
       btn._x = i*btn._width;
       btn._y = 0;//这两句让按钮横向排列
       btn.index=Number(i)+1;//给按钮定义一个属性，这个属性表示第几张图片，将在一个动态文本里显示
}

6.2 因为按钮到现在还没创建，所以大家可能不明白上面的代码有些到底是用来干啥的。
现在笔者就给大家讲述如何先创建一个按钮。
在库里右键—新建元件，命名为button，类型为mc，打开“高级”对话框，点中“为动作脚本导出”和“在第一帧导出”。
在该元件里，创建两个图层。

其中，按钮图层放一个按钮，添加代码：

on(release){
       _parent._parent.lastIndex=_parent._parent.thisIndex //让新图片放到旧图片所在的地方
       _parent._parent.thisIndex=(index-1) //获得新图片的索引
       _parent._parent.gotoAndPlay(43) //跳转到43帧，从而跳过42帧的自动切换代码
}

文字图层放一动态文本，变量名为index
现在，测试一下，基本效果就出来了，但是还有一个小Bug，就是当图片切换效果动画还没完成的时候，马上切换下一个图，动画效果的过渡就不自然，解决的办法有两个，第一个很简单，就是把44帧的代码拖后一点，但是不能从根本上解决问题，第二个办法相对复杂，将在下一帖再作介绍。

6.3 从根本上解决上述的小Bug：
新浪的新闻图片轮换里，如果遮罩效果运行的时候，点了别的图片的话，Flash会等效果运行结束，就马上切换到所点到的图像。因此，在这里，我们应该让控制主时间轴帧跳转的代码gotoAndPlay(43)放在效果运行结束以后。
那么，效果运行结束之后，怎么知道之前点了按钮呢？这个很好处理，只要设一个布尔变量havePressed=true就可以了。动画效果结束以后，检查havePressed的值就可以了。因此，我们还需要在开始切换图片的时候，要让havePressed变回false，否则即使下次不点按钮，也会在遮罩效果结束后，马上切换到下一图。
但是，这样又会有新的问题。如果在遮罩效果运行结束后，已经检查了havePressed，再点切换按钮的话，检查havePressed的操作就不能再在点击按钮时进行。导致立即切换图片的操作失败。
由此可见，效果运行时和效果运行结束两种状态需要分别处理。故还需要定义一个布尔变量，存放当前的效果运行状态是运行时还是运行结束。在遮罩效果开始时，设置running=true，运行结束，让running=false。
于是，要修改代码的地方就比较多了。
首先，按钮代码需要改为：

on (release) {
       _parent._parent.lastIndex = _parent._parent.thisIndex;
       //让新图片放到旧图片所在的地方
       _parent._parent.thisIndex = (index-1);
       //获得新图片的索引
       if (_parent._parent.running) {
              //如果遮罩效果正在运行
              _parent._parent.havePressed = true;
              //主时间轴不能直接跳转，而要等到效果运行结束后，检查到havePressed=true时才可以
       } else {
              _parent._parent.gotoAndPlay(43);
              //跳转到43帧，从而跳过42帧的自动切换代码
       }
}

主时间轴的第三帧声明两个布尔变量：

var running:Boolean;
var havePressed:Boolean;

主时间轴第四帧为切换周期的开始，遮罩效果处于运行时状态，而还没点击过按钮。故追加：

running=true;
havePressed=false;

之后，在每个遮罩动画效果运行结束后，要让running=false，因为运行已经结束。并且检测是否在效果运行这段时间内点过按钮。因此都追加代码：

_parent._parent.running=false;//running是在主场景里声明的，故需要指向于主场景
if(_parent._parent.havePressed){//假如在效果运行时点了按钮，根据按钮代码，该值一定为true，否则就是false
  _parent._parent.gotoAndPlay(43);//检查到点过的话，就在效果运行结束的这一刻，马上切换图片
}

至此，整个图片轮换的效果完成了。但是，大家也许会提问，为什么那些很眩的百叶窗效果，丰富多彩的形状变化还没做出来啊？其实那些都是在遮罩mc里做。笔者在这里只拿了个最简单的效果作为例子，大家完全可以根据自己的需要，把那里的效果换成自己想要的效果。如果想了解这些效果具体怎么个做法，那么，大家不妨研究下笔者一年前的教程：
http://bbs.blueidea.com/viewthread.php?tid=2272971

经典论坛讨论：
http://bbs.blueidea.com/viewthread.php?tid=2674755

Flash全站的技术应用系列：
（一）AS+JS的Flash网站无刷新定位技术 
（二）Flash网站的SEO
（三）Flash网站的流量统计
（四）让Flash网站具有IE前进后退的功能
（五）图片轮换效果 (本文)

出处：蓝色理想
责任编辑：moby

上一页 图片轮换效果 [5] 下一页

◎进入论坛Flash专栏版块参加讨论