Canvas ng Game
- Nakaraang Pahina Sinabi sa Game
- Susunod na Pahina Components ng Game
Ang HTML <canvas> elemento ay nagpapakita bilang isang rectangular na objekto sa web page:
HTML Canvas
<canvas> Ang elemento ay lubos na magandang gamit sa paggawa ng laro sa HTML.
<canvas> elemento ay nagbibigay ng lahat ng kinakailangan para sa paggawa ng laro.
Gamit ang JavaScript sa <canvas> pagpipinta, pagpatala ng teksto, pagdagdag ng imahe at iba pa.
.getContext("2d")
<canvas> Ang elemento ay may binubuo na objekto na tinatawag na getContext("2d") objekto, na nagbibigay ng mga paraan at katangian para sa pagpipinta.
Maaari mong makita sa aming Canvas Tutorial nalalaman sa <canvas> element at getContext("2d") mas malalim na kaalaman sa objekto.
Kaya, magsimula ka na
Para gumawa ng laro, unang lumikha ng lugar ng laro at ayusin ang pagpipinta:
instance
function startGame() {
myGameArea.start();
}
var myGameArea = {
canvas : document.createElement("canvas"),
start : function() {
this.canvas.width = 480;
this.canvas.height = 270;
this.context = this.canvas.getContext("2d");
document.body.insertBefore(this.canvas, document.body.childNodes[0]);
}
}
Sa susunod na bahagi ng tutorial na ito, ang objekto myGameArea makakakuha ng mas maraming katangian at mga paraan.
function startGame() tawag myGameArea object's start() method.
start() ang method na lumikha ng isang <canvas> elemento, at bilang unang anak na node ipasok sa <body> sa elemento.
- Nakaraang Pahina Sinabi sa Game
- Susunod na Pahina Components ng Game
