OSMF(Open Source Media Framework)を使ってビデオファイル(FLV, F4V)を再生してみるメモ。
Adobe Open Source : Open Source Media Framework
現在のstableはVer.1.5。
注目のStage Video対応は1.6からになります。
OSMFを使用すると対象Flash Playerは10.1からとなるらしい。
Flex SDK 4.1からosmf.swcは同梱されてるらしい。
Flash Builder 4 setup
Flex SDK 4.5.0.17689
package com.inazumatv.video { import flash.display.DisplayObjectContainer; import org.osmf.elements.VideoElement; import org.osmf.events.MediaErrorEvent; import org.osmf.events.MediaPlayerStateChangeEvent; import org.osmf.events.PlayEvent; import org.osmf.events.TimeEvent; import org.osmf.media.MediaPlayer; import org.osmf.media.MediaPlayerSprite; import org.osmf.media.URLResource; import org.osmf.metadata.CuePoint; import org.osmf.traits.TraitEventDispatcher; public class PlayerSprite extends Object { private var _container:DisplayObjectContainer; private var _mps:MediaPlayerSprite; private var _videoElement:VideoElement; private var _mp:MediaPlayer; // ---------------------------------------- // CONSTRUCTOR // ---------------------------------------- public function PlayerSprite(container:DisplayObjectContainer) { _container = container; init(); } private function init():void { var source:String = 'rtmp://cp67126.edgefcs.net/ondemand/mp4:mediapm/osmf/content/test/cuepoints/spacealonehd_sounas_640_with_nav.f4v'; _mps = new MediaPlayerSprite(); _mp = mps.mediaPlayer; var resource:URLResource = new URLResource(source); _videoElement = new VideoElement(); videoElement.resource = resource; var dispatcher:TraitEventDispatcher = new TraitEventDispatcher(); dispatcher.media = videoElement; dispatcher.addEventListener(PlayEvent.PLAY_STATE_CHANGE, onPlayStateChange); mp.addEventListener(TimeEvent.CURRENT_TIME_CHANGE, onTimeUpdated); mp.addEventListener(TimeEvent.DURATION_CHANGE, onTimeUpdated); mp.addEventListener(MediaErrorEvent.MEDIA_ERROR, onMediaError); mp.addEventListener(MediaPlayerStateChangeEvent.MEDIA_PLAYER_STATE_CHANGE, onMediaPlayerStateChange); mp.media = videoElement; try{ container.addChild(_mps); } catch (error:TypeError) { trace(error); } } // ---------------------------------------- // EVENT HANDLER // ---------------------------------------- private function onMediaError(event:MediaErrorEvent):void { trace(event); } private function onMediaPlayerStateChange(event:MediaPlayerStateChangeEvent):void { trace(event.state); } private function onPlayStateChange(event:PlayEvent):void { trace(event.playState); } private function onTimeUpdated(event:TimeEvent):void { trace('time: ' + mp.currentTime + ' duration: ' + mp.duration); } // ---------------------------------------- // GETTER / SETTER // ---------------------------------------- // MediaPlayer public function get mp():MediaPlayer { return _mp; } // MediaPlayerSprite public function get mps():MediaPlayerSprite { return _mps; } // VideoElement public function get videoElement():VideoElement { return _videoElement; } } } |
ダウンロードしたOSMFのサンプルを参考にコードを作成しました。
ビデオURLはサンプルファイルに書かれているものです。
ちょっぴり悲しいアニメーションです。
トレースの結果は以下のようになります。
タイムコードのトレースは省きました。
onMediaPlayerStateChange loading onPlayStateChange playing onMediaPlayerStateChange ready onMediaPlayerStateChange buffering onMediaPlayerStateChange playing onPlayStateChange stopped onMediaPlayerStateChange buffering onMediaPlayerStateChange ready |
OSMFの要はorg.osmf.media.MediaPlayerだと思われます。
ただMediaPlayerはDisplayObjectではないのでaddChildできません。
なのでMediaPlayerだけどDisplayObjectなMediaPlayerSpriteが存在するのかも。
MediaPlayerSpriteを使わずMediaPlayerを使う場合は以下のようにします。
var source:String = 'assets/example.f4v'; var mp:MediaPlayer = new MediaPlayer(); var resource:URLResource = new URLResource(source); var video:VideoElement = new VideoElement(); video.resource = resource; mp.media = video; container.addChild(mp.displayObject); |
MediaPlayer.displayObjectをaddChildします。
なんかちょっと気持ち悪い使い方のような気がしますが…
【おまけ】
swcになってるパッケージのバージョンってどうやったら確認できるんだろ？
2014.01.04 19:57
> swcになってるパッケージのバージョンってどうやったら確認できるんだろ？
OSMF.swc のバージョンは、「import org.osmf.utils.Version;」すれば「Version.version」で「2.0」等のバージョン番号を取得できるようです。
コンパイルせずに swc ファイルの外側から、中身のバージョンを確認する方法は…なさそうですね。
３年近く前の記事ですが、OSMF を調べていたら、通りかかったのでコメントしてみました。
2014.01.04 22:41
こんな古い記事にコメントいただき、ありがとうございます。
なるほど、コンパイル後だと確認できるのですね！
助かりました。