Tag: enchant.js
編集中
enchantjs003
前回はクマの絵をふたつ表示しました。
プログラムでは多くの場合キー入力の処理が必要となります。
enchant.jsのキー入力は、上下左右の矢印キーと、その他は任意のキー2つです。ゲームならば、古いゲーム機の矢印とAボタン、Bボタンという事の様です。
クマ2を矢印キーで上下、左右に移動してみます。
クマ2のフレームの書き換わるイベントにキー入力の判定を追加することが推奨されるようです。
基本は次のような記述となります。
bear2.addEventListener('enterframe', function() {
if (core.input.left) {
// 左矢印が押された時の処理
}
if (core.input.right) {
// 右矢印が押された時の処理
}
if (core.input.up) {
// 上矢印が押された時の処理
}
if (core.input.down) {
// 下矢印が押された時の処理
}
});
今回は、それに、放っておくと徐々に落下するような動きにし、落下速度が速くなります。
また、内部で処理している落下速度の値を画面上に表示する為に、レベルオブジェクトを追加して表示するようにしました。
// オブジェクトを作成し、表示と色を決定しておきます。
var label2 = new Label("infomation");
label2.x = 160;
label2.y = 0;
label2.color = '#00007F';
// 何かのタイミングで現在の落下速度を表示します。
label2.text = 'falling speed:'+fspeed;
スクリプト全体
enchant();
window.onload = function() {
var core = new Core(320, 320);
core.preload('chara1.png');
core.fps = 15;
core.onload = function() {
var fspeed = 0;
var kasoku = 0.05;
var bear = new Sprite(32, 32);
bear.image = core.assets['chara1.png'];
bear.x = 0;
bear.y = 0;
//bear.scale(0.5,0.5);
bear.frame = 1;
var bear2 = new Sprite(32, 32);
bear2.image = core.assets['chara1.png'];
bear2.x = 160;
bear2.y = 0;
//bear2.scale(0.5,0.5);
bear2.frame = 6;
var label1 = new Label("infomation");
label1.x = 0;
label1.y = 0;
label1.color = '#00007F';
var label2 = new Label("infomation");
label2.x = 160;
label2.y = 0;
label2.color = '#00007F';
bear.addEventListener('enterframe', function() {
this.x += 2;
if (this.x > 320) this.x = 0;
this.rotate(2);
//this.scale(1.005, 1.005);
label1.text = 'frame:'+core.frame;
label2.text = 'falling speed:'+fspeed;
if (core.frame>2000) {
core.stop();
}
});
bear2.addEventListener('enterframe', function() {
var keyInputCount=0;
if (core.input.left) {
this.x -= 2;
bear2.frame = 6;
//keyInputCount++;
}
if (core.input.right) {
this.x += 2;
bear2.frame = 7;
//keyInputCount++;
}
if (core.input.up) {
this.y -= 2;
bear2.frame = 5;
fspeed -= kasoku*10;
if (fspeed<0) {
fspeed = 0.0;
}
keyInputCount++;
} else {
fspeed += kasoku;
}
if (core.input.down) {
this.y += 2;
bear2.frame = 8;
keyInputCount++;
}
if (keyInputCount<1) {
//this.y += 1;
this.y += fspeed;
bear2.frame = 8;
}
if (this.y > 320) this.y = 0;
if (this.y < 0) this.y = 320;
if (this.x > 320) this.x = 0;
if (this.x < 0) this.x = 320;
//this.rotate(-2);
//this.scale(1.005, 1.005);
});
core.rootScene.addChild(bear);
core.rootScene.addChild(bear2);
core.rootScene.addChild(label1);
core.rootScene.addChild(label2);
}
core.start();
};
次回は、[z]キーなどで分身でも表示してみましょうか?