デフォルトのmain.jsをいじる４,シーンを使わずに画像表示してみる
デフォルトのmain.jsをいじる３,画像を読み込んでみる。 - tmlibの練習ブログで"なんでシーンなんて面倒臭い区切りをするのか"、"なぜLoadingScene"＋ASSETSでないと画像を表示できないのか? と疑問に思わなかっただろうか。
試しにASSETSを直接読み込んでみても…
this.star = tm.app.Sprite(ASSETS.bigChick);
エラーになって、止まってしまう。
ASSETSにアクセスできない訳ではない。
その前行でconsole.log(ASSETS.bigChick); とすれば、しっかり指定したアドレスが入ってる事が分かる。(ループ内など、alert()では確認しづらい場合 - tmlibの練習ブログ)
…つまり、ASSETSが"LoadingScene"を"くぐる"時に、何か特別な、アドレスを画像として取り扱える変換処理をしている…?
さっそく確かめてみよう。
公式の[documents]からLoadingSceneを探し、そのまま"tm.app.LoadingScene"というタイトルをクリック(あるいは"FILES"のscene.jsという所をクリック)
ローディングシーンという注釈が見える、難しいコードで一杯の所が開かれたと思う。
これがtmlibの"元"である。もちろんローディングシーンがしている事も、全て書いてある。
(できればこんな難しいコードを確認したくないが、調べても出て来ない時の最終手段としてはありだ…)
難しいが、"now loading"という文字表示、ひよこが回る処理…を省くと、あとは画像を読み込む部分だけである。
その中で一番それっぽいのが
tm.asset.AssetManager.load(param.assets);
この一文。loadと書いてあるし、大文字小文字の差はあるが、'assets'としてあるし。
以上で"やっぱりASSETS(のアドレス)を画像にしてるんだな"と分かるが、せっかくなので、画像表示まですると
//この２行が追加
tm.asset.AssetManager.load(ASSETS);
img = tm.asset.AssetManager.get("bigChick");
this.star = tm.app.Sprite(img); //ここが変わるこうなる。ちなみにASSETSを使わない事も可能で、その場合はloadの部分がこうなる。
tm.asset.AssetManager.load("bigChick" , "neko.png");つまりASSETSは{画像名：ファイル名}と設定していたけど、それぞれ指定してもいいと。
(結局ASSETSも中で分解されるものと思われる)
こうした処理をいちいち書いていては面倒なので、既に用意されたシーンという機構を使う訳だ。
(＊ちなみにこの書き方だと、表示されたり、されなかったりする…
たぶん直前に読み込み開始で、まだ終わってないのにgetしようとするから。
それより前、tm.main(function() {の中にloadの部分を置くと、ほぼ成功。こういう事を意識しなくても済むだけ、シーンは大事…)
むしろネズミ…
ちなみに"Loaing"中のヒヨコもLoadingSceneで書かれているので、libを開いてtmlib.jsの該当部分をいじる("ひよこさん"とかでテキスト検索するとその辺りに飛べる)と、ヒヨコを巨大化できたりもする(いじったら戻そう)
ここまでのコード(main.js)
http://spchinese.s601.xrea.com/tmlib_text/main_2013_11_11.txt
＊バージョンは、tmlib.js 0.2.0で作成。
