アンケートご協力のお願いgihyo.jpでは,2010年度に向けて豪華プレゼントが当たる読者属性アンケートを実施しております。ご協力ください。

gihyo.jp » DEVELOPER STAGE » 連載 » ActionScript 3.0で始めるオブジェクト指向スクリプティング » 第25回 サウンドと画像の外部読込み

ActionScript 3.0で始めるオブジェクト指向スクリプティング

第25回 サウンドと画像の外部読込み

これからしばらくは,小ネタをいくつか紹介していく。今回は,外部ファイルのロードだ。

Flashムービーで使われるサウンドやMovieClipシンボル,画像,テキストデータといった素材は,必ずしもFLAファイルにすべて入れておかなければならない訳ではない。それらを外部ファイルにしてあとから読込むようにすれば,起動するためのSWFファイルはサイズを小さくできる。また,ユーザーが素材のすべてを視聴しない場合には,無駄なロードが避けられる。

外部MP3サウンドの再生

MP3形式のサウンドは,外部ファイルから読込んで再生できる。SoundクラスのSound.load()メソッドで指定されたURLのMP3ファイルをロードし,Sound.play()メソッドによりサウンドの再生を開始する。

Soundクラスで外部MP3ファイルをロードして再生する手順

var 変数:Sound = new Sound();
変数.load(URLRequestインスタンス);
変数.play();

Sound.load()メソッドには,再生するMP3ファイルのURLを,URLRequestインスタンスで指定する必要がある。URLRequestクラスのコンストラクタには,引数としてURLを文字列で渡す。

URLRequestインスタンスの生成

var 変数::URLRequest = new URLRequest(URLを示す文字列);

そうすると,SWFファイルが埋込まれたHTMLドキュメントと同じ場所にあるMP3サウンドファイル"sound.mp3"をロードして再生するには(※1),つぎのスクリプト1をフレームアクションとして記述すればよい(図1)。

スクリプト1 外部MP3サウンドファイルをロードして再生する

// フレームアクション
var _sound:Sound = new Sound();
var myRequest:URLRequest = new URLRequest("sound.mp3");
_sound.load(myRequest);
var myChannel:SoundChannel = _sound.play();

なお,Sound.play()メソッドはSoundChannelインスタンスを返す。SoundChannelインスタンスは,再生しているサウンドの停止やボリュームなどのコントロールをするときに参照する。よって,後で必要になる場合に備え,変数に取っておくのがよい。

図1 外部MP3サウンドをロードして再生するフレームアクション

図1 外部MP3サウンドをロードして再生するフレームアクション

SWF(およびHTMLドキュメント)と同階層にMP3ファイル"sound.mp3"を配置して,[ムービープレビュー](または[パブリッシュプレビュー])すると外部MP3サウンドが再生される。

※1

外部ファイルの相対URLを指定するとき,パスの起点はデフォルトではSWFでなく,そのSWFの埋込まれたHTMLドキュメントになる。

たとえば,以下の図2のファイル構成では,SWFとMP3ファイルは同じフォルダ内にある。しかし,SWFを埋込んだHTMLファイルはフォルダと同階層だ。したがって,MP3ファイルのURLを示す文字列は,つぎのように記述しなければならない。

"assets/sound.mp3"

図2 相対URLの起点はSWFが埋込まれたHTMLドキュメント

図2 相対URLの起点はSWFが埋込まれたHTMLドキュメント

外部JPEG画像の配置

外部保存したJPEGやPNG,GIF形式などの画像ファイルやSWFファイルを読込むには,LoaderクラスのLoader.load()メソッドを用いる。基本的な手順は,Soundクラスでサウンドをロードする場合と同だ。ただし,タイムラインに表示するためには,もちろんDisplayObjectContainer.addChild()メソッドで表示リストに加えなければならない。

同じ階層(前述※1参照)にあるJPEGファイル"PenBitmap.jpg"をLoaderインスタンスに読込んで,タイムラインに配置するには,つぎのようなフレームアクションを記述する(スクリプト2)。

スクリプト2 Loaderクラスで外部JPEG画像ファイルをロードして配置する

// フレームアクション
var myLoader:Loader = new Loader();
var myRequest:URLRequest = new URLRequest("PenBitmap.jpg");
addChild(myLoader);
myLoader.load(myRequest);

上記スクリプト2からわかるように,処理はSoundクラスで外部MP3サウンドを読込むときと変わらない。ロードするファイルの形式がPNGや GIF,あるいはSWFの場合も,ただURLRequest()コンストラクタに渡すURLを書替えるだけでよい。[ムービープレビュー]を試すと,外部 JPEGファイルが読込まれて,タイムラインに配置される(図3)。

図3 タイムラインに配置された外部JPEG画像

図3 タイムラインに配置された外部JPEG画像

問題は,読込んだコンテンツに手を加えようとする場合だ。たとえば,画像の幅をステージ一杯に拡げようとして,上記スクリプト2につぎのステートメントを加えたとする。すると,なんということでしょう!画像がまったく表示されなくなってしまうのだ(図4)。

myLoader.width = stage.stageWidth;

図4 Loaderインスタンスの幅を変えるステートメントが追加されると……

図4 Loaderインスタンスの幅を変えるステートメントが追加されると……(1)

図4 Loaderインスタンスの幅を変えるステートメントが追加されると……(2)

その理由は,外部ファイルの読込み待ちをしていないためだ(※2)。電話は番号をかけてすぐにしゃべり始めては,相手には通じない。呼出し音が鳴り終わって,相手が出たことを確かめなければならない。読込んだ外部ファイルのコンテンツにアクセスするときも,これと同じことが求められるのだ。その処理については,次回に解説しよう。

※2
詳しく説明すると,コンテンツを読込む前のLoaderインスタンスのサイズは0×0ピクセルと認識される。それを0以外に設定することはできず,またLoader.widthまたはLoader.heightプロパティにどのような値を代入しても0に設定されてしまう。したがって,画像がロードされても幅は0なので表示されなくなる。

著者プロフィール

野中文雄(のなかふみお)

ソフトウェアトレーナー,テクニカルライター,オーサリングエンジニア。上智大学法学部卒,慶応義塾大学大学院経営管理研究科修士課程修了(MBA)。独立系パソコン販売会社で,総務・人事,企画,外資系企業担当営業などに携わる。その後,マルチメディアコンテンツ制作会社に転職。ソフトウェアトレーニング,コンテンツ制作などの業務を担当する。2001年11月に独立。Web制作者に向けた情報発信プロジェクトF-siteにも参加する。株式会社ロクナナ取締役(非常勤)。

URLhttp://www.FumioNonaka.com/

著書

  • ActionScript 3.0プロフェッショナルガイド

    ActionScript 3.0プロフェッショナルガイド(毎日コミュニケーションズ)

  • ActionScript 3.0辞典 [FlashPlayer 10/9対応]

    ActionScript 3.0辞典 [FlashPlayer 10/9対応](翔泳社)

コメント

コメントの記入

パスサポ

多数の情報処理技術者試験対策書籍の発行実績を誇る技術評論社がお届けする,資格試験合格サイト「めざせ! 情報処理試験 パスサポ」が開設されました。

ピックアップ

サクセスストーリーに続く,快適サーバー運用管理のヒント!

データの増大,煩雑な管理,システムダウン,セキュリティなど,迫りくる課題からシステム管理者の負担を軽くするポイントを解説します。

gihyo.jp インフラエンジニア情報局

ネットワークやITにかかわるあらゆる業種で必要とされるインフラエンジニアに向けた技術情報や心構え,その魅力について多角的に紹介。

テストエンジニア ステーション

いま,ITに関わるあらゆる開発業務で注目されつつあるテスト系エンジニアをターゲットにしたコンテンツサイトを展開します。

一行クイックアンケート

gihyo.jpで取り上げてほしいネタは?

※検索はページ右上の検索ボックスをご利用ください。

その他の連載

読むウェブ ~本とインタラクション

ディスプレイで読む活字とそのインタラクション(interaction:相互作用)について,最新Webを紹介しながら読み解いていく。

いま,見ておきたいウェブサイト

この連載では,国内外の最新のウェブサイトを隔週更新で取り上げ,これら最新サイトの特徴や素晴らしい部分を,さまざまな角度から解説していきます。

Windows phoneアプリケーション開発入門

Windows Marcketplace for Mobileがサービス開始され,作成したアプリケーションを個人でも世界をターゲットに公開できる環境が整ってきました。これを機にWindows phoneアプリケーションの開発をしてみませんか?

ここは知っておくべき!Windows Server 2008技術TIPS

5年ぶりのサーバOSとなったWindows Server 2008が出荷されて早2年。2009年にはR2が出荷され,再び注目を集めています。発売前から実施したトレーニングによって感じた,インフラエンジニアの方々に知っておいていただきたい機能を中心にご紹介します。

キーパーソンが見るWeb業界

本連載はWeb Site Expert/gihyo.jpとの連動企画です。阿部淳也, 長谷川敦士, 森田雄のお三方による,Web業界をテーマにした座談会です。

きたみりゅうじの聞かせて珍プレー

ソフトウェア開発の現場で体験したトホホな失敗,思わずうなる珍プレーをきたみりゅうじ氏が四コママンガで紹介。みなさんからの投稿もお待ちしてます!

ActionScript 3.0で始めるオブジェクト指向スクリプティング

野中文雄氏が,簡単なスクリプトは書いたことがあるという初級者を対象に,ActionScript 3.0の基本からクラス定義までを解説します。

まだ間に合う「ITパスポート」受験対策 原山先生の短期合格塾

この連載では,4月18日のITパスポート試験の受験に向けて,短い期間で効率良く受験対策を行う方法や,確実に得点するための裏ワザなどを伝授していきます。

連載一覧

gihyo.jp

  • DEVELOPER STAGE
  • ADMINISTRATOR STAGE
  • WEB+DESIGN STAGE
  • LIFESTYLE STAGE
  • SCIENCE STAGE
  • NEWS & REPORT

書籍案内

  • 新刊書籍
  • 書籍ジャンル一覧
  • 書籍シリーズ一覧
  • 新刊ピックアップ
  • ロングセラー
  • 電脳会議

定期刊行物一覧

  • Software Design
  • WEB+DB PRESS
  • Web Site Expert
  • 組込みプレス