Flash as3实例教程：图片转换效果.docxVIP

Flash as3实例教程：图片转换效果本例介绍运用Flash AS3.0代码中的Tweener类应用实现堆放的照片动画效果，在教程中我们将学习到Tweener这个开源的补间效果的应用，通过本例的学习，应该能掌握Tweener的基本用法，希望朋友们喜欢~~这是一个堆放的照片的交互式的效果，它模似了在手中翻看照片的效果。比较适合用于较多照片的相册。在这个效果中，采用了Tweener，这是一个开源的补间效果，它比Adobe的Tweener类要好用得多。通过本例的学习，应该能掌握Tweener的基本用法了。要使用这个类，需要下载源码：?下载地址：/p /tweener/downloads/list?这里有几个版本，我用的是AS3,所以下了：tweener_1_33_74_as3.zip?下载后，解压会产生一个叫：caurina的文件夹。?记住，将你的fla文件放在与caurina文件夹相同的目录中。?好了，现在我们已经拥有了Tweener了，接下来我们来做这个相册。首先，建一个flash as3.0文档。?如果你想要一张图片做背景的话，你可以导入一张图片，放到舞台上，作为背景层，然后将这一层上锁。?新插入一图层，在这一层我们将把我们的照片放进来。照片要调整大小，宽度为舞台的一半左右，将照片放到舞台的左边。我们来对照片进行一些修饰。点中照片，将它转换为影片剪辑，注册点调到中心位置。双击它，进入编辑窗口，在照片层一下面新建一层，用白色填充的矩形画一个比照片大一点的矩形，这实际上就是为照片加上了一个白色的边。回到主场景，点中照片元件，打开属性滤镜面板，为它添加一个发光滤镜，颜色为黑色，值为10.这样就给照片加上了一个阴影了。接下来，在属性面板中为照片元件取一个实例名称：photo1.?下面的事情是，第二张照片，一样的做法，实例名称为：photo2?接下来，第3张，第4张…….,实例名称：photo3,photo4…….?好了，开始写代码了，新建一层，按习惯，这层的名称应该是：action,你也可以把它叫做张三，李四，王二麻子。或许你把它叫做西瓜也许很有创意。?打开帧动作面板，写代码：(后面会有完整代码)?首先，需要导入Tweener类：?importcaurina.transitions.*;?接下来声明一些变量，后面要用：?varphotoOriginX:Number = photo1.x; //照片的原始位置，将它设为第1张照片的位置。照片被点击后，会移到右边，然后会回到这个位置上。?varphotoDestX:Number = photoOriginX + 200; //这是照片移到右边的位置，它在原始位置的基础上，向右移了200像素。?varspeed:Number = .5; //这是移动需要的时间，被设为了0.5秒。?varrotationRange:Number = 10; //这是照片旋转角度的限制?varphotoCount:Number = 3; //照片的数量，我只用了3张照片，所以设为3,你有几张照片，这里就设为几。?vareaseType:String = easeoutquad;//这是缓动的类型，Tweener有很多缓动类型。从上面的图中我们可以看到，我们用的是：easeoutquad从图中可以看出，这个效果是，开始是较快，在要结束时，移动最慢。?接下来是一个函数，在点击时，图片向右边移动：?function photoSlideOut(e:Event):void?{?e.target.parent.setChildIndex(e.target, e.target.parent.numChildren - 1);?Tweener.addTween(e.target, {x: photoDestX, time: speed, transition: easeType, onComplete:photoSlideIn, onCompleteParams:[e.target]});?Tweener.addTween(e.target, {rotation: Math.floor(Math.random()*(rotationRange*2))-rotationRange, time: speed*2, transition: easeType});?}?上面函数中第1句，是将被点击的照片移到最上层。?第 2句是移动图片。?Tweener的addTween方法产生一个补间效果。?addTween方法：?第1个参数：e.target是要应用补间的对象，这里是被点击的图片。?第2个参数：x是对象的属性，这里是对象的x属性，你可以改变对象的其它任何值。?第3个参数：photoDestX是这个属性值被改变后的值，这里是x被改