Java到Javascript / HTML5画布

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) {
  // ...
}