Кажется, что анимация возобновляется после вызова cancelAnimationFrame - PullRequest
Новая
       19

Кажется, что анимация возобновляется после вызова cancelAnimationFrame

0 голосов
/ 15 октября 2018

Я учу себя программированию и написал небольшую игру на точность мыши.В целях тестирования, когда оценка пользователя (точные клики на сокращающихся полях) достигает 3, он выигрывает (переход к экрану выигрыша).Если исчезают 2 поля, пользователь проигрывает (переходит к экрану потери).

Вот моя игра на JSFiddle.

Я использую 

requestframeref = requestAnimationFrame(draw);

... для анимации холста HTML5.Я использую 

cancelAnimationFrame(requestframeref);

... для остановки анимации, после чего код должен вывести игрока на экран выигрыша / проигрыша.Я сталкиваюсь с ошибкой, когда экран выигрыша работает нормально, но через несколько секунд экран проигрыша исчезает и заменяется игрой.Время, в течение которого появляется экран потери, примерно равно времени, необходимому для сокращения одного из квадратов / целей, поэтому я представляю, что в какой-то момент методы trgt.reset и trgt.draw в пределахМетоды функции рисования вызываются снова, но я не могу понять, почему.

Я прочитал каждый вопрос SO, показывающий requestAnimationFrame и многие другие онлайн-ресурсы, и до сих пор не могу понять, насколько это возможно - насколько яМожно видеть, что я использую cancelAnimationFrame одинаково как в моем методе trgt.hit, так и в функции draw ().

Заранее большое спасибо.Если я смогу сделать этот вопрос лучше или яснее, пожалуйста, дайте мне знать.

1 Ответ

0 голосов
/ 15 октября 2018

Проблема довольно проста: вы снова звоните draw даже после того, как игрок проиграл. 

if (disses == dissesMax) {
  cancelAnimationFrame(requestframeref);
  scene_lose();
}

Должен быть заменен на 

if (disses == dissesMax) {
  cancelAnimationFrame(requestframeref);
  return scene_lose();
}

проблема вскоре после того, как if ( dissess == dissesMax ) { .. } вы звоните requestframeref = requestAnimationFrame(draw); //add movement, который перезапустит игру.

Добавление return к насыщению if гарантирует, что, если условие проигрыша выполнено, вы никогда не будете повторнозвоните draw с состоянием игры.

...