您的位置:首页 > 其它

Flex中设置进度条(ProgressBar)完成时效果的例子

2009-11-11 11:44 399 查看
下面的例子展示了如何设置进度条(ProgressBar)完成(100%)时的效果(演示一次)。
下面是具体的代码:
Download: main.mxml

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white">

<mx:Script>
<![CDATA[
private var timer:Timer;

private function init():void {
timer = new Timer(10);
timer.addEventListener(TimerEvent.TIMER, timer_timer);
}

private function timer_timer(evt:TimerEvent):void {
progressBar.setProgress(progressBar.value + 1, 100);
}

private function progressBar_complete(evt:Event):void {
timer.stop();
}

private function resetProgressBar():void {
progressBar.setProgress(0, 100);
progressBar.scaleX = 1.0; // 100%
progressBar.scaleY = 1.0; // 100%
progressBar.alpha = 1.0; // 100%
}

private function playProgressBar():void {
resetProgressBar();
timer.start();
}
]]>
</mx:Script>

<mx:Parallel id="progressBar_completeEffect">
<mx:Fade alphaTo="0.0" />
<mx:Zoom zoomHeightTo="0" />
</mx:Parallel>

<mx:ApplicationControlBar dock="true">
<mx:Button label="Play"
click="playProgressBar();" />
<mx:Button label="Reset"
click="resetProgressBar();" />
</mx:ApplicationControlBar>

<mx:ProgressBar id="progressBar"
complete="progressBar_complete(event);"
completeEffect="{progressBar_completeEffect}"
mode="manual"
labelPlacement="center"
width="80%"
height="60%"
creationComplete="init();" />

</mx:Application>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐