Java в Javascript / HTML5 Canvas

Question

Мне было интересно, каковы были переводы java в javascript / HTML5 для этих вещей: 1. Переключение деятельности / макеты 2. Методы 3. Метод сканера (ввод через текстовое поле)

Я пишу в основном игру, написанную на javascript и HTML5. HTML5 используется исключительно для отображения графики через холст. Я пытаюсь создать меню для своей игры, но мне было интересно, как я переключусь на другой макет, когда нажму кнопку воспроизведения.

Answer 1

Ты можешь сделать это миллионами способов. Однако вы чувствуете себя наиболее комфортно.

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

Game.prototype.loadMenu = function() {
  var game = this;
  var can = this.canvas;

  // now we can use the mouse for the menu
  can.addEventListener('click', game.menuClickEvent, false);
  can.addEventListener('touchstart', game.menuClickEvent, false);

  // draw menu
  this.loop = setInterval(function() { game.drawMenu() }, 30);
};

Game.prototype.drawMenu = function() {
  // ... draw the menu
}

Game.prototype.loadLevel = function(levelstring) {
  // unload menu
  var can = this.canvas;
  var game = this;
  can.removeEventListener('click', game.menuClickEvent, false);
  can.removeEventListener('touchstart', game.menuClickEvent, false);

  if (this.loop) clearInterval(this.loop);

  // ... other level init stuff


  // now we can press keys for the game
  //can.addEventListener('click', game.gameClickEvent, false);
  can.addEventListener('touchstart', game.gameClickEvent, false);
  can.addEventListener('keydown', game.gameKeyDownEvent, false);

  this.loop = setInterval(function() { game.tick() }, 30);
}

// called from tick()
Game.prototype.draw = function(advanceFrame) {
  // ...
}