Flex设置progressbar控件完成时播放声音效果

以下的例子将展示如何设置mx.effects--SoundEffect类和ProgressBar类的completeEffect来实现为Flex ProgressBar控件增加一个嵌入式的声音播放效果。

 

'; } else { whichEl.style.display = 'none'; sb.innerHTML=' 显示代码'; whichEl.witdh="300px"; } }   隐藏代码

DE<<?xml version="1.0" encoding="utf-8"?> <!-- http://blog.flexexamples.com/2008/06/30/playing-a-sound-effect-when-a-progressbar-control-completes-in-flex/ --> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"         layout="vertical"         verticalAlign="middle"         backgroundColor="white">     <mx:Script>         <![CDATA[             import mx.events.SliderEvent;             private function slider_change(evt:SliderEvent):void {                 progressBar.setProgress(evt.value, slider.maximum);             }         ]]>     </mx:Script>     <mx:SoundEffect id="ding"             source="@Embed('ding.mp3')" />     <mx:ApplicationControlBar dock="true">         <mx:Form styleName="plain">             <mx:FormItem label="percentComplete:">                 <mx:HSlider id="slider"                         minimum="0"                         maximum="100"                         value="0"                         snapInterval="1"                         tickInterval="10"                         liveDragging="true"                         showTrackHighlight="true"                         change="slider_change(event);" />             </mx:FormItem>         </mx:Form>     </mx:ApplicationControlBar>     <mx:ProgressBar id="progressBar"             mode="manual"             completeEffect="{ding}" /> </mx:Application> DE<

或者用AS实现

 

DE<<?xml version="1.0" encoding="utf-8"?> <!-- http://blog.flexexamples.com/2008/06/30/playing-a-sound-effect-when-a-progressbar-control-completes-in-flex/ --> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"         layout="vertical"         verticalAlign="middle"         backgroundColor="white"         initialize="init();">     <mx:Script>         <![CDATA[             import mx.containers.ApplicationControlBar;             import mx.containers.Form;             import mx.containers.FormItem;             import mx.controls.HSlider;             import mx.controls.ProgressBar;             import mx.controls.ProgressBarMode;             import mx.effects.SoundEffect;             import mx.events.SliderEvent;             [Embed("ding.mp3")]             private var dingMP3:Class;             private var ding:SoundEffect;             private var slider:HSlider;             private var progressBar:ProgressBar;             private function init():void {                 ding = new SoundEffect();                 ding.source = dingMP3;                 slider = new HSlider();                 slider.minimum = 0;                 slider.maximum = 100;                 slider.value = 0;                 slider.snapInterval = 1;                 slider.tickInterval = 10;                 slider.liveDragging = true;                 slider.setStyle("showtrackHighlight", true);                 slider.addEventListener(SliderEvent.CHANGE,                             slider_change);                 var formItem:FormItem = new FormItem();                 formItem.label = "percentComplete:";                 formItem.addChild(slider);                 var form:Form = new Form();                 form.styleName = "plain";                 form.addChild(formItem);                 var appControlBar:ApplicationControlBar;                 appControlBar = new ApplicationControlBar();                 appControlBar.dock = true;                 appControlBar.addChild(form);                 Application.application.addChildAt(appControlBar, 0);                 progressBar = new ProgressBar();                 progressBar.mode = ProgressBarMode.MANUAL;                 progressBar.setStyle("completeEffect", ding);                 addChild(progressBar);             }             private function slider_change(evt:SliderEvent):void {                 progressBar.setProgress(evt.value, slider.maximum);             }         ]]>     </mx:Script> </mx:Application> DE<

查看Demo演示

原创作者： peterd。翻译整理：一路风尘