Flex中通过creationCompleteEffect样式为Accordion容器设置创建完成特效的例子

By Minidxer | June 23, 2008

在前面的Flex中通过creationCompleteEffect样式给Button控件设置创建完成效果的例子中，我们了解了Flex中如何通过creationCompleteEffect样式，给Button控件设置创建完成效果。接下来的例子演示了同样使用creationCompleteEffect样式，为Accordion容器设置创建完成特效。由于peterd没有给出相关的png资源，无法编译通过很是抱歉，大家将就着先看看代码或者看看上面Button的例子，拿到png资源后会更新demo。


下面是完整代码：

Download: main.mxml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
  3.         layout="vertical"
  4.         verticalAlign="middle"
  5.         backgroundColor="white">
  6.  
  7.     <mx:String id="str" source="lorem.txt" />
  8.  
  9.     <mx:Accordion id="accordion"
  10.             creationCompleteEffect="Dissolve"
  11.             width="400"
  12.             height="300">
  13.         <mx:VBox id="vBox1"
  14.                 label="Red (WipeUp)"
  15.                 icon="@Embed('assets/bullet_red.png')"
  16.                 backgroundColor="red"
  17.                 creationCompleteEffect="WipeUp"
  18.                 width="100%"
  19.                 height="100%">
  20.             <mx:Text text="{str}" width="100%" height="100%" />
  21.         </mx:VBox>
  22.         <mx:VBox id="vBox2"
  23.                 label="Orange (WipeDown)"
  24.                 icon="@Embed('assets/bullet_orange.png')"
  25.                 backgroundColor="haloOrange"
  26.                 creationCompleteEffect="WipeDown"
  27.                 width="100%"
  28.                 height="100%">
  29.             <mx:Text text="{str}" width="100%" height="100%" />
  30.         </mx:VBox>
  31.         <mx:VBox id="vBox3"
  32.                 label="Yellow (WipeLeft)"
  33.                 icon="@Embed('assets/bullet_yellow.png')"
  34.                 backgroundColor="yellow"
  35.                 creationCompleteEffect="WipeLeft"
  36.                 width="100%"
  37.                 height="100%">
  38.             <mx:Text text="{str}" width="100%" height="100%" />
  39.         </mx:VBox>
  40.         <mx:VBox id="vBox4"
  41.                 label="Green (WipeRight)"
  42.                 icon="@Embed('assets/bullet_green.png')"
  43.                 backgroundColor="haloGreen"
  44.                 creationCompleteEffect="WipeRight"
  45.                 width="100%"
  46.                 height="100%">
  47.             <mx:Text text="{str}" width="100%" height="100%" />
  48.         </mx:VBox>
  49.         <mx:VBox id="vBox5"
  50.                 label="Blue (Iris)"
  51.                 icon="@Embed('assets/bullet_blue.png')"
  52.                 backgroundColor="haloBlue"
  53.                 creationCompleteEffect="Iris"
  54.                 width="100%"
  55.                 height="100%">
  56.             <mx:Text text="{str}" width="100%" height="100%" />
  57.         </mx:VBox>
  58.     </mx:Accordion>
  59.  
  60. </mx:Application>
代码：Peter deHaan 翻译/整理/编译：minidxer

Topics: Flex | No Comments » | Tags: ,

你可能还对下列文章感兴趣:

Leave a Comment

Name(*):

E-Mail(*) :

Website :

Comments :

Search Posts

Categories

Archives

Blogroll