Cu noul mod de componente de desen, a explicat în capitolul joc de rotație, mișcările sunt mai flexibile.
Cum de a muta obiecte?
Adăugați o speed
de proprietate la component
constructor, care reprezintă viteza actuală a componentei.
De asemenea , face unele modificări în newPos()
metoda, pentru a calcula poziția componentei, bazată pe speed
și angle
.
În mod implicit, componentele sunt orientate în sus, și prin stabilirea proprietății de viteză la 1, componenta va începe să se miște înainte.
Exemplu
function component(width, height, color, x, y) {
this.gamearea = gamearea;
this.width = width;
this.height = height;
this.angle = 0;
this.speed = 1;
this.x = x;
this.y = y;
this.update = function() {
ctx = myGameArea.context;
ctx.save();
ctx.translate(this.x, this.y);
ctx.rotate(this.angle);
ctx.fillStyle = color;
ctx.fillRect(this.width / -2, this.height / -2, this.width, this.height);
ctx.restore();
}
this.newPos = function() {
this.x += this.speed * Math.sin(this.angle);
this.y -= this.speed * Math.cos(this.angle);
}
}
Încearcă - l singur » virajelor
De asemenea, dorim să fie în măsură să facă viraje la stânga și la dreapta. Faceți o proprietate nouă numit moveAngle
, care indică valoarea curentă în mișcare, sau unghiul de rotație. În newPos()
metoda calculează angle
bazat pe moveAngle
proprietatea:
Exemplu
Setați proprietatea moveangle la 1, și să vedem ce se întâmplă:
function component(width, height, color, x, y) {
this.width = width;
this.height = height;
this.angle = 0;
this.moveAngle = 1;
this.speed = 1;
this.x = x;
this.y = y;
this.update = function() {
ctx = myGameArea.context;
ctx.save();
ctx.translate(this.x, this.y);
ctx.rotate(this.angle);
ctx.fillStyle = color;
ctx.fillRect(this.width / -2, this.height / -2, this.width, this.height);
ctx.restore();
}
this.newPos = function() {
this.angle += this.moveAngle * Math.PI / 180;
this.x += this.speed * Math.sin(this.angle);
this.y -= this.speed * Math.cos(this.angle);
}
}
Încearcă - l singur » Utilizați tastatura
Cum pătrat roșu muta atunci când se utilizează tastatura? În loc să se deplasează în sus și în jos, și dintr -o parte în alta, pătrat roșu se mișcă înainte atunci când utilizați "up" în "up" săgeată, și apoi stânga și dreapta la apăsarea săgețile stânga și dreapta.