巴鲁's profile岩屋PhotosBlogListsMore ![]() | Help |
|
November 05 Flex学习进阶-使用动态效果首先为这个实验做个UI代码如下: <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> <mx:Panel x="10" y="10" width="200" height="300" layout="absolute"> <mx:Button x="40" y="60" label="View" id="myButton" /> <mx:Label x="40" y="100" text="4 8 15 16 23 42" id="myLabel" visible="false"/> </mx:Panel> </mx:Application> 然后我们为按钮添加一个效果,步骤如下 1.定义一个动态效果标签 <mx:Glow id="buttonGlow" color="0x99FF66" alphaFrom="1.0" alphaTo="0.3" duration="1500"/> 2.将其和按钮进行绑定 <mx:Button x="40" y="60" label="View" id="myButton" mouseUpEffect="{buttonGlow}" /> 另外一种方法就是可以在设计模式下右侧的面板中的Flex Properties> Effects > mouseUpEffect中的值填写{buttonGlow}实现效果 3.运行一下吧,然后做更棒的效果改变 现在来为Label作个淡出的效果,一样首先也是添加效果标签,代码如下: <mx:Blur id="numbersBlur" blurYFrom="10.0" blurYTo="0.0" blurXFrom="10.0" blurXTo="0.0" duration="2000" target="{myLabel}"/>//具体的参数不在这里面详细说明 然后将这个效果的发生添加一个触发事件,触发器自然就是按钮喽,要在按钮里面做一下小的改动: <mx:Button x="40" y="60" label="View" id="myButton" mouseUpEffect="{buttonGlow}" click="numbersBlur.play(); myLabel.visible=true;"/> 然后发布,秀一下效果看看。 上面的做完了肯定会有和我一样不满足的朋友问,怎么做多个动作的实现,下面有两个标签可以用于实现效果: <mx:Parallel> 和<mx:Sequence>从字面上的意思也能够看出来有什么区别,不过还是自己来试一下吧。<mx:Parallel id="BlurMoveShow" target="{myLabel}">发现区别了吧,那就是 <mx:Parallel>是同时执行里面的动作而 <mx:Sequence>是按照标签的排列顺序由上至下来执行的。TrackbacksThe trackback URL for this entry is: http://snowyrock.spaces.live.com/blog/cns!B8CBEB7169880B1D!200.trak Weblogs that reference this entry
|
|
|