flashrod

■ AIRでローカルflvファイルplayerの作り方 21:57

ちょっと必要があってローカルディスクに保存して有るflvファイルを再生するプレイヤーを探していたのだけど、よく考えたらAIRで簡単に作れると思ったので作ってみたら意外と簡単にできたので作り方を書いてみる。

できあがり図はこんなの。

環境は flex 3 SDK βで。

まずはflashなflvプレイヤーを作る

flexでflvプレイヤーを作るのは簡単で、NetConnection のランゲージリファレンスにあるサンプルをそのままコピペすればできる。

Adobe - Error Page

これで NetConnectionExample.as を作って、 mxmlc で swf を作って、webサーバにswfとflvを置けば、ブラウザのflash playerからflvを再生できるswfになる。

mxmlcの使い方などはこの辺で→ActionScript 3.0メモ

flashなのでローカルファイルにあるflvファイルは再生できない。

次にAIR化する

さてこれをAIR化するには、そのサンプルにある、

    stream.play(videoURL);

のvideoURLを、ローカルファイルにすれば良いだけだ。

試しにvideoURL="C:/Documents and Settings/どこ/そこ/a.flv" などとして、amxmlc でビルドして、adlで実行したら、あっさり再生できた。

AIRアプリの作り方はこの辺で→Adobe AIRメモ

ファイル名の受け取り方

ファイル名を指定する方法はいくつかあるけど、ドラッグ&ドロップで受け取るのが簡単そうだ。

デスクトップなどに置いたflvファイルをflv playerにドロップするだけでOKというのが簡単で良い。

ドラッグ&ドロップのやりかたはこの辺で→Adobe AIRメモ

全部は要らない。必要なのはファイルだけなので、TransferableFormats.FILE_LIST_FORMAT の時だけ許可して受け取れば、ドロップした File の配列を受け取れる。

ファイルの拡張子にAIRアプリケーションを関連付けるには、ADF(Application Descriptor File)に以下の記述で(抜粋)。

      <fileTypes>
        <fileType>
          <name>flv file</name>
          <extension>flv</extension>
          <description>flash video file</description>
          <contentType>video/x-flv</contentType>
        </fileType>
      </fileTypes>

アプリケーションアイコンへのドロップで起動した場合の方法はこの辺で→void element blog: AIRのドラッグ＆ドロップ起動について調べてみた

コントロール

プレイヤーとしての機能のためには、こんなのが必要だろう。

• ビデオの長さ(秒数)と幅と高さ(ピクセル数)は、NetConnectionExample にある CustomClient で、再生開始時に得られる
• 現在再生中の先頭からの秒数は NetStream の time プロパティで得られる
• 再生位置を指定するのは NetStream の seek(先頭からの秒数)
• ポーズ/再生のトグルは NetStream の togglePause()

Event.ENTER_FRAME で現在再生中の位置 NetStream.time をビジュアルに描画したり、クリック位置までseekしたり、play/pauseボタンを作ったり、好きなようにUIを作りこめばよい。

ボリューム

ボリューム変更は NetStream の soundTransform プロパティで。ボリュームは値は0(無音)〜1(最大)。

    stream.soundTransform.volume = ボリューム値;

としても変わらないので注意。 SoundTransform インスタンスを設定してやる必要がある。

    stream.soundTransform = new SoundTransform(ボリューム値);

連続再生

せっかくドロップでファイルの配列を受け取れるので、プレイリストを持つようにしたい。一つのflvファイルの再生が終わったら、次のflvファイルを再生するには「再生の終わり」を知る必要がある。「再生の終わり」は、NetStream の、NetStatusEvent.NET_STATUS イベントで、NetStatusEvent.info.code が"NetStream.Play.Stop" の時で良いみたいだ。

これでやってみると、確かに上手くいくのだけど、ときどきうまくいかない。どうしてか分からないけど、flvファイルによって"NetStream.Play.Stop"が来るやつと来ないやつが有るみたいだ。これはちょっと困った。しかたがないので、再生終わりの時にタイムアウトが発生するようにして、"NetStream.Play.Stop"が来ない場合に対応するようにしてみた。

まず Event.ENTER_FRAME イベントハンドラで、NetStream.time を参照して、残り1 秒のときに、3秒のタイムアウトを設定する

        /** 終了チェック用タイマーID */
        private var tid:uint;
        …略
        private function onEnterFrame(e:Event):void {
            if (tid == 0 && stream.time >= (duration - 1)) { // 残り1秒
                tid = setTimeout(timeout, 3000); // 3秒後にtimeoutを実行
            }
            …略

タイムアウトでやる処理はこんなの

        private function timeout():void { 
            tid = 0;
            if (まだ再生中だったら) {
                再生終了時の処理
            }
        }

NetStreamのNetStatusEventハンドラでは、終了イベントが来たときはタイムアウトをキャンセルしておく。

        private function onStreamNetStatus(e:NetStatusEvent):void {
            switch (e.info.code) {
            case "NetStream.Play.Stop":
                if (tid != 0) {
                    clearTimeout(tid);
                    tid = 0;
                }
                再生終了時の処理
            …略

これで手持ちのflvファイルは連続再生できるようになった。

世間に有るflv playerだとどれも過不足があって満足いかない方で、プログラミングの腕に覚えが有って、AIRに興味が有る人は、自作flv playerに挑戦してみてはいかがだろうか。