¡¤Äúµ±Ç°µÄλÖãºÊ×Ò³ > ¼¼Êõ½Ì³Ì > ²¥·ÅÆ÷½Ì³Ì >

FlexÊÓƵ²¥·ÅÆ÷¿ª·¢£¨³õ¼¶½×¶Î£©½Ì³Ì

ʱ¼ä:2012-08-28 10:17iteye.com
VideoDisplay²¥·ÅÊÓƵ¡¢HSlider½ø¶ÈÌõ¡¢¿ªÊ¼¡¢ÔÝÍ£¡¢Í£Ö¹¡¢ÉùÒô´óС¡¢È«ÆÁ¡¢µ±Ç°Ê±¼ä/×Üʱ¼ä£¬Ò»¸ö»ù±¾µÄÒ³ÃæÔÚFlex Builder3.0Ϻܿì¾ÍÄܹ¹½¨Íê³É¡£ÔÚÕâÀï˵Ã÷һϣ¬¿ªÊ¼£¬Í£Ö¹µÈÕâЩ°´Å¥£¬ÎÒÊÇÓÃImageÀ´ÊµÏֵģ¬¶ø²»ÊÇButton£¬ÒòΪÈç¹ûʹÓÃButton£¬Æä×Ô´øÓÐ

¿ª·¢¹¤¾ßFlex Builder3.0

 

£¨Ò»£©¹¹½¨Ò³Ã棺

VideoDisplay²¥·ÅÊÓƵ¡¢HSlider½ø¶ÈÌõ¡¢¿ªÊ¼¡¢ÔÝÍ£¡¢Í£Ö¹¡¢ÉùÒô´óС¡¢È«ÆÁ¡¢µ±Ç°Ê±¼ä/×Üʱ¼ä£¬Ò»¸ö»ù±¾µÄÒ³ÃæÔÚFlex Builder3.0Ϻܿì¾ÍÄܹ¹½¨Íê³É¡£ÔÚÕâÀï˵Ã÷һϣ¬“¿ªÊ¼”£¬“Í£Ö¹”µÈÕâЩ°´Å¥£¬ÎÒÊÇÓÃImageÀ´ÊµÏֵģ¬¶ø²»ÊÇButton£¬ÒòΪÈç¹ûʹÓÃButton£¬Æä×Ô´øÓиö±ß¿òºÍ±³¾°Ñùʽ£¬±à¼­CSSÈ¥µôÒ²¿ÉÒÔ£¬µ«ÊDZȽÏÂé·³¡£ÓÃImageÖ±½ÓÖ¸¶¨Ò»¸öͼƬ£¬È»ºó°ÑbuttonModeÉèΪtrue£¬¾ÍºÍ°´Å¥²î²»¶àÁË£¬µ±È»Õâ¸öÒ²ÐèҪϸ»¯£¬±ÈÈçÊó±ê°´Ïº͵¯ÆðµÄÑùʽ£¬ÎÒÕâÖ»Êdzõ¼¶½×¶Î£¬¾Í²»¿¼ÂÇÄÇô¶àÁË£¡

 

  1. <mx:Image source="{playClass}" click="playButton();" id="playBtn" buttonMode="true"/> 

     £¨¶þ£©Ôö¼Ó»ù±¾¹¦ÄÜ£º

      ÎÒÖ±½ÓÕ³Ìù´úÂ룺

  1. <?xml version="1.0" encoding="utf-8"?> 
  2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" height="440" width="500" fontSize="12" initialize="init();"> 
  3.       
  4.     <mx:Script> 
  5.         <![CDATA[  
  6.             import mx.controls.Alert;  
  7.             import mx.events.SliderEvent;  
  8.             import mx.events.VideoEvent;  
  9.               
  10.             [Embed(source="assets/videoIco/play_small.png")]  
  11.             [Bindable]  
  12.             private var playClass:Class;                //²¥·Åͼ±êÑùʽ  
  13.               
  14.             [Embed(source="assets/videoIco/pause.png")]  
  15.             [Bindable]  
  16.             private var pauseClass:Class;               //ÔÝͣͼ±êÑùʽ  
  17.               
  18.             [Embed(source="assets/videoIco/sound1.png")]  
  19.             [Bindable]  
  20.             private var sound1:Class;               //ÉùÒôÑùʽ1  
  21.               
  22.             [Embed(source="assets/videoIco/sound.png")]  
  23.             [Bindable]  
  24.             private var sound:Class;                //ÉùÒôÑùʽ2£¨¾²Òô£©  
  25.               
  26.             [Bindable]  
  27.             private var videoSource:String;         //ýÌå·¾¶  
  28.               
  29.             private var isPause:Boolean = false;        //ÔÝͣ״̬  
  30.             private var isSound:Boolean = true;         //ÉùÒô״̬  
  31.             private var isFullScreen:Boolean = false;   //ÊÇ·ñÊÇÈ«ÆÁ  
  32.             private var tmpSound:Number = 0;            //ÁÙʱÉùÒô´óС  
  33.             [Bindable]  
  34.             private var playPosition:Number;            //²¥·ÅßM¶È   
  35.               
  36.             private function init():void{  
  37.                 videoSource = parameters.videosource;  
  38.             }  
  39.               
  40.             private function playingMove(event:VideoEvent):void{  
  41.                 my_hs.value = myVid.playheadTime;  
  42.             }  
  43.               
  44.             //½ø¶ÈÌõ¸Ä±ä  
  45.             private function hs_onchange(event:SliderEvent):void{  
  46.                 if(myVid.playheadTime == -1){  
  47.                     my_hs.value = 0;  
  48.                     return;  
  49.                 }  
  50.                 playPosition = my_hs.value;             //±£Õý²¥·Å½ø¶È½yÒ»  
  51.                 myVid.playheadTime = playPosition;  
  52.             }  
  53.               
  54.             //½ø¶ÈÌõÊó±ê°´Ï  
  55.             private function thumbPress():void{  
  56.                 myVid.pause();  
  57.             }  
  58.             //½ø¶ÈÌõÊó±êµ¯Æð  
  59.             private function thumbRelease():void{  
  60.                 myVid.playheadTime = playPosition;  
  61.                 myVid.play();  
  62.             }  
  63.               
  64.               
  65.             //²¥·Å£¬ÔÝÍ£  
  66.             private function playButton():void{  
  67.                 if(!isPause){  
  68.                     myVid.play();  
  69.                     playBtn.source = pauseClass;  
  70.                     isPause = true;  
  71.                 }else{  
  72.                     myVid.pause();  
  73.                     playBtn.source = playClass;  
  74.                     isPause = false;  
  75.                 }  
  76.             }  
  77.               
  78.             //²¥·ÅÍê³É  
  79.             private function vidComplete():void{  
  80.                 playBtn.source = playClass;  
  81.                 isPause = false;  
  82.             }  
  83.               
  84.             //Í£Ö¹²¥·Å  
  85.             private function stopButton():void{  
  86.                 myVid.stop();  
  87.                 playBtn.source = playClass;  
  88.                 isPause = false;  
  89.             }  
  90.               
  91.             //ÇГQÈ«ÆÁï@ʾ  
  92.             private function display():void{  
  93.                 if(!isFullScreen){  
  94.                     stage.fullScreenSourceRect =new Rectangle(myVid.x,myVid.y,myVid.width,myVid.height);               
  95.                     stage.displayState =StageDisplayState.FULL_SCREEN;  
  96.                     isFullScreen = true;  
  97.                 }else{  
  98.                     stage.displayState = StageDisplayState.NORMAL;  
  99.                     isFullScreen = false;  
  100.                 }  
  101.             }  
  102.               
  103.             //µ÷ÕûÉùÒô  
  104.             private function sound_thumbChanges(event:SliderEvent):void{  
  105.                 myVid.volume = hs_sound.value;  
  106.             }  
  107.               
  108.             //¾²Òô  
  109.             private function closeSound():void{  
  110.                 if(isSound){  
  111.                     closeImg.source = sound;  
  112.                     tmpSound = myVid.volume;  
  113.                     myVid.volume = 0;  
  114.                     isSound = false;  
  115.                 }else{  
  116.                     closeImg.source = sound1;  
  117.                     myVid.volume = tmpSound;  
  118.                     isSound = true;  
  119.                 }  
  120.             }  
  121.               
  122.             //¸ñʽ»¯Ê±¼ä  
  123.             private function formatTime(time:Number):String{  
  124.                 var min:Number = Math.floor(time/60);  
  125.                 var sec:Number = Math.floor(time%60);  
  126.                   
  127.                 var timeResult:String = (min < 10 ? "0"+min.toString() : min.toString()) + ":" + (sec < 10 ? "0"+sec.toString() : sec.toString());  
  128.                   
  129.                 return timeResult;  
  130.             }  
  131.               
  132.             //slider¸ñʽ»¯  
  133.             private function dataTipFormat(data:Number):String{  
  134.                 return formatTime(data);  
  135.             }  
  136.         ]]> 
  137.     </mx:Script> 
  138.       
  139.     <mx:VideoDisplay id="myVid" x="10" y="10" height="360" width="480"   
  140.             source="{videoSource}"   
  141.             autoPlay="false"   
  142.             playheadUpdate="playingMove(event)"   
  143.             complete="vidComplete();"   
  144.             doubleClickEnabled="true" 
  145.             doubleClick="display();"/> 
  146.  
  147.     <mx:HBox width="473" verticalAlign="middle" x="17" y="395"> 
  148.         <mx:Image source="{playClass}" click="playButton();" id="playBtn" buttonMode="true"/> 
  149.         <mx:Image source="@Embed('assets/videoIco/stop.png')" click="stopButton();" buttonMode="true"/> 
  150.         <mx:Label text="{formatTime(myVid.playheadTime)}/{formatTime(myVid.totalTime)}" width="112"/> 
  151.         <mx:HRule height="0" width="80"/> 
  152.         <mx:Image source="{sound1}" click="closeSound();" id="closeImg" buttonMode="true"/> 
  153.         <mx:HSlider width="96" id="hs_sound" minimum="0" maximum="1"   
  154.             change="sound_thumbChanges(event)" 
  155.             value="{myVid.volume}"   
  156.             fillAlphas="[0.6, 1.0, 1.0, 1.0]"/> 
  157.         <mx:Button label="È«ÆÁ" click="display();"  cornerRadius="20"/> 
  158.     </mx:HBox> 
  159.     <mx:HSlider width="478" id="my_hs" minimum="0" maximum="{myVid.totalTime}" height="9" x="12" y="378" 
  160.         horizontalCenter="0" 
  161.         showTrackHighlight="true" 
  162.         change="hs_onchange(event)" 
  163.         thumbPress="thumbPress();" 
  164.         thumbRelease="thumbRelease();" 
  165.         dataTipFormatFunction="dataTipFormat"/> 
  166. </mx:Application> 

    videoSource = parameters.videosource; Õâ¸öÊÇ»ñÈ¡´ÓhtmlÎļþ´«½øÀ´µÄflv²¥·ÅÔ´£¬ÔÚhtmlÖÐʹÓÃFlashVars½øÐвÎÊý´«µÝ

    Õâ¸ö¼òÒ׵IJ¥·ÅÆ÷ÓÐÒÔϼ¸¸öÎÊÌ⻹û½â¾ö£º

    1.½ø¶ÈÌõ°´Ï»¬¿éÍ϶¯£¬Íϵ½ÐµÄʱ¼äµãÊÍ·ÅÊó±êºó£¬½ø¶ÈÌõ»áÏòºóÌø¶¯Ò»¶Î¾àÀ뿪ʼ²¥·Å£¬¶ø²»ÊÇÄãÊó±ê·Å¿ªµÄÄǸöλÖá£

    2.ÔÚ½ø¶ÈÌõÉÏÖ±½ÓµãеIJ¥·Åµã£¬»¬¿é»áÏȻص½Ô­À´µÄ²¥·Åµã£¬È»ºó²Åµ½ÐµIJ¥·Åµã£¬ÖмäÓиöÕâÖÖЧ¹ûûÓÐÈ¥µô

    3.ÊÓƵµÄ»º³å»úÖÆûÓд¦Àí¡££¨½ÜÈ»²»Í¬ £©

ÈÈÃÅÎÄÕÂÍƼö

ÇëÉÔºò...

±£ÀûÍþÊÓÔÆƽ̨-ÇáËÉʵÏֵ㲥ֱ²¥ÊÓƵӦÓÃ

¿á²¥ÔÆÊý¾Ýͳ¼Æ·ÖÎö¿çƽ̨²¥·ÅÆ÷