Flex的VideoDisplay控件中如何创建和使用ActionScript暗点的例子

By Minidxer | June 22, 2008

接下来的例子中演示了Flex的VideoDisplay控件中如何创建和使用ActionScript暗点。例子中使用VideoDisplay控件显示video下载的进度，两个DataGrid控件显示ActionScript暗点和嵌入暗点。

由于例子中使用了两个Datagrid，在单独页面中察看效果比较不错：

Search-256x256 Demo | View Source


下面是完整代码(或点击这里察看)：

Download: main.mxml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalAlign="middle" backgroundColor="white"> 
  3.  
  4.     <mx:Script>
  5.         <![CDATA[
  6.             import mx.collections.ArrayCollection;
  7.             import mx.events.CuePointEvent;
  8.  
  9.             [Bindable]
  10.             private var embeddedCuePoints:ArrayCollection = new ArrayCollection();
  11.  
  12.             private function onCuePoint(evt:CuePointEvent):void {
  13.                 var cuePointObject:Object = {name:evt.cuePointName, time:evt.cuePointTime, type:evt.cuePointType};
  14.                 if (evt.cuePointType != "actionscript") {
  15.                     embeddedCuePoints.addItem(cuePointObject);
  16.                 }
  17.             }
  18.         ]]>
  19.     </mx:Script> 
  20.  
  21.     <mx:Array id="cuePointArr">
  22.         <mx:Object name="one" time="1" type="actionscript" />
  23.         <mx:Object name="two" time="2" type="actionscript" />
  24.     </mx:Array> 
  25.  
  26.     <mx:VideoDisplay id="videoDisplay" cuePointManagerClass="mx.controls.videoClasses.CuePointManager" cuePoints="{cuePointArr}" cuePoint="onCuePoint(event)" source="http://www.helpexamples.com/flash/video/cuepoints.flv" playheadUpdate="progressBar.setProgress(videoDisplay.playheadTime, videoDisplay.totalTime);" />
  27.     <mx:ProgressBar id="progressBar" mode="manual" width="{videoDisplay.width}" minimum="0" maximum="{videoDisplay.totalTime}" label="{videoDisplay.state} %3%%" /> 
  28.  
  29.     <mx:HBox>
  30.         <mx:Panel title="ActionScript cue points:">
  31.             <mx:DataGrid id="actionScriptCuePointGrid" dataProvider="{videoDisplay.cuePoints}">
  32.                 <mx:columns>
  33.                     <mx:DataGridColumn dataField="name" headerText="Name:" />
  34.                     <mx:DataGridColumn dataField="time" headerText="Time:" />
  35.                     <mx:DataGridColumn dataField="type" headerText="Type:" />
  36.                 </mx:columns>
  37.             </mx:DataGrid>
  38.         </mx:Panel> 
  39.  
  40.         <mx:Panel title="Embedded cue points:">
  41.             <mx:DataGrid id="embeddedCuePointGrid" dataProvider="{embeddedCuePoints}" itemClick="videoDisplay.playheadTime = event.currentTarget.selectedItem.time;">
  42.                 <mx:columns>
  43.                     <mx:DataGridColumn dataField="name" headerText="Name:" />
  44.                     <mx:DataGridColumn dataField="time" headerText="Time:" />
  45.                     <mx:DataGridColumn dataField="type" headerText="Type:" />
  46.                 </mx:columns>
  47.             </mx:DataGrid>
  48.         </mx:Panel>
  49.     </mx:HBox> 
  50.  
  51. </mx:Application>
代码：Peter deHaan 翻译/整理/编译：minidxer

Topics: Flex | 1 Comment » | 131 views Tags: , , , , ,

你可能还对下列文章感兴趣:

One comment | Add One

Trackbacks

Leave a Comment

Name(*):

E-Mail(*) :

Website :

Comments :

Search Posts

Categories

Archives

Blogroll