[目次]
キー入出力に反応しよう | Webプログラミング!
矢印キー入力のサンプル
矢印キー入力のサンプルinput1.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<title>Test of Enchant.js</title>
<style type="text/css">
body { margin: 0; }
</style>
<script type="text/javascript" src="enchant.js"></script>
<script type="text/javascript" src="plugins/ui.enchant.js"></script>
<script type="text/javascript" src="input1.js"></script>
</head>
<body>
</body>
</html>
input1.js
enchant();
window.onload = function() {
var game = new Game(320,320);
game.fps = 16;
game.preload('chara1.png');
game.onload = function() {
var bear = new Sprite(32,32);
bear.image = game.assets['chara1.png'];
game.rootScene.addChild(bear);
bear.frame = 7;
var d=2;
var s=2;
bear.moveTo(30,50);
bear.addEventListener(Event.ENTER_FRAME,
function() {
var input=game.input;
if( input.left ){
this.moveBy(-d,0);
} else if ( input.right ){
this.moveBy(+d,0);
} else if ( input.up ){
this.moveBy(0,-d);
} else if ( input.down ){
this.moveBy(0,+d);
} else if ( input.a ){
this.scaleX*=2;
} else if ( input.b ){
this.scaleX*=-1;
}
}
);
};
game.start();
};
キーバインド, パッド入力のサンプル
キーバインド, パッド入力のサンプルinput2.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<title>Test of Enchant.js</title>
<style type="text/css">
body { margin: 0; }
</style>
<script type="text/javascript" src="enchant.js"></script>
<script type="text/javascript" src="plugins/ui.enchant.js"></script>
<script type="text/javascript" src="input2.js"></script>
</head>
<body>
</body>
</html>
input2.js
enchant();
window.onload = function() {
var game = new Game(320,320);
game.fps = 16;
game.preload('chara1.png');
game.onload = function() {
var bear = new Sprite(32,32);
bear.image = game.assets['chara1.png'];
game.rootScene.addChild(bear);
bear.frame = 7;
var d=2;
var s=2;
game.keybind('X'.charCodeAt(0),'a');
game.keybind('Y'.charCodeAt(0),'b');
game.keybind('D'.charCodeAt(0),'right');
var pad = new Pad();
pad.moveTo(0,200);
game.rootScene.addChild(pad);
// bear.x=30;
// bear.y=50;
bear.moveTo(30,50);
bear.addEventListener(Event.ENTER_FRAME,
function() {
var input=game.input;
if( input.left ){
this.moveBy(-d,0);
} else if ( input.right ){
this.moveBy(+d,0);
} else if ( input.up ){
this.moveBy(0,-d);
} else if ( input.down ){
this.moveBy(0,+d);
} else if ( input.a ){
this.scaleX*=2;
} else if ( input.b ){
this.scaleX*=-1;
}
}
);
};
game.start();
};
アナログパッドのサンプル
アナログパッドのサンプルinput3.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<title>Test of Enchant.js</title>
<style type="text/css">
body { margin: 0; }
</style>
<script type="text/javascript" src="enchant.js"></script>
<script type="text/javascript" src="plugins/ui.enchant.js"></script>
<script type="text/javascript" src="input3.js"></script>
</head>
<body>
</body>
</html>
input3.js
enchant();
window.onload = function() {
var game = new Game(320,320);
game.fps = 16;
game.preload('chara1.png');
game.onload = function() {
var bear = new Sprite(32,32);
bear.image = game.assets['chara1.png'];
game.rootScene.addChild(bear);
bear.frame = 7;
var ap = new APad();
ap.moveTo(0,200);
game.rootScene.addChild(ap);
bear.moveTo(30,50);
bear.addEventListener(Event.ENTER_FRAME,
function() {
this.moveBy(ap.vx,ap.vy);
}
);
};
game.start();
};