Flex 4 +Red5 流媒體使用研究2——Flex4的VideoPlayer控制項應用

　　我將在下面的例子示範中，使用Red5作為流媒體伺服器，使用到讀取XML設定檔技術、SharedObject傳參和事件傳遞機制（註：事件本身是可以儲存和傳遞參數的）。

        讀取設定檔，包括兩個值：流媒體服務串連地址和初始化的視頻名稱。

<?xml version="1.0"?>
<videoConfig>
    <item>
        <rtmpUrl>rtmp://localhost/oflaDemo/</rtmpUrl>
        <filmName>IronMan.flv</filmName>
    </item>
</videoConfig>

　　自己寫的簡單的事件類別VideoEvent，主要用來發送事件和監聽事件。

 

事件類別
package
{
    import flash.events.EventDispatcher;
    public class VideoEvent extends EventDispatcher
    {
        //        靜態常量，定義事件類型
        public static const VidoPlay:String="VideoPlay";
        //        靜態執行個體
        private static var _instance:VideoEvent;
        public static function getInstance():VideoEvent
        {
            if(_instance==null)
            _instance=new VideoEvent();
            return _instance;
        }
    }
}

　　使用VideoPlayer控制項的主MXML應用程式代碼。首先是讀取設定檔的資料，並初始化VideoPlayer控制項。

 

VideoPlayer控制項應用
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/halo" width="500" height="500"
               
               applicationComplete="init()"
               >
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
        <mx:HTTPService id="myService" url="videoConfig.xml" result="resultHandler(event)"/>
    </fx:Declarations>
    
    <fx:Script>
        <![CDATA[
            import mx.rpc.events.ResultEvent;
            import mx.controls.Alert;
            
            //定義視頻播放事件監聽對象
            public var instance:VideoEvent=VideoEvent.getInstance();    

        private var filmSource:String="";//IronMan.flv
            
            private function init():void
            {
                //發送讀取配置的請求
                myService.send();
                //定義視頻播放事件監聽
                instance.addEventListener("VideoPlay",playVideoHandler);
                
            }
            //視頻監聽的處理
            private function playVideoHandler(event:Event):void
            {
                var myVideo:SharedObject;
                //將播放頭置於視頻開始處
                myVideo=SharedObject.getLocal("videoCookie");
                var vName:String=myVideo.data.vName;
                //播放選中的視頻
                film.source=filmSource+vName;
            }
            private function changeSource():void
            {
                var myVideo:SharedObject;
                //將播放頭置於視頻開始處
                myVideo=SharedObject.getLocal("videoCookie");
                //將視頻的檔案名稱，存放到共用檔案裡
                myVideo.data.vName="DarkKnight.flv";
                //一定要先存放VCODE到共用對象裡，再分發事件
                instance.dispatchEvent(new Event("VideoPlay"));
            }
            
            //讀取設定檔
            private function resultHandler(event:ResultEvent):void
            {
                //擷取流媒體伺服器 地址
                filmSource=event.result.videoConfig.item.rtmpUrl;
                //擷取流媒體檔案名
                var filmName:String=event.result.videoConfig.item.filmName;
                //擷取流媒體完整路徑
                film.source=filmSource+filmName;
            }
        ]]>
    </fx:Script>

    <s:VideoPlayer width="396" height="294" id="film"/> 
<s:Button  label="更換播放源" buttonDown="changeSource()" x="8" y="301"/>
</s:Application>

 

**註：使用本執行個體，需要安裝Red5並啟動服務。