tmlibの練習ブログ

自分流にtmlibを触っていきます。分かったことを解説。入門用になれば…?

デフォルトを改造

デフォルトのmain.jsをいじる14,関数の外にデータを持ち出す(return)

前回の続き。変数のスコープの関係上、関数内で使われた数値を外に持ち出すためには、一工夫がいる。 (もちろんグローバル変数を使っても持ち出せるが、関数のたび作っていては不便) returnというものが用意されている。 具体的には this.star.scale_sp_widt…

デフォルトのmain.jsをいじる13,既存クラス(オブジェクト)に関数追加

前回では関数の引数を知った。 [Documents]で見ると分かるように、tmlibに用意されたクラスにはたくさんの関数が、要素として登録されている。 そしてそこに、新しく関数を作る事もできる。 と言っても難しい話ではない。既存のクラスに新しく変数を作って、…

デフォルトのmain.jsをいじる12,関数の引数について。

前回に続き、関数の発展的な事を学ぶ。 関数には、引数(ひきすう)というものを渡せる。 aaa = function(mozi){alert(mozi);} // #引数をmoziとして受けとる。 aaa("アラートだよ"); // #引数を渡す 関数の実行を表わす( )の中に、渡したいデータを書く(変数…

デフォルトのmain.jsをいじる11,関数(function)って?

前回では、キャラの拡大を反映した当たり判定を書いた。 だがいまいちスマートではなく、もっと短くできないだろうか…と。 その為にまず、"関数"というものを理解する必要がある。 関数とは、functionが頭に付き、{ }の間に、行う処理をずらっと書いたモノ。…

デフォルトのmain.jsをいじる10,当たり判定に拡大を反映

前回、Zキーで拡大、当たり判定の処理…と作ってきて、一つ気になる事ができた。 "いくら拡大しても、当たり判定は変化しない"のだ。 試しに、 if (key.getKey("c")) { alert(this.star.width);} という形でチェックしてみても、拡大前と拡大後で、width=横…

デフォルトのmain.jsをいじる9,当たり判定で効果音とスコア加算

前回までで、当たり判定により消滅するようになった。 そこで今度は、.enemyを消した時に"ドカ"という効果音を鳴らすようにしたい。 http://testcording.com/?p=1367 このサイトが詳しいけど、要は tm.preload(function() { tm.sound.SoundManager.add("hit_…

デフォルトのmain.jsをいじる8,当たり判定で敵消滅+Documentsの見方。

前回、console.logで当たり判定を確かめたところを、一気にゲームぽくしよう。 まず、[Documents]でStarShapeの項目を探すと、"消滅フラグ"―visibleというのを見つけられる。 これを使えば"ヒットした時に消滅"という事も簡単にできる。 …しかしここでちょっ…

デフォルトのmain.jsをいじる7,当たり判定追加

前回から更にゲームぽく、"当たり判定"の処理を追加してみようと思う。 細かく複雑に動き回る敵を…と夢が膨らみがちだけど、まず最小限、".starが何かに触れた時に、alertを出す"からやるのが現実的だ。 単純に考えて、.starと同じ感じで、addChildで付け加…

デフォルトのmain.jsをいじる6,タイトルシーンに絵、キー対応追加

今回は前回で追加したTitleSceneに、タイトル画像とマウスではなくキーで進む、という改造をしてみる。 まずはタイトル画像から。 他にTitleSceneを説明してるサイトも余り見つからない…ので、前々回と同じくTitleSceneの、tmlibの元のソースコードを確認し…

デフォルトのmain.jsをいじる5,タイトル画面追加

今回はゲームに付きものの、"タイトル画面"を設けたいと思う。 前回でシーンというもの(の内側)を意識した。 タイトル画面は"TitleScene"として、ある程度の処理が既に用意されている。それを使うのだ。 http://testcording.com/?p=1748 …と言っても、このサ…

デフォルトのmain.jsをいじる4,シーンを使わずに画像表示してみる

デフォルトのmain.jsをいじる3,画像を読み込んでみる。 - tmlibの練習ブログで"なんでシーンなんて面倒臭い区切りをするのか"、"なぜLoadingScene"+ASSETSでないと画像を表示できないのか? と疑問に思わなかっただろうか。 試しにASSETSを直接読み込んでみ…

デフォルトのmain.jsをいじる3,画像を読み込んでみる。

前回:デフォルトのmain.jsをいじる2,拡大縮小のプロパティ(要素)を探す - tmlibの練習ブログ まででキー受付で、アクションを起こせるようになった。 ここまで来たら、いつまでも星のままでは寂しい。 自分で作った色々な画像を使ってみたい。 という訳で…

デフォルトのmain.jsをいじる2,拡大縮小のプロパティ(要素)を探す

前回:デフォルトのmain.jsをいじる1,キー入力可能に - tmlibの練習ブログ までで、キー入力は可能になった。しかし拡大縮小を行うにはどうすればいいのだろう。 main.jsをよく観察してみると、星を回転させているとおぼしき所は // クリック or タッチ中は…

デフォルトのmain.jsをいじる1,キー入力可能に

まず公式(http://phi-jp.github.io/tmlib.js/)から落として、 index.htmlをテキストエディターで開くと <script src="lib/tmlib.js"></script> <script src="http://dat-gui.googlecode.com/git/build/dat.gui.js"></script> <script src="https://raw.github.com/mrdoob/stats.js/master/src/Stats.js"></script> <script src="main.js"></script> と…