Update в html5 холст игры не работает должным образом

Question

Jsfiddle: http://jsfiddle.net/seekpunk/6eeKH/15/

код:

if (this.collection.length > 0) { 
          if (((this.collection[0].blockX + this.collection[0].blockW) >= cw) || (this.collection[0].blockX <= 0)) { 
           this.collection[0].blockSpeed *= -1; 
          } 
          this.collection[0].blockX += this.collection[0].blockSpeed; 

         } 

первый блок сверху нарисован близнец и я не могу понять, почему я думаю, проблема в рисовании уровней может кто-то, пожалуйста, помогите мне выяснить, что я сделал неправильно в своем коде

Answer 1

Я пытаюсь объяснить это подробно, пожалуйста, несите меня.

Снова в вашей текущей скрипке массив коллекции увеличивается по размеру, когда вызывается метод Draw. Вы можете отлаживать свой код, нет. блоков увеличивается до нескольких тысяч секунд.

Так что теперь это, как ваш код работает в цикле:

1. Ваш код только изменение позиции 1-го блока, т.е. this.collection[0].blockX

2. добавляет еще 5 блоков в коллекции массива с той же позиции. напр: Хотя Update метод вызывается во второй раз, ниже линии получите выполнить

   addBlocks(4, "Red", 50, 70, 50, 5); 
   

   Так что еще один блок будут добавляться в 6-ой позиции массива.

3. Оказывая, он рисует первый блок с обновленными координатами из-за пункта 1. и рисует этот блок снова из точки 2.

Это является причиной того, что в два раза появляется.

Вам нужно немного изменить эту логику, чтобы решить эту проблему.

Надеюсь, что это имеет смысл.

Answer 2

Теперь я думаю, что вы очищаете платформы от массива коллекции, прежде чем какие-либо координаты получат возможность применить и перерисовать на холст , Если вы удалите вызов на «Blocks.clear()», платформа перемещается.