FLV動画をシンプルにループ再生させる方法(ActionScript3.0)
2010-12-07
サイト上で動画をCMみたいに延々と流す場合、ループ再生をさせることになりますが、これをFlash Video (.flv)でやる場合にはちょっとした手続きが必要です。
NetConnection + NetStream + Video クラスの組み合わせ
基本的にはクラスが3つ必要になります。
NetConnectionクラス
動画ファイルとFlashを繋げる役目を果たすクラスです。 通常の動画の場合にも利用するし、ストリーミングサーバーとのリアルタイム放送などでも活躍します。 例えると水を流すパイプみたいなもの。
NetStreamクラス
NetConnectionクラスで作ったパイプの中を流すデータをコントロールするクラス。 栓を閉めてデータが流れないようにしたり(停止)、栓を開けて流れるようにしたり(再生)します。
再生の終わりを確認したり、再生させたりという仕事はこのNetStreamクラスが担います。
Videoクラス
流れてきた映像データを実際に画面に映し出すクラス。 幅や高さ、位置を決めて表示したりします。
え? 全然シンプルそうじゃない? すみません、、ここで言う「シンプル」というのは余計な物がゴテゴテ付いていないという意味で考えてもらえればと思います。
映写装置(動画再生)を組み立てる手順
1.パイプ(NetConnection)を作る
まずはNetConnectionクラスをインスタンス化して、connect(null) で通常のパイプにします。 ストリーミングサーバーと繋ぐわけではないので「null」で良いのです。
var nc:NetConnection = new NetConnection(); nc.connect(null);
2.パイプ(NetConnection)に制御装置(NetStream)をくっつける
次にNetStreamクラスをインスタンス化し、パイプ(NetConnection)にくっつけて、状況を監視できるようにイベントをキャッチできるようにします。
ちょこっと難解なのは、イベントリスナー関数内のIF文で「動画再生が終わった」というお知らせをキャッチして「じゃ、また再生ね」と命令しているところぐらいでしょうか。
//動画再生 function playMovie():void { ns.play("myMovie.flv"); } /動画の状態チェック function checkMovie(evt:NetStatusEvent):void { if (evt.info.code == "NetStream.Play.Stop") { this.playMovie(); } } var ns:NetStream = new NetStream(nc); ns.addEventListener(NetStatusEvent.NET_STATUS, checkMovie); ns.client = new Object();
3.制御装置(NetStream)の先っぽに投影装置(Video)をくっつける
最後の設定は、制御装置と投影装置をくっつける作業です。 これで組み立て完了です。
var vid:Video = new Video(); vid.attachNetStream(ns); this.addChild(vid);
まとめ
まとめるとこんな感じですね。 スキンを使ってもできるみたいですが、シンプルにこれだけでもループ再生は可能です。
//動画再生 function playMovie():void { ns.play("myMovie.flv"); } //動画の状態チェック function checkMovie(evt:NetStatusEvent):void { if (evt.info.code == "NetStream.Play.Stop") { this.playMovie(); } } var nc:NetConnection = new NetConnection(); nc.connect(null); var ns:NetStream = new NetStream(nc); ns.addEventListener(NetStatusEvent.NET_STATUS, checkMovie); ns.client = new Object(); var vid:Video = new Video(); vid.attachNetStream(ns); this.addChild(vid); //1回目の再生。 this.playMovie();
それでは、快適なループ再生ライフを!
2010-12-07