Ruch gry
Dzięki nowemu sposobowi rysowania komponentów, wyjaśnionemu w rozdziale Game Rotation, ruchy są bardziej elastyczne.
Jak przenosić obiekty?
Dodaj speedwłaściwość do componentkonstruktora, która reprezentuje aktualną prędkość komponentu.
Dokonaj również pewnych zmian w newPos()metodzie, aby obliczyć położenie komponentu na podstawie speedi angle.
Domyślnie komponenty są skierowane do góry, a ustawienie właściwości szybkości na 1 spowoduje, że komponent zacznie poruszać się do przodu.
Przykład
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);
}
}
Skręcanie
Chcemy również móc skręcać w lewo iw prawo. Utwórz nową właściwość o nazwie moveAngle, która wskazuje bieżącą wartość ruchu lub kąt obrotu. W newPos()metodzie obliczamy na
anglepodstawie moveAnglewłaściwości:
Przykład
Ustaw właściwość moveangle na 1 i zobacz, co się stanie:
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);
}
}
Użyj klawiatury
Jak porusza się czerwony kwadrat podczas korzystania z klawiatury? Zamiast poruszać się w górę iw dół oraz z boku na bok, czerwony kwadrat porusza się do przodu, gdy używasz strzałki „w górę”, a skręca w lewo i w prawo, gdy naciskasz strzałkę w lewo i w prawo.