Flex4之动画效果---上下,左右擦掉效果
发布时间:2020-12-15 01:06:24 所属栏目:百科 来源:网络整理
导读:首先介绍从左到右的效果,这个是属于FLEX4的effects动画效果。 使图像从左到右隐藏效果,呵呵,不用多说,贴上代码: ?xml version="1.0" encoding="utf-8"?s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"? ? xmlns:s="library://ns.adobe.com/fle
首先介绍从左到右的效果,这个是属于FLEX4的effects动画效果。 使图像从左到右隐藏效果,呵呵,不用多说,贴上代码: <?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"?
? xmlns:s="library://ns.adobe.com/flex/spark"?
? xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
<s:layout>
<s:BasicLayout/>
</s:layout>
<mx:Script>
<!--[CDATA[
private function changeEffect(eventObj:Event):void {
if (myButton.getStyle("mouseUpEffect") == myWR) {
myButton.setStyle("mouseUpEffect",myWL);
}
else if (myButton.getStyle("mouseUpEffect") == myWL) {
myButton.setStyle("mouseUpEffect",myWR);
}
}
]]-->
</mx:Script>
<fx:Declarations>
<!--定义左右两个方向的擦去效果-->
<mx:WipeRight id="myWR" duration="1000"/>
<mx:WipeLeft id="myWL" duration="1000"/>
</fx:Declarations>
<mx:Panel title="交换使用不同的行为效果" width="95%" height="95%"
horizontalAlign="center" verticalAlign="middle">
<mx:Button id="myButton" label="按钮"
width="150" height="80"
mouseUpEffect="{myWL}"
click="changeEffect(event);"/>
</mx:Panel>
</mx:Application>
下面我在介绍上下擦掉效果: 代码如下所示: <?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
<s:layout>
<s:BasicLayout/>
</s:layout>
<fx:Declarations>
<!-- 将非可视元素(例如服务、值对象)放在此处 -->
<mx:WipeUp id="wipeOut" duration="1000"/>
<mx:WipeUp id="wipeIn" duration="1000"/>
</fx:Declarations>
<mx:Panel title="向上擦掉效果示例" width="95%" height="95%"
paddingTop="5" paddingLeft="10" paddingRight="10" paddingBottom="5">
<mx:Text width="100%" color="blue"
text="使用向上擦掉的效果来显示或者隐藏图片。"/>
<!-- 给目标组件赋予效果 -->
<mx:Image source="@Embed(source='http_imgload.jpg')"
visible="{cb1.selected}"
hideEffect="{wipeOut}" showEffect="{wipeIn}"/>
<mx:CheckBox id="cb1" label="可视" selected="true"/>
</mx:Panel>
</s:Application>
其中: <mx:WiperUP><mx:WipeDown><mx:WipeLeft><mx:WipeRight>都处在,<fx:Declaration>中。 mx:WipeRight和mx:WipeLeft标签分别实现自左往右和自右往左隐藏或显示组件的效果 mx:WipeUp和mx:WipeDown标签分别实现自上往下和自下往上隐藏或显示组件的效果 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |