AS3(swf)で外部の画像ファイルを読み込み


iyamaです。

今日は何を書こうか、悩みすぎました。
そういう日あるよね。

さて、今日はAS3です。
SWFから、外部の画像ファイルを読み込みましょう。


　
早速サンプル。後でじっくり解説します。

■環境
AS3
Flash CS3またはCS5で確認済み

■Main.as


package {
    import flash.display.Loader;
    import flash.display.Sprite;
    import flash.events.Event;
    import flash.events.IOErrorEvent;
    import flash.net.URLLoader;
    import flash.net.URLLoaderDataFormat;
    import flash.net.URLRequest;

    public class Main extends Sprite {
        private var imageUrl:String = "image.png";
        private var imageSpace:Sprite;
        private var imageLoader:URLLoader;

        public function Main():void {
            imageSpace = new Sprite();
            imageSpace.graphics.beginFill(0xffffff);
            imageSpace.graphics.drawRect(0, 0, 320, 240);
            imageSpace.graphics.endFill();
            addChild(imageSpace);

            imageLoader = new URLLoader();
            imageLoader.dataFormat = URLLoaderDataFormat.BINARY;
            imageLoader.addEventListener(Event.COMPLETE, imageLoaderComplete);
            imageLoader.addEventListener(IOErrorEvent.IO_ERROR, onIOErrorEventHandler);
            imageLoader.load(new URLRequest(imageUrl));
        }
        
        /**
         * imageLoaderComplete
         * @param    event
         */
        private function imageLoaderComplete(event:Event):void {
                loader = new Loader();
                loader.x = 320;
                loader.y = 240;
                loader.loadBytes(event.target.data);
                imageSpace.addChild(loader);
                
                imageLoader.close();
                imageLoader.removeEventListener(Event.COMPLETE, imageLoaderComplete);
                imageLoader.removeEventListener(IOErrorEvent.IO_ERROR, onIOErrorEventHandler);
        }
        
        /**
         * onIOErrorEventHandler
         * @param    event
         */
        private function onIOErrorEventHandler(event:IOErrorEvent):void {
                trace("IOError : " + event.toString());
        }
    }
}

　

■解説

全体の流れとしては空白のSpriteを作成し、その上に外部の画像をURLLoaderで読み込みます。

16行目〜20行目で空白のSpriteを作成。
厳密に言うと、白い四角を作っています。
drawRect(x, y, width, height)で四角に塗りつぶし。
　

22行目から画像の読み込みです。
画像ファイルなので読み込みフォーマットをBINARYに指定します。
imageLoader.loadのところで読み込み(httpのダウンロード)開始。
読み込み完了は24行目のEventListenerで完了イベントを受け取ります。
　

画像の読み込み完了後はloaderでデータをキャッチし、
最初に作ったSpriteにaddして完了。
読み込み画像のリサイズとかはここのloaderで操作します。
他の方法で画像を簡易的に行うとリサイズとかの処理は効きません。
なので、こんなまどろっこしい方法でファイルを読み込んでいます。
40行目からは終了処理。
ガベージコレクションのためにcloseとremoveEventListenerをお忘れなく！
　

エラーの受け取りはIOErrorEventでキャッチします。
指定した画像のURLがリンク切れとかだと、IOErrorEventHandlerが実行されるので、
代替え処理なんかをここに記しましょう。
今はエラー内容をデバッグ表示するだけ。
　

うむ。今日はこれで終わりー。

return top