摘要 利用XML和Flash組件技術構建Flash視頻點播系統,技術實現容易,擴展維護方便,結構形式靈活多樣。以Flash 8為創作工具,詳細闡述了構建視頻點播系統的具體方法和關鍵技術。
關鍵詞 XML; Flash組件;視頻點播
中圖分類號: TP37文獻標識碼:A文章編號:1671-489X(2006)12-0051-02
Practice on Using Flash 8 to Construct VOD System// Luo Wenbin, Wang Xiaoyan, Luo Jinhua
Abstract It is not only easy to implement and maintain but also flexible to structure of using XML and Flash component technology to construct VOD system. This paper, using flash 8 as a development tool, narrates the specific method and key technology in constructing VOD system.
Key words XML; Flash component; VOD
Author's address Modern Technology Centre of Huazhong Science Technology University, 430000, Wuhan, China
1 引言
利用Flash不僅能夠制作出高質量的動畫和視頻,而且還由于其具有良好的交互性能而受到媒體制作者的青睞。Flash8給媒體創作者提供了更多的模板和組件,利用這些模板和組件不僅可以幫助我們快速地建立多媒體課程網站和交互學習內容,而且對視頻編碼和外部視頻的播放控制有了更好的支持,為我們快速構建視頻點播系統提供了技術保障。
一個架構良好的點播系統,不僅能夠實現視頻點播的功能,還應該具有良好的擴展性能,便于視頻文件的增加和刪除,所以本文采用外部XML文檔記錄視頻的相關信息,結合Flash組件技術構建擴展維護方便的視頻點播系統。
2、視頻點播系統的構建
利用Flash組件構建視頻點播系統時,應用不同的組件構建出來的視頻點播系統的結構形式可以靈活多樣,常見的樣式有菜單式、樹狀結構式、表格式和列表式。每一種樣式的顯示效果和XML文檔的結構層次有一定的關系,下面以菜單式結構為例,闡述構建視頻點播系統的具體方法和關鍵技術。
1)建立XML文檔。
選用XML文檔來描述視頻資源的相關信息,是由于XML文檔具有很強的通用性和擴展性。一個播放系統建立起來之后,經常需要更新系統中的文件,采用了XML文檔之后,當需要更改某一個具體的視頻描述信息時,只需要在XML文件中修改相應的內容就可以了,維護非常方便。這里新建一個XML文檔,輸入如下的內容,并命名為\"video.xml\"。
<xml version="1.0" encoding="UTF-8" ?>
<root>
<node label="物理系實驗室">
<subnode label="熱輻射與紅外掃描實驗" url="video\video1.flv" />
<subnode label="快速電子的量能相對論關系" url="video\video2.flv" />
</node>
<node label="機械學院實驗室">
<subnode label="皮帶傳動實驗的實驗目的" url="video\video3.flv" />
</node>
</root>
\"root\"標記是這個XML文檔的根元素,每一個XML文檔只能有一個根元素。\"node\"標記是根元素下面的子元素,一個根元素可以有多個子元素。\"subnode\"標記是\"node\"元素下面的子元素,每一個子元素也都可以包含多個子元素。這些標記的名稱可以根據實際需要任意更改。這里用\"label\"和\"url\"來描述視頻資源的兩個基本屬性:名稱和存放位置。點播系統中最基本的要求是點擊一個\"名稱\",播放相應的視頻,該名稱就是\"label\"來描述,具體存放位置由\"url\"來描述。如果有需要可以增加其它的描述信息。從XML文檔中可以看到視頻文件都存放在\"video\"目錄中,視頻文件的名稱依次為\"video1.flv\"、\"video2.flv\"和\"video3.flv\",如果有更多的視頻,按照這種方式依次擴展。
2)構建播放系統。
打開Flash 8應用程序,新建一個文檔,將其保存在和XML文檔相同的目錄,便于后續闡述。構建視頻點播系統主要用到Flash 8提供的三個組件:XMLConnecter(數據連接組件)、Menubar(菜單組件)和 FLVPlayback(FLV視頻播放組件)。分別將這三個組件拖放到舞臺上合適的位置,并依次命名實例名為\"my_xml\"、\"my_menu\"、\"my_player\"。XMLConnecter組件在文件運行時不會顯示出來,只起到一個數據連接的作用,所以它的具體位置和最后顯示的結果無關。Menubar組件和FLVPlayback組件的尺寸和位置根據實際需要進行設置。選擇菜單是通過Menubar組件來呈現的,選擇Menubar組件中呈現的一個子菜單之后,FLVPlayback組件將播放對應的視頻文件,完成點播功能。
在舞臺上選擇XMLConnecter組件,打開\"組件檢查器\"參數面板,在\"參數\"標簽中設置路徑\"URL\"參數為\"video.xml\",方向\"direction\"為\"receive\"。在\"架構\"標簽中選擇\"results:XML\"后,單擊,導入前面制作好的\"video.xml\"文檔,成功導入后,如圖1所示。

選擇Menubar組件,在其組件檢查器面板中單擊\"綁定\"標簽,添加一個\"dataProvider:XML\"的\"綁定\",選擇添加的綁定,設置\"direction\"為\"in\",\"bound to\"為\"XMLConnector\"中的\"root:Object\"位置。其它的保持默認設置。通過上面的設置,已經完成了XMLConnecter組件和外部XML文件的關系,同時完成了XMLConnecter組件和Menubar組件之間的綁定關系。如果這時修改外部\"video.xml\"文件的內容,Menubar組件顯示的內容也會做相應的改變。在時間軸的第一幀上,添加腳本代碼\"my_xml.trigger ();\",讓文件運行時加載XML文檔。
發布文件,就能夠看到Menubar組件正常顯示菜單了,如圖2所示。
要實現點擊菜單欄上的不同菜單就能夠播放不同的視頻,還需要讓菜單和媒體播放組件之間建立聯動關系,對鼠標的操作進行偵聽。在時間軸的第一幀上,繼續添加腳本代碼:
listener_play = function (evt) {
my_player.contentPath = evt.menuItem.attributes["url"];
my_player.play();};
my_menu.addEventListener("change", listener_play);
在上面的腳本中,為菜單實例\"my_menu\"注冊了一個\"listener_play\"偵聽器函數,當菜單發生\"change\"事件時,就會調用偵聽器函數,函數的主體\"my_player.contentPath = evt.menuItem.attributes[\"url\"];my_player.play();\"是將選擇的菜單項\"URL\"屬性值賦給媒體播放組件實例\"my_player\"的\"contentPath\"屬性,并啟動播放。最終效果如圖3所示。
到這里,一個簡單的播放系統就構建完畢了。在播放一個視頻的同時,如果選擇了其它的菜單項,則媒體播放組件就會播放新選擇的視頻,而終止前面選擇的視頻。如果需要更新菜單名稱或者實際的視頻文件,只需要更改XML文檔中的內容,并將相應的視頻文件復制到對應的目錄就可以了,擴展和維護非常方便。如果需要對視頻進行暫停、快進和停止等操作,直接設置媒體播放組件的外觀樣式就可以了。