基于Cairngorm框架的FLV播放器

高傲的活着 发表于 2011-12-22 08:54

<DIV>FLV播放器是一种专用于播放FLV格式视频的播放器，FLV是时下最流行的播放格式，其特点是压缩比高、文件容量小、支持渐进式缓冲播放等。Flex4.0中的VideoDisplay组件专用于播放Flv格式视频。</DIV>
<DIV>一、前期准备</DIV>
<DIV>1.组织文件结构：</DIV>
<DIV><A href="http://blog.chinaunix.nethttp://blog.chinaunix.net/attachment/201107/1/25434387_1309525108zsCj.jpg" target=_blank><IMG border=0 src="http://blog.chinaunix.nethttp://blog.chinaunix.net/attachment/201107/1/25434387_1309525108zsCj.jpg" ; .load="imgResize(this, 650);"></A></DIV>
<DIV>    图1（FLV播放器文件的组织结构）</DIV>
<DIV> </DIV>
<DIV>2.导入Cairngorm框架</DIV>
<DIV> </DIV>
<DIV>二、使用FlvModel类存储数据、状态及资源</DIV>
<DIV>FlvModel类继承与Cairngorm框架的ModelLocator，用以存储数据状态和资源，例如，当前播放的视频地址、是否为全频状态、图片资源等都存储于FlvModel类中。以下代码定义了FlvModel类。</DIV>
<DIV>
<DIV id=codeText class=codeText>
<OL style="PADDING-BOTTOM: 5px; MARGIN: 0px 1px 0px 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 5px" class=dp-css>
<LI>package com.xi.flvPlayer.model </LI>
<LI>{ </LI>
<LI>    import com.adobe.cairngorm.model.ModelLocator; </LI>
<LI>    import mx.controls.ToolTip; </LI>
<LI>     </LI>
<LI>    public class FlvModel implements ModelLocator </LI>
<LI>    { </LI>
<LI>        private static var flvModel:FlvModel=new FlvModel(); //定义FlvModel类实例flvModel </LI>
<LI>         </LI>
<LI>        public static function getInstance():FlvModel{ //获得FlvModel类的实例 </LI>
<LI>            return flvModel; </LI>
<LI>        } </LI>
<LI>         </LI>
<LI>        public static var currVideo:String=""; //当前视频播放地址 </LI>
<LI>        public static var videoSource:String=""; //将要加载的视频地址 </LI>
<LI>        public static var isFullScreen:Boolean=false; //是否全屏状态 </LI>
<LI>         </LI>
<LI>        /*---------------------------------图标资源----------------------------------*/ </LI>
<LI>        [Bindable] </LI>
<LI>        [Embed(source="/assets/images/btn_moveover_break.png")] </LI>
<LI>        public var btn_moveover_break:Class; </LI>
<LI>         </LI>
<LI>        [Bindable] </LI>
<LI>        [Embed(source="/assets/images/btn_moveover_fullscreen.png")] </LI>
<LI>        public var btn_moveover_fullscreen:Class; </LI>
<LI>         </LI>
<LI>        [Bindable] </LI>
<LI>        [Embed(source="/assets/images/btn_moveover_play.png")] </LI>
<LI>        public var btn_moveover_play:Class; </LI>
<LI>         </LI>
<LI>        [Bindable] </LI>
<LI>        [Embed(source="/assets/images/btn_moveover_stop.png")] </LI>
<LI>        public var btn_moveover_stop:Class; </LI>
<LI>         </LI>
<LI>        [Bindable] </LI>
<LI>        [Embed(source="/assets/images/btn_normal_break.png")] </LI>
<LI>        public var btn_normal_break:Class; </LI>
<LI>         </LI>
<LI>        [Bindable] </LI>
<LI>        [Embed(source="/assets/images/btn_normal_fullscreen.png")] </LI>
<LI>        public var btn_normal_fullscreen:Class; </LI>
<LI>         </LI>
<LI>        [Bindable] </LI>
<LI>        [Embed(source="/assets/images/btn_normal_play.png")] </LI>
<LI>        public var btn_normal_play:Class; </LI>
<LI>         </LI>
<LI>        [Bindable] </LI>
<LI>        [Embed(source="/assets/images/btn_normal_stop.png")] </LI>
<LI>        public var btn_normal_stop:Class; </LI>
<LI>         </LI>
<LI>        [Bindable] </LI>
<LI>        [Embed(source="/assets/images/ico_break.png")] </LI>
<LI>        public var ico_break:Class; </LI>
<LI>    } </LI>
<LI>}</LI></OL></DIV></DIV>
<DIV>static关键字表示静态变量。静态变量可直接存取，其他变量需要实例化后才能存取。以下代码存取FlvModel</DIV>
<DIV>类中的变量currVideo和btn_normal_play.</DIV>
<DIV>import com.xi.flvPlayer.model.*;</DIV>
<DIV>FlvModel.currVideo="34324";</DIV>
<DIV>t=FlvModel.getInstance().btn_normal_play;</DIV>
<DIV> </DIV>
<DIV>三、使用FlvControl类监听事件</DIV>
<DIV>FlvControl类继承与Cairngorm框架的FrontControl类，用于监听CairngormEvent事件。习惯上，CairngormEvent事件的标识符字符串也都存储于前台控制器中。</DIV>
<DIV>以下代码定义了FlvControl类：</DIV>
<DIV>
<DIV id=codeText class=codeText>
<OL style="PADDING-BOTTOM: 5px; MARGIN: 0px 1px 0px 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 5px" class=dp-css>
<LI>package com.xi.flvPlayer.control </LI>
<LI>{ </LI>
<LI>    import com.adobe.cairngorm.control.FrontController; </LI>
<LI>    import com.xi.flvPlayer.commands.*; </LI>
<LI>    public class FlvControl extends com.adobe.cairngorm.control.FrontController </LI>
<LI>    { </LI>
<LI>        public function FlvControl():void //构造函数 </LI>
<LI>        { </LI>
<LI>            initialiseCommands(); </LI>
<LI>        } </LI>
<LI>         </LI>
<LI>        public function initialiseCommands():void{ </LI>
<LI>            addCommand(FlvControl.EVENT_OPEN_VIDEO,OpenVideoCommand); </LI>
<LI>        } </LI>
<LI>         </LI>
<LI>        public static var EVENT_OPEN_VIDEO:String="openVideo"; //定义openVideo标识 </LI>
<LI>    } </LI>
<LI>}</LI></OL></DIV></DIV>
<DIV>未完待续。。。</DIV>
<DIV>项目源码：</DIV>
<DIV><A href="http://blog.chinaunix.nethttp://blog.chinaunix.net/attachment/attach/25/43/43/8725434387138ca48717a344617b6db0705fce9578.zip" target=_blank><IMG border=0 align=absMiddle src="http://blog.chinaunix.net/blog/image/attachicons/zip.gif"> FlvPlayer.zip </A>  </DIV>

页: [1]

Chinaunix's Archiver

基于Cairngorm框架的FLV播放器