当前位置: 首页 > 图形设计 > FLASH教程 > 正文

积少成多Flash(11) - Flex 3.0 动画效果(effect)

时间:2011-03-21 webabcd

介绍

演示 Flex 3.0 中的各种动画效果(effect)的应用

Zoom - 放大/缩小

Wipe - 从上/下/左/右 4 个方向 线性渐变地 对控件做 删除/显示

Rotate - 旋转

Resize - 调整控件大小

Fade - 淡入/淡出

Move - 改变控件位置

Iris - 显示/消失(放射性渐变)

Blur - 模糊

Dissolve - 对控件做alpha修改

Glow - 对控件做周边发光

SoundEffect - 播放一段音频

Parallel - 对各种 effect 做并行展示

Sequence - 对各种 effect 做串行展示

TweenEffect - 此类是大部分 effect 的基类

在线DEMO

http://www.cnblogs.com/webabcd/archive/2009/11/09/1598980.html

1、 Zoom.mxml

<?xml version="1.0" encoding="utf-8"?>
  <!--
      演示 放大/缩小 的动画效果
  -->
  <mx:Panel xmlns:mx="http://www.adobe.com/2006/mxml" 

layout="absolute" width="400" height="300"
      title="Effect - Zoom (放大/缩小)">
      <mx:Script>
          <![CDATA[
              private function doZoom(e:MouseEvent):void
              {
                  if (zoom.isPlaying)
                  {
                      zoom.reverse();
                  }
                  else
                  {
                      zoom.play([e.target], e.type == 

MouseEvent.ROLL_OUT ? true : false);
                  }
              }
          ]]>
      </mx:Script>
      <mx:Zoom id="zoom" originX="24" originY="24"
          zoomWidthFrom="1" zoomWidthTo="2" zoomHeightFrom="1" 

zoomHeightTo="2" />
      <mx:Image source="@Embed('images/logo.png')"
          x="24" y="24" width="48" height="48"
          scaleX="1" scaleY="1"
          rollOver="doZoom(event)" rollOut="doZoom(event)"
       />
  </mx:Panel>