Flashで作るMP3プレーヤーの基礎

2008年6月12日(木)
吉田 光利

インターフェースを作る

 それでは、いよいよこのインターフェース(図3)にActionScriptを実装します。実際のコードはこちらsimpleRadio.flaの1フレーム目に書かれていますので、こちらからファイル一式をダウンロード(http://www.thinkit.co.jp/images/article/85/2/8521.zip)して、そちらを参照してください(8521.zip/502 KB)。ここでは、特徴的なコードのみを解説します。それでは今回作成するsimpleRadio.flaのActionScriptを解説しましょう。

ループ再生のためのコード解説

 まず、最初にこのActionScriptで使用する変数の定義をします。リスト1は、前のページで説明した、サウンド関連を扱うために使うものたちです。

 次に読み込む曲を配列で用意します。この配列の中には読み込むファイルのパスが書いてあります。これを順番に読み込んで再生するわけです。そして、次回で行うRuby on Railsとの連携ではこの部分を動的に書き換えることになります。

var songs:Array = ["mp3/song1.mp3","mp3/song2.mp3"];

 曲順を管理するための変数です。再生が終わるたびにこの番号を上げていって、新しい曲を再生するようにしています。

var songNum:Number = 0;

 以上で曲を連続再生させるための変数定義は完了です。次は、それを再生するメソッドと連続再生するためのメソッドについて解説します。

 playSong();は曲を再生するメソッドです。基本的には上で定義した変数に実際の値をセットして、それらをインスタンス化しています。下の3行で曲は再生します。配列の中から任意の曲をとってきて、そこからサウンドを作ります。そして、それを再生させて、戻り値(SoundChannel)を変数scにセットしてます。なぜこんなことをするかというと、曲を再生した後のコントロールはSoundChannelで行うためです。

soundURL = new URLRequest(songs[songNum]);
s = new Sound(soundURL);
sc = s.play();

 曲の再生が終わったら、次の曲を再生するためにイベントリスナーを設定します。これはActionScript 3.0から加わったメソッドなのですが、非常に便利ですね。曲の終わりを感知してくれて、終わり次第曲順を上げるためのメソッドに飛ぶように書きます。これはSoundのインスタンスをリッスンするのではなく、SoundChanelのインスタンスをリッスンするので注意してください。

sc.addEventListener(Event.SOUND_COMPLETE, nextSong);

 nextSong()メソッドは曲順を上げるメソッドです。曲数(配列の中身の個数)を取得して、それ以内でループするように条件分岐しています。変数SongNumberのカウントを上げて、playSong()メソッドで、次の曲に飛ばしています(リスト2)。

 以上が基本的な音楽の連続再生についての紹介になります。

 今回は音楽を連続再生するところまではできました。次回は、これをインタラクティブに操作するためのインターフェースを実装します。「停止ボタン」「再生ボタン」を切り替えて使用できるトグルボタンの作り方や、XMLの読み込み方法、再生時間の取得方法などを解説します。けっこう本格的なラジオが完成するので、お楽しみに!

BRIANS PET TOKYO主催者 WebデザインからRuby on RailsでのWebアプリ構築までをトータルに行うWebコンテンツデザイナ。現在はBRIANS PET TOKYOにてWebアプリケーション「DORIBAR(ドリバー) 」を開発中 http://brianspet.com

Think ITメルマガ会員登録受付中

Think ITでは、技術情報が詰まったメールマガジン「Think IT Weekly」の配信サービスを提供しています。メルマガ会員登録を済ませれば、メルマガだけでなく、さまざまな限定特典を入手できるようになります。

Think ITメルマガ会員のサービス内容を見る

他にもこの記事が読まれています