鱼眼effect

最新推荐文章于 2024-09-14 10:26:23 发布

xiaoxin888888

最新推荐文章于 2024-09-14 10:26:23 发布

阅读量714

点赞数

CC 4.0 BY-SA版权

文章标签： function image import string class null

本文链接：https://blog.youkuaiyun.com/xiaoxin888888/article/details/3990446

整个下午都用来写一种效果，鱼眼效果。花了那么多的时间，总算有点感觉。有些网友写的效果比如这样<mx:Move id="" target=""></mx:Move>我觉得这样写没有通用性，个人观点应该是：组件调用效果，而不应该是效果调用组件。下面的鱼眼效果代码很简单，但是如果没有自己实践去的话，感觉不踏实。

<mx:Zoom id="zoomBig" zoomWidthTo="1" zoomHeightTo="1" zoomWidthFrom=".5" zoomHeightFrom=".5" />
<mx:Zoom id="zoomSmall" zoomWidthTo=".5" zoomHeightTo=".5" zoomWidthFrom="1" zoomHeightFrom="1"/>

在这里先定义两个相反的效果。

            <mx:Image id="img2"
            source="@Embed(source='assets/an_52design_016.png')"
            scaleX=".5" scaleY=".5"
            rollOver="doZoomOver(event)"
            rollOut="doZoomOut(event)"/>
            <mx:Image id="img3"
            source="@Embed(source='assets/an_52design_016.png')"
            scaleX=".5" scaleY=".5"
            rollOver="doZoomOver(event)"
            rollOut="doZoomOut(event)"/>
            <mx:Image id="img4"
            source="@Embed(source='assets/an_52design_016.png')"
            scaleX=".5" scaleY=".5"
            rollOver="doZoomOver(event)"
            rollOut="doZoomOut(event)"/>

在这里图片分别调用了鼠标划入和滑出的函数。

            public function doZoomOver(event:MouseEvent):void {

                    zoomBig.play([event.target]);
            }

            public function doZoomOut(event:MouseEvent):void{
              zoomSmall.play([event.target]);
            }

这里两个函数分别是鼠标划入和滑出的触发函数。由于play的参数是一个数组，因此需要加上中括号。

果冻effect

package
{
import flash.display.DisplayObject;

import mx.core.IFlexDisplayObject;
import mx.effects.Blur;
import mx.effects.Move;
import mx.effects.Resize;
import mx.effects.easing.Bounce;
import mx.effects.easing.Elastic;
import mx.managers.PopUpManager;

public class PopUpUtil
{

  public function PopUpUtil()
  {
   //TODO: implement function
   super();
  }

  public static function popUpDisplayObject(window:IFlexDisplayObject, parent:DisplayObject, modal:Boolean=false, childList:String=null):void
  {
   var currentX:Number=(parent.width - window.width) * 0.5; //获取弹出框的位置坐标
   var currentY:Number=(parent.height - window.height) * 0.5;

   //定义效果
   var _blur:Blur;
   var _resize:Resize;
   var _move:Move;

   //_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/
   //模糊效果的设置
   _blur=new Blur();
   _blur.duration=1000;
   _blur.blurXFrom=10;
   _blur.blurXTo=0;
   _blur.blurYFrom=10;
   _blur.blurYTo=0;

   _resize=new Resize();
   _resize.duration=1000;
   _resize.easingFunction=Elastic.easeInOut;
   _resize.heightFrom=0;
   _resize.widthTo=0;
   _resize.heightTo=window.height;
   _resize.widthTo=window.width;

   _move=new Move();
   _move.duration=1000;
   _move.easingFunction=Elastic.easeInOut;
   _move.xFrom=parent.width*.5;
   _move.yFrom=parent.height*.5;
   _move.xTo=currentX;
   _move.yTo=currentY;
   //_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/

   //设置动画目标
   _blur.target=window;
   _move.target=window;
   _resize.target=window;

   //弹出目标对象
   PopUpManager.addPopUp(window,parent,false);

   _blur.play();
   _move.play();
   _resize.play();
  }

}
}