2/21 画像ファイルの読み込み

今までの復習をかねて、今後実践でも使うことができると思われるXML,XPath,外部からのファイルの呼び出しを中心に勉強をしています。

外部の画像ファイルの呼び出し。

外部の画像ファイルを表示するためコードです。

[cc lang="actionscript"] package { import flash.display.Sprite; import flash.display.Loader; import flash.net.URLRequest;

public class newLoader extends Sprite
{
    var urlList:Array = new Array();
    var loaderList:Array = new Array();

    public function newLoader() {
        urlList[0] = "image/IMG_1761.jpg";
        urlList[1] = "image/IMG_1770.jpg";
        urlList[2] = "image/IMG_1779.jpg";

        for (var i = 0; i < urlList.length; i++) {
            var x:int;
            loaderList[i] = new Loader();
            addChild(loaderList[i]);
            loaderList[i].load(new URLRequest(urlList[i]));
            loaderList[i].x = i*150;
            loaderList[i].y = i*50;
            loaderList[i].scaleX =0.1;
            loaderList[i].scaleY =0.1;
        }
    }
}

} [/cc]

[cc lang="actionscript"] package{

import flash.display.Sprite;
import flash.display.Loader;
import flash.net.URLRequest;

public class imgLoader extends Sprite{

    var imgloader:Loader = new Loader;

    public function  imgLoader(){
         addChild(imgloader);
        imgloader.load(new URLRequest("image/IMG_1790.jpg"));


    }
}

} [/cc]

外部からXMLデータを取得

[cc lang="actionscript"] package{

import flash.display.Sprite;
import flash.net.URLRequest;
import flash.net.URLLoader;
import flash.events.Event;

public class imgLoader extends Sprite{

    var pathxml:String = "test.xml";
    var url_loader:URLLoader;

    var name_list:Array = new Array();
    var path_list:Array = new Array();


    public function  imgLoader(){

         url_loader = new URLLoader(new URLRequest(pathxml));

         url_loader.addEventListener(Event.COMPLETE,onload);


    }

     public function onload(event:Event):void{

        var xml:XML = new XML(url_loader.data);

        for each(var xmlObj:Object in xml.img){

            name_list.push(xmlObj.text());
            path_list.push(xmlObj.@src);
        }

        for(var i:int =0 ; i < name_list.length;i++){

            trace(name_list[i]);
            trace(path_list[i]);
        }
    }
}

}

[/cc]

サムネイルとは、多数の画像を一覧表示するために縮小された画像。 [cc lang="actionscript"] for(var i:uint = 0; i< img_list.length;i++){

thum.push(new Sprite());
var thumLoader:Loader = new Loader();

　　順番に画像をSpriteオブジェクトに入れている。 thumLoader.load(new URLRequest(thum_list[i])); thum[i].addChild(thumLoader); thum[i].name = String(i); thumLoader.contentLoaderInfo.addEventListener(Event.COMPLETE,onthumImgLoadComp); } [/cc] •　サムネイルの中にSpriteオブジェクトを作成します。　スプライトは、表示するイメージと表示する位置をもつオブジェクトです。 •　このSpriteオブジェクトの中に、xmlから取り出したjpgのイメージを当てはめます。 •　contentLoaderInfo.addEventListenerについては高記載があります。外部イメージ（SWFも含む）の読み込み完了したことを知るためには、contentLoaderInfo プロパティの complete イベントを監視すればよい。ロードされたデータのダウンロードが完了された場合に送出されるイベントです。

[cc lang="actionscript"] function onthumImgLoadComp(event:Event):void{

        var imgNum:int = int(event.target.loader.parent.name);

        event.target.loader.x = (event.target.width + _thumInterval)*(imgNum % _thumNum);
        event.target.loader.y = (event.target.height + _thumInterval)*(int(imgNum / _thumNum));
        thumContainer.addChild(event.target.loader);

        event.target.loader.name = imgNum;
        event.target.loader.addEventListener(MouseEvent.CLICK,onClick);
    }

[/cc] 読み込んだ画像の処理を記載されています。とりだした画像を画面にどう貼付けるかが載ってます。

(event.target.width + thumInterval)*(imgNum % thumNum); 画像の幅に画像間の間隔を足したものに画像の番号を画像を並べる数の剰余をかけている。「x ％　y」は x を y で割った余りを表す。

[cc lang="actionscript"] function imgloadComp(event:Event):void{

while(imgContainer.numChildren > 0){

imgContainer.removeChildAt(0);
}

imgContainer.addChild(event.target.loader); } [/cc] numChildren 指定したオブジェクト内にいくつのオブジェクトを保有しているかを調べるプロパティです。

removeChildAt(0); 任意の階層にあるオブジェクトを削除する場合に利用されます。今回はクリックするごとに画像がかわるので、削除する画像を直接指定するのではなくインデックス（階層０）を指定している。これでimgContainer の任意の画像を削除している。