JavaScript_enchantjsについて
enchant.jsとは
HTML5 + JavaScriptで動作するゲーム開発フレームワークです。
enchant.js サンプル
反射するボール
192x192の透過画像（icon.png）を用意します。
folder
│ bg.jpg
│ icon.png
│ index.html
│ main.js
│
└─build
│ enchant.js
│
└─plugins
index.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">
<script type="text/javascript" src="./build/enchant.js"></script>
<script type="text/javascript" src="main.js"></script>
<style type="text/css">
body {
margin: 0;
padding: 0;
background-image: url("./bg.jpg");
background-color: #000000;
}
</style>
</head>
<body>
</body>
</html>
main.js
enchant();
var game;
window.onload = function () {
game = new Game(1363, 656);
game.fps = 30;
game.preload('icon.png');
game.onload = function () {
var canvasGroup = new Group();
game.rootScene.addChild(canvasGroup);
function addBall () {
var ball = new Sprite(192, 192);
ball.image = game.assets['icon.png'];
canvasGroup.addChild(ball);
ball.frame = 5;
ball.vx = 3;
ball.vy = 2;
ball.vs = 0.01;
ball.onenterframe = function(){
this.x += this.vx;
this.y += this.vy;
if(this.x > 1171 || this.x < 0){
this.vx *= -1;
this.vs *= -1;
}
if(this.y > 464 || this.y < 0){
this.vy *= -1;
this.vs *= -1;
}
this.rotation += 2;
};
return ball;
}
addBall();
game.rootScene.addEventListener('touchend', function(evt){
if ((evt.localX > 1120) || (evt.localY > 450)) {
return;
}
var ball = addBall();
ball.moveTo(evt.localX, evt.localY);
})
};
game.start();
};