1. 程式人生 > >【播放器】關於 sewisePlayer HLS視訊播放器的二次開發(一)

【播放器】關於 sewisePlayer HLS視訊播放器的二次開發(一)

Sewise Player是一款專業的免費網頁HTML5視訊、流播放器,它功能強大,體積小,跨平臺,相容性好,使用方便簡潔。

  • 播放器是主要以HTML5技術為平臺開發,同時相容Flash技術,實現了跨平臺各瀏覽器相容的視訊播放。使用Sewise Player您可以在Windows, MacOS, Linux,Windows Phone, Android, IOS等任意平臺上,通過對應的瀏覽器或者APP中基於WebView播放視訊。
  • Sewise Player使用非常簡單,只要在頁面對應的DIV內嵌入一個JS檔案即可,播放器將通過自動識別瀏覽器的功能來啟用HTML5或Flash模式播放視訊。您不需要掌握任何JavaScript或ActionScript編碼技術就可以製作出專業的網頁視訊播放器。
  • Sewise Player即可以做為單一的前臺播放器來在頁面上播放視訊和流,也可以結合Sewise Server後臺技術實現專業的可互動的點播、直播視訊播放。

功能列表:

  • 支援HTML5,Flash視訊播放技術。
  • 支援多平臺,PC包括Windows, MacOS, Linux等。Mobile包括Android, IOS, Windows Phone等。
  • 支援多瀏覽器相容,如IE6/7/8/9/10、Google Chrome、Firefox、safari、Opera等。
  • 支援多種視訊格式,如mp4、m3u8、oga、webm、theora、flv、f4v等。
  • 支援多種協議直播流,如rtmp、hls、http等。
  • 支援Flash播放m3u8檔案,以及AES-128解碼播放。
  • 支援PC與Mobile平臺播放器自動識別功能。
  • 支援瀏覽器HTML5與Flash特性檢測。
  • 支援HTML5不同視訊格式地址Fallback相容播放功能。
  • 支援Flash Fallback到HTML5視訊播放功能。
  • 支援播放地址AMF, AJAX, JOSNP型別請求。
  • 支援自定義HTML5與Flash面板,讓您無需瞭解專業的編碼技術也可以製作出超烗風格的面板。
  • 支援前置廣告(swf, 圖片, 視訊)。
  • 支援字幕。
  • 支援多種播放參數設定,並支援啟動引數設定。
  • 支援豐富的api介面,以此可以快速打造功能強大的外掛
這個是官方在github上面的資源   個人 fork 了官方的資源,備份用。https://github.com/xingwen93/sewise-player

這個版本相對來說比新版的3.0穩定很多,個人認為。

這個版本還是有些不太符合使用者的使用行為,因此對此進行了二次開發

在此添加了 播放內容體的添加了點選的事件  類似 暴風影音的點選播放器播放暫停等功能

       videoContainer.as 思路


import flash.ui.Mouse;//更改滑鼠樣式
import flash.ui.MouseCursor;//更改滑鼠樣式
import interfaces.player.IVodPlayerMediator;//主播放器介面
//主播放器介面
private var _player:IVodPlayerMediator;
//初始化是否正在停止播放中
public var _paused:Boolean = false;
//標識第一次點選
private var isfirst:int=1;


this.addEventListener(MouseEvent.CLICK, mClickInitHandler);//新增  初始化時點選後暫停播放事件 即為第一次點選  
this.addEventListener(MouseEvent.MOUSE_MOVE, showCursorHandler);//新增移動到播放器上面後變成手勢的事件




/**------------------------------ 播放器檢視代理呼叫的方法  ---------------------------*/
/**適配播放器整個的點選事件**/
//傳遞 播放器主介面
public function setPlayer(p:IVodPlayerMediator):void{
 _player = p;
}
//實現監聽事件
private function mClickInitHandler(e:MouseEvent):void{
//當第一次點選的時候判斷是否自動在播放  第二次以上則在主窗體中呼叫
if(isfirst==1){
 if(!video.visible){
  _player.play();
  _paused=false;
 }else{
  _player.pause();
  _paused=true;
  }
 }
  isfirst=2;
}
//監聽滑鼠樣式更改事件
   private function showCursorHandler(e:MouseEvent) :void{
     Mouse.cursor=MouseCursor.BUTTON;
}

/**適配播放器整個的點選事件 結束       * */

  VodWhite.as 思路

//標識第一次點選
private var isfirst:int=1;
videoContainer.addEventListener(MouseEvent.CLICK, mClickHandler);//新增點選後暫停播放事件


public function set player(pm : IVodPlayerMediator) : void {
  _player = pm;
  controlBar.setPlayer(_player);

  videoContainer.setPlayer(_player);// 此處新增播放器點選後暫停播放事件用,所以傳遞播放器過去給播放內容
}

//監聽播放體的點選事件
private function mClickHandler(e:MouseEvent):void{
    if(isfirst==1){//第一次則跳過去讓播放的內容體監聽,第二次則控制播放
isfirst=2;
  }else{
    if(_stopped)  _player.play();
if(_paused) _player.play();
else _player.pause();
  }
}