画像などのデータの一括読み込み【enchant.js】

preload()関数

enchant.jsのデータの読み込みをするpreload()という関数について、ちょっとでも楽になる方法の紹介です。

データの読み込みを本やサイトで調べるとだいたい

core.preload('aaa.png', 'bbb.png');

//使うとき
var sprite = new Sprite(64, 64); 
sprite.image = core.assets['aaa.png'];

core.preload('aaa.png', 'bbb.png');

//使うとき

var sprite = new Sprite(64, 64);

sprite.image = core.assets['aaa.png'];

のように書かれているけど、こうすると後で違うファイル名の画像にしたりするときに結構めんどくさい。

で、このpreload()関数は配列で渡すことができるようなので先に作っておく。JSONで表記しておくとわかりやすい。

var ASSETS = {
    'start':'start.png',
    'title':'title.png',
};

var ASSETS = {

'start':'start.png',

'title':'title.png',

};

読み込みは配列で一括。すごい楽ちん。

core.preload(ASSETS);

1	core.preload(ASSETS);

画像を使う場所で以下のように指定する。

title.image = core.assets['title'];
start.image = core.assets['start'];

1 2	title.image = core.assets['title']; start.image = core.assets['start'];

と、まぁこんな感じでファイル名ではなくキーで指定するからわかりやすいし、ファイル名が変わっても修正は上の配列部分を変えるだけで済むので楽ちん。