[AS3编程教学]Flash相册大师教程

首先我们把上一节高级教程里的fla源文件舞台上的东西全部删干净。然后分析一下这个作品的结构构成：图片，按钮，背景。其实就这三大块，然后利用主类来控制它们实现功能。

如果你懂得这样组织作品，那么接下里你就可以分模块来让多人合作开发了，不过渺小如此的东西没必要多人。首先我们只做背景资源，在源文件中，我们做一个背景影片剪辑，注意注册点选择左上角。

其次我们做图片影片剪辑资源，如下图所示，做一个5帧的影片剪辑作为图片元件取名为mcPic，注意注册点居中，方便放大缩小。并且给它加两个文本框，一个显示信息的txtInfo，另一个显示页码的txtPage。

按钮仍然用系统组件，ctrl+F7拖出来到库里即可。此时我们的库里资源准备完成，是下图这个样子的。

资源准备充分，我们接下来进行模块的开发。按照相册在舞台上得创建顺序，我们需要首先加载背景，因此打开背景影片剪辑，加上标题和制作信息，并新建一个名为BackGroundItem的类，放在fla同目录下，给背景绑定此类。 package  {  import flash.display.Sprite;  /**  * 背景类  * @author Tiger  * 2012/1/1 14:48  */  public class BackGroundItem extends Sprite  {  //  } }

我们该如何把这个背景放到舞台上呢？有同学说直接拖到舞台上，那样不是不可以，但是那样做了就回去了。接下来我们要写文档类来管理元件的创建和移除，写一个继承自Sprite的类，类名叫PhotoMain,写一个创建背景文件的方法createBackGround。 private function createBackGround():void   {  var mcBg:BackGroundItem = new BackGroundItem();  addChild(mcBg);  } 将此文档类输入的文档属性的文档类输入框中：

此时运行测试，发现已经有了背景效果，以后背景里要做什么修改，直接修改背景元件以及背景类，与其它元件无关，如果其它人负责这个模块，直接找那个人，不需要跟别的模块发生纠缠，这就是面向对象的特点和好处。

为了开发的方便，我们对Flash进行一个设置，文件/发布设置/Flash/ActionScript 设置/，取消“ 自动申明舞台”的打勾，这样我们需要在类里自己手动申明舞台实例，方便自动显示它们的属性，代码提示方便：

接下来我们写一个图片类，用来管理那个5帧的影片剪辑。类名叫PicItem,继承自Sprite类，因为时间轴只有一帧嘛。主要功能和属性有：图片切换，下一页，上一页，转场效果，文本信息显示，所以我们的图片类会有比较多的函数组成，写完后如下所示，并如下图绑定给picItem元件： package  {  import com.greensock.TweenLite;  import flash.display.MovieClip;  import flash.display.Sprite;  import flash.text.TextField;  /**  * 图片类  * @author Tiger  * 2012/1/1 15:02  */  public class PicItem extends Sprite  {  public var txtInfo:TextField;  public var txtPage:TextField;  public var mcPic:MovieClip;  private var totaPages:int = 5;  public function PicItem()  {  initPhoto();  } private function initPhoto():void {  mcPic.stop();  showInfo(1);  }  //下一页 public function nextPage():void  {  var index:int = mcPic.currentFrame;  if(index == totaPages)showPhoto(1);  else showPhoto(index + 1);  }  //上一页  public function prevPage():void  {  var index:int = mcPic.currentFrame;  if(index == 1)showPhoto(totaPages);  else showPhoto(index - 1);  }  function showPhoto(index:int):void  {  TweenLite.to(mcPic,.2, {scaleX:.85,scaleY:.85,alpha:.7,onComplete:changePic,onCompleteParams:[index]});  }  function changePic(index:int):void  {  mcPic.gotoAndStop(index);  TweenLite.to(mcPic,.3,{scaleX:1,scaleY:1,alpha:1});  showInfo(index);  }  function showInfo(index:int):void  {  showPicInfo(index);  showPageIndex(index);  }  //显示图片信息  private function showPicInfo(index:int):void  {  txtInfo.text = '这是第' + index + '张美女图片！';  }  //显示页码信息  private function showPageIndex(mPage:int):void  {  txtPage.text = '<' + mPage + '>';  }  } }

如何将这个元件生成在舞台上呢，参考背景的生成方法，我们在文档类里写一个生成图片的方法函数，createPhotos()，代码如下图所示;用来把相册放在舞台上，修改完成后发布影片，发现此时舞台上已经有了相册： //创建图片 private function createPhotos():void { mcPhotoItem = new PicItem();mcPhotoItem.x = 268;mcPhotoItem.y = 168;addChild(mcPhotoItem); }

紧接着我们创建两个按钮，并且对按钮进行控制就OK了。继续充实文档类，添加一个createButton（）函数，写完后执行测试影片，相册制作完毕。 //创建按钮  private function createButton():void  {  btnPrev = new Button();  btnPrev.x = 142;  btnPrev.y = 310;  btnPrev.label = '上一页';  btnPrev.buttonMode = true;  btnPrev.addEventListener(MouseEvent.CLICK,prevPhotos);  addChild(btnPrev);  btnNext = new Button();  btnNext.x = 297;  btnNext.y = 310;  btnNext.label = '下一页';  btnNext.buttonMode = true;  btnNext.addEventListener(MouseEvent.CLICK,nextPhotos);  addChild(btnNext);  }  private function nextPhotos(e:MouseEvent):void   {  mcPhotoItem.nextPage();  }  private function prevPhotos(e:MouseEvent):void   {  mcPhotoItem.prevPage();  }

此时我们的源文件文件夹如下图所示：源文件“相册大师教程.fla',文档类PhotoMain.as,背景类： BackGroundItem.as,图片类：PicItem.as,最后作品：相册大师教程.swf:

相册制作完毕，打开源文件发现舞台上空空的什么都没有，一发布出来一个相册，这就是优秀代码的效果。写到这里发现叫“大师教程”有点过了，应该把图片和资源都配置在外部文件中动态加载比较合适，这样显得够牛，不过这部分内容比较大，以后单独开教程详细讲述关于文件的配置和维护等内容。