Игра в прыгающие шарики, не отскакивающие от кирпича

Question

Игра в прыгающие шарики, не отскакивающие от кирпича

0

Поэтому моя проблема в том, что мяч проходит через кирпич, ничего не происходит. Я поставлю весь код в jsbin, здесь я публикую только часть, которая не работает. Как вы можете видеть, у меня есть прыгающий шар, ракетка, кирпичи и функция анимации.

for (var i in bricks) {
    if (!bricks[i].isDestroyed) {

        if (
            (this.y + this.radius == bricks[i].y - bricks[i].height)
            && (this.x >= bricks[i].x)
            && (this.x <= bricks[i].x + bricks[i].width)
        ) {
            bricks[i].isDestroyed = true;
            destroyedBrick = true;
            this.direction.y = "up";
            ctx.clearRect(bricks[i].x, bricks[i].y, bricks[i].width, bricks[i].height);
        }

        if (
            (this.y - this.radius == bricks[i].y)
            && (this.x >= bricks[i].x)
            && (this.x <= bricks[i].x + bricks[i].width)
        ) {
            bricks[i].isDestroyed = true;
            destroyedBrick = true;
            this.direction.y = "down";
            ctx.clearRect(bricks[i].x, bricks[i].y, bricks[i].width, bricks[i].height);
        }

        if (
            (this.x - this.radius == bricks[i].x)
            && (this.y - this.radius <= bricks[i].y)
            && (this.y - this.radius >= bricks[i].y - bricks[i].height)
        ) { 
            bricks[i].isDestroyed = true;
            destroyedBrick = true;
            this.direction.x = "left";
            ctx.clearRect(bricks[i].x, bricks[i].y, bricks[i].width, bricks[i].height);
        }

        if (
            (this.x == bricks[i].x + bricks[i].width)
            && (this.y - this.radius <= bricks[i].y)
            && (this.y - this.radius >= bricks[i].y - bricks[i].height)
        ) {
            bricks[i].isDestroyed = true;
            destroyedBrick = true;
            this.direction.x = "right";
            ctx.clearRect(bricks[i].x, bricks[i].y, bricks[i].width, bricks[i].height);
        }
    }
}

Код Jsbin: http://jsbin.com/eZOxusaQ/1/watch?html,js,output

user3023071 02 дек. 2013, в 23:13

Источник

1

Это не описывает, как работает движение шара, только то, как работают столкновения шара с кирпичом. Недостаточно информации для ответа на ваш вопрос.
Diodeus - James MacFarlane 02 дек. 2013, в 21:58
0

Ну вот почему я разместил jsbin. Это не сложно, я не могу усложнить это: D. В основном, когда шар достигает некоторых координат для x и y (конец холста, ракетка, надеюсь, кирпичи), он меняет свои «x» и «y» «направления» и начинает двигаться не, например, на x = +1, а на x = -1
user3023071 02 дек. 2013, в 22:00

Теги:

javascript

html

canvas

2 ответа

Ещё вопросы

Это не описывает, как работает движение шара, только то, как работают столкновения шара с кирпичом. Недостаточно информации для ответа на ваш вопрос.
Ну вот почему я разместил jsbin. Это не сложно, я не могу усложнить это: D. В основном, когда шар достигает некоторых координат для x и y (конец холста, ракетка, надеюсь, кирпичи), он меняет свои «x» и «y» «направления» и начинает двигаться не, например, на x = +1, а на x = -1

Basti M · Answer 1 · 2013-12-02T20-11-00.000Z

Исправлен код.

В принципе, я изменил значение == на <=, так как мяч никогда не попадет в это ТОЧНОЕ пятно. Кроме того, я добавил break внутри каждого из if -conditions, чтобы выйти из проверки, когда один кирпич попал, так как вы хотите, чтобы мяч спрыгнул и не уничтожил целую строку.

for (var i in bricks) {
    if (!bricks[i].isDestroyed) {                   
        if ((this.y + this.radius <= bricks[i].y - bricks[i].height) && (this.x >= bricks[i].x) && (this.x <= bricks[i].x + bricks[i].width)) {
            bricks[i].isDestroyed = true;
            destroyedBrick = true;
            this.direction.y = "up";
            ctx.clearRect(bricks[i].x, bricks[i].y, bricks[i].width, bricks[i].height);
            break;
        }
        if ((this.y - this.radius <= bricks[i].y) && (this.x >= bricks[i].x) && (this.x <= bricks[i].x + bricks[i].width)) {
            bricks[i].isDestroyed = true;
            destroyedBrick = true;
            this.direction.y = "down";
            ctx.clearRect(bricks[i].x, bricks[i].y, bricks[i].width, bricks[i].height);
            break;
        }
        if ((this.x - this.radius <= bricks[i].x) && (this.y - this.radius <= bricks[i].y) && (this.y - this.radius >= bricks[i].y - bricks[i].height)) {                       
            bricks[i].isDestroyed = true;
            destroyedBrick = true;
            this.direction.x = "left";
            ctx.clearRect(bricks[i].x, bricks[i].y, bricks[i].width, bricks[i].height);
            break;
        }
        if ((this.x <= bricks[i].x + bricks[i].width) && (this.y - this.radius <= bricks[i].y) && (this.y - this.radius >= bricks[i].y - bricks[i].height)) {                       
            bricks[i].isDestroyed = true;
            destroyedBrick = true;
            this.direction.x = "right";
            ctx.clearRect(bricks[i].x, bricks[i].y, bricks[i].width, bricks[i].height);
            break;
        }                  
    }
}

РЕДАКТИРОВАТЬ
У вас возникнет проблема, когда ваш мяч попадет в "внутренний кирпич", например, кирпич один ряд над строкой с оставшимися кирпичами. Поскольку ваш мяч уничтожит эти кирпичи с вашими текущими условиями, так как координаты шара будут меньше, чем координаты вашего кирпича. Но это более общая проблема вашей логики. Вам нужно будет включить дополнительные проверки для этого. ;)

MikeD · Answer 2 · 2013-12-02T19-48-00.000Z

Похоже, что код столкновения использует == на некоторых проверках, когда вы, вероятно, хотите неравенства. Поэтому я предполагаю, что мяч перешагивает эту точную позицию, в результате чего другие проверки пропускаются. Переключить все сравнения на> = или <= по мере необходимости и посмотреть, исправляет ли это это.