`

很不错的flex果冻特效 转

    博客分类:
  • flex
阅读更多

index.mxml

 

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
     xmlns:local="*">
 <mx:Script>
  <![CDATA[

      private function onClick(e:MouseEvent):void{
           window.show();
      }
  ]]>
 </mx:Script>
 <local:JellyWindow width="400" height="500" horizontalCenter="0" id="window"
  backgroundColor="#ffff00" vibrationCount="30" delayNumber="0" visible="false"/>
 <mx:Button x="157" y="244" label="show" width="91" height="33" click="onClick(event)" fontSize="14"/>
</mx:Application>

 

JellyWindow .as

 

package
{
 import com.adobe.ac.mxeffects.Distortion;
 import com.adobe.ac.mxeffects.DistortionConstants;
 
 import flash.events.TimerEvent;
 import flash.geom.Point;
 import flash.utils.Timer;
 
 import mx.containers.Canvas;

  public class JellyWindow extends Canvas
 {
   private const InitPoint:Point = new Point(100,100);
 
   public function JellyWindow()
  {
   super();
  
   distortionTimeer = new Timer(delayNumber, vibrationCount);
   distortionTimeer.addEventListener(TimerEvent.TIMER, timerHandler);
  
   pointsSpecimen = [
    50,55.251048395021485,67.86320984930961,83.2024901610665,97.44865698524941,
    108.11123531529728,114.13278592010593,115.6794726556897,113.7514225333381,
    109.74227285271256,105.04958100112648,100.79808814176877,97.69749345012417,
    96.023554262826,95.69027018664536,96.37235141377161,97.63915519115437,
    99.07033390929932,100.33572339218681,101.2341473366892,101.69546822829375,
    101.75619974227371,101.52120076364723,101.12306421982154,100.68788141853504,
    100.312273569012,100.05293362397794,99.9270920221492,99.92062845073377,100
   ];
  
   for(var j : int=0;j<pointsSpecimen.length; j++)
   {
    pointsSpecimen[j] -= (pointsSpecimen[j] - 100)
     * ( (pointsSpecimen[j] > 100) ? 0.85 : 0.7 );
   }
  }
 
  private var distortion: Distortion;
  private var currentPoint : Number = 0;
 
  private var pointsSpecimen:Array;
  private var pointsArray : Array;
  private var distortionTimeer : Timer;
  private var dyncDelayNumber : Number = delayNumber;
 
  /**
   * 窗口振动次数
   */
  public var vibrationCount : Number = 15;
 
  /**
   * 振动间隔
   */
  public var delayNumber : Number = 55;
 
 
    private function timerHandler(evt : TimerEvent) : void
  {
   currentPoint++;
   dyncDelayNumber = dyncDelayNumber + 0.5;
  
   var leftTopPoint : Point = new Point(pointsArray[0][currentPoint], pointsArray[0][currentPoint]);
   var rightTopPoint : Point = new Point(pointsArray[1][currentPoint], pointsArray[1][currentPoint]);
   var rightBottomPoint : Point = new Point(pointsArray[2][currentPoint], pointsArray[2][currentPoint]);
   var leftBottomPoint : Point = new Point(pointsArray[3][currentPoint], pointsArray[3][currentPoint]);
  
   distortion.renderCorners(leftTopPoint, rightTopPoint, rightBottomPoint, leftBottomPoint);
  
   if (currentPoint >= vibrationCount) {
    reset();
   }
  }
 
   private function reset():void {
   if (distortion != null) {
    distortion.destroy();
    distortion = null;
   }
  
   dyncDelayNumber = delayNumber;
   distortionTimeer.repeatCount = vibrationCount;
   currentPoint = 0;
   distortionTimeer.reset();
  }
 
    private function generatePointsArray(): void {

   var tempPointsArr:Array = new Array(4);
   var n1:Number;
   var n2:Number;
   var n3:Number;
   var n4:Number;

   pointsArray = new Array();

   var pointNum : Number = pointNum = 0;

   while (pointNum++ < 5) {
   
    tempPointsArr = [];

    n1 = Math.random() * 0.70 + 0.80;
    n2 = 0;

    while (n2++ <= vibrationCount) {
    
     n4 = Math.round(n2 * n1);
    
     if (n4 <= vibrationCount - 4) {
      tempPointsArr.push(pointsSpecimen[n4]);
      continue;
     }
    
     tempPointsArr.push(100);
    }
   
    pointsArray.push(tempPointsArr);
   }
  
  }

   public function show():void
  {
   if (distortion != null) {
    return;
   }
  
   visible = true;

   distortion = new Distortion(this);
   distortion.buildMode = DistortionConstants.POPUP;
   distortion.smooth = true;
  
   generatePointsArray();
  
   distortionTimeer.repeatCount = vibrationCount;
   distortionTimeer.start();
   timerHandler(null);
  }
 
    public function hide():void
  {
   visible = false;
  }
 }
}


 

 

 

 

分享到:
评论

相关推荐

    Flex 果冻特效Demo

    "Flex 果冻特效Demo"是一个利用Flex技术实现的交互效果,它为用户界面添加了趣味性和吸引力,尤其适用于弹出窗口或页面转换场景。果冻特效,顾名思义,就是使元素在动效过程中呈现出如同果冻般柔软、弹性的视觉效果...

    FLEX网页果冻窗口效果(附拖动功能)

    FLEX网页果冻窗口效果(附拖动功能)FLEX网页果冻窗口效果(附拖动功能)FLEX网页果冻窗口效果(附拖动功能)FLEX网页果冻窗口效果(附拖动功能)FLEX网页果冻窗口效果(附拖动功能)FLEX网页果冻窗口效果(附拖动...

    纯CSS3弹性果冻动画特效.zip

    本主题聚焦于一个特定的CSS3动画特效——"纯CSS3弹性果冻动画特效",它为网页设计带来了生动有趣的动态效果。这个特效通过巧妙地运用CSS3的关键帧动画(@keyframes)以及变换属性(transform),模拟出如同果冻般...

    果冻特效HTML网页制作小特效.zip

    HTML网页制作的一个小特效,可以让页面显示更加美化 、

    css3弹性果冻按钮动画特效.zip

    "css3弹性果冻按钮动画特效"就是这样一个利用CSS3特性实现的创新设计,它能为网页的表单按钮增添独特的视觉吸引力和用户体验。 首先,"弹性果冻"这一概念来源于这种按钮在用户点击时,会像果冻一样产生一种动态的、...

    css3弹性果冻按钮动画特效特效代码

    在提供的压缩包文件中,可能包含了一个名为`jiaoben5819`的文件,这很可能是实现这个特效的源代码。这个文件可能包含HTML结构、CSS样式和JavaScript脚本,通过阅读和理解这个文件,我们可以深入学习如何用实际代码...

    纯css3实现带有弹性的果冻动画特效源码.zip

    本项目“纯css3实现带有弹性的果冻动画特效源码.zip”聚焦于利用CSS3的新特性来创建一种独特的动画效果——果冻(Jelly)动画。这种效果使得元素在页面上呈现出如同果冻般的弹性运动,为用户界面增添趣味性和互动性...

    纯CSS3弹性果冻动画特效特效代码

    【CSS3弹性果冻动画特效】是一种利用现代浏览器支持的CSS3特性实现的创新视觉效果。这个特效通过结合CSS3的动画(Animations)和变换(Transforms)属性,创造出一种仿佛果冻般的动态效果,物体在屏幕上进行圆周运动...

    Flex3DShow

    这款程序旨在为用户提供一种创新且吸引人的2D图片特效,其中包括了果冻弹窗效果,使得图片展示更具动态性和趣味性。它支持动态加载图片,这意味着在运行时可以随时更新或添加新的图片内容,增强了用户体验和交互性。...

    Jello-Physics unity 模拟柔体 果冻效果插件

    《Unity中的Jello-Physics:实现生动果冻效果的插件详解》 Unity,作为一款广泛应用的游戏开发引擎,因其强大的3D渲染能力和易用性,深受开发者喜爱。在游戏开发中,模拟真实物理效果是提升游戏体验的重要手段之一...

    纯CSS3弹性果冻动画特效

    在本文中,我们将深入探讨如何使用纯CSS3实现弹性果冻动画特效,这是一种极具吸引力的视觉效果,可以为网页设计增添动态与趣味性。CSS3是层叠样式表的第三个版本,它引入了许多新的功能,其中包括动画和过渡,使得...

    射的有一些果冻关于果冻的一些小常识.pdf

    3. 婴幼儿食用果冻的注意事项:婴幼儿并不适合食用果冻,因为果冻中的添加剂不仅会影响他们的营养吸收,而且果冻的质地容易引起吞咽困难,尤其是在无成人监护的情况下,可能会导致气管或支气管阻塞,甚至窒息。...

    仿iOS果冻效果

    在Android开发中,"仿iOS果冻效果"通常是指实现类似iOS系统中下拉刷新时,顶部导航栏或者listview头部会有弹性拉伸的动画效果,这种效果在用户交互上增加了趣味性和动态感,提升了用户体验。这个eclipse版的项目正是...

    js+css3制作弹性果冻按钮动画特效源码.zip

    本项目“js+css3制作弹性果冻按钮动画特效源码”就是一个很好的实例,展示了如何利用这两种技术来实现动态、吸引人的用户界面。 首先,我们来探讨JavaScript在其中的角色。JavaScript是一种强大的脚本语言,它允许...

    jquery果冻抖动效果.zip

    果冻抖动特效通常是通过改变元素的CSS属性,如宽度、高度、位置等,以模拟物体在物理世界中的抖动行为。这种效果通常需要结合时间函数(如easeIn, easeOut, easeInOut等)来控制动画的速度曲线,使其看起来更自然。...

    易语言智圆行方的果冻窗口

    在易语言中,“智圆行方的果冻窗口”可能是指一个特殊的用户界面(UI)设计,它模拟了“果冻”效果,即窗口在鼠标交互时呈现出一种富有弹性和动态的视觉效果,这种效果通常通过改变窗口边框的透明度、形状或位置来...

    果冻刷机 v2.0.3

    果冻刷机 v2.0.3 版本:2.0.3 软件语言:中文 软件类别:刷机工具 软件大小:1.64 MB 适用固件:2.3及更高固件 内置广告:没有广告 适用平台:Android 果冻刷机是一款安卓刷机软件,只需一个按钮就可完成安卓手机...

Global site tag (gtag.js) - Google Analytics