Kali ini
akan di uraikan langkah - langkah yang dibutuhkan dalam pembuatan game canvas
ini adalah :
1. Buat Canvas
// Create the canvas
var canvas =
document.createElement("canvas");
var ctx = canvas.getContext("2d");
canvas.width = 512;
canvas.height = 480;
document.body.appendChild(canvas);
hal pertama yang harus kita lakukan adalah membuat elemen canvas .
saya melakukan ini di JavaScript selain HTML untuk mendemonstrasikan bagaimana
cara mudah ini disempurnakan. Pertama kita punya elemen, lalu kita dapat
referensi isinya, atur dimensi dan lampirkan pada badan dokumen.
2. Masukkan Gambar
// Background image
var bgReady = false;
var bgImage = new Image();
bgImage.onload = function () {
bgReady =
true;
};
bgImage.src = "images/background.png";
sebuah game membutuhkan penggambaran! Jadi mari
masukkan beberapa gambar. Saya ingin ini sesederhana mungkin jadi masukkan
sebuah Image yang sudah dibunggus indah atau sebagainya. bgReady digunakan
untuk mengetahui canvas ketika sudah aman untuk digambar. Kita lakukan
ini pada setiap tiga gambar, kita butuhkan background,
hero
and monster.
3. Objek Permainan
// Game objects
var hero = {
speed: 256,
// movement in pixels per second
x: 0,
y: 0
};
var monster = {
x: 0,
y: 0
};
var monstersCaught = 0;
ref : http://www.lostdecadegames.com/
0 komentar:
Posting Komentar