日期:2013-07-05  浏览次数:20675 次

原文:http://www.flashandmath.com/flashcs4/leo/index.html

我们引见一下一个自定义的as3类,ImageAccordion,可以像手风琴一样将图片折叠和展开。我们使用FlashPlayer10原生的3D方法,而且效果很逼真。点击后图片会以补间运动的方式折叠或者展开。
下面,我们讨论一下ImageAccordion类,这是效果的核心。

使用ImageAccordion类

你在上面的展现中看到了什么?两个ImageAccordion类实例,每个图像一个实例。
ImageAccordion类扩展自Sprite。它的结构函数有四个参数,一个必填,三个选填

  1. new ImageAccordion(bd:BitmapData,df:Number=0.5, lf:Number=0, sl:int=10)
复制代码
第一个参数是图片的BitmapData对象,你可以将图片导入到库中并用AS3链接,或者通过Flex嵌入,又或者在运转时载入(loading)。
“df”和“lf”的值将传递给类中的“"darkEdgeFactor"”和“"lightEdgeFactor"”属性。这些值将决定底部边缘的暗度,与顶部边缘的亮度。“df”最好在0-1之间,df数值越大越暗。同样“lf”最好也在0-1之间。也是数值越大越亮。默认设置对应的是明亮度比较好的图片。最后一个参数是手风琴的分褶数。

在范例的fla文件,我们使用库中的图形,该图形通过AS3建立链接,类名分别为Leonardo与MonaLisa。然后我们创建两个ImageAccordion,每个图像一个。这里是时间轴上用来创建第一个实例的代码(紧缩包中的flashandmath文件夹要和你的fla文件在同一个文件夹内,这样ImageAccordion类才能被找到)
  1. import flashandmath.as3.ImageAccordion;
  2. var accordion:ImageAccordion=new ImageAccordion(new Leonardo(224,350),0.5,0,14);
  3. this.addChild(accordion);
  4. accordion.x=160;
  5. accordion.y=235;
复制代码

我们将第一个实例旋转-30度,z坐标设为100,所以变得更小更清晰了。

接下来我们对蒙娜丽莎做相反的处理,只是把她放到了左边,并旋转30度。

你在舞台上看到的文本内容是写死在flash里面的。当然,你也可以使用动态文本在运转时从外部载入其他内容。该ImageAccordion类有两个公共属性:tweenDownDuration和tweenUpDuration。它们默认为50和40.你很容易就能改变它们的值,例如这样设置:

accordion.tweenUpDuration=20;