【microStudio】ゲームパッドクラスをまとめた

こんには。なおしむです。
microStudioというGameEngineを使ってJavaScriptでゲームを作っています。
ゲームを作っているとユーザの入力を処理することがよくあります。入力にはキーボードやゲームパッドなどがあり、次のようなIF文を書くことが多々あります。

// キー操作
if(gamepad.LEFT || keyboard.S || keyboard.LEFT) { // 左
  candidatePos.x--;
} else if(gamepad.RIGHT || keyboard.F || keyboard.RIGHT) { // 右
  candidatePos.x++;
}
if((gamepad.press.UP || gamepad.press.A || keyboard.press.E || keyboard.SPACE || keyboard.UP) && isOnGround()) { // ジャンプ
  isJump = true;
}

IF文の中でいろいろ書いてますが、結局必要なのは、ゲームコントローラで言うところの上下左右とAボタンとBボタンに相当するイベントです。なのでこのIF文を何度も書かなくても良いように、オリジナルのゲームパッドクラスを作りました。

ソース全体

ソースは下記のとおりです。
キーボードのマッピングはゲームによって違うため、keyboardMap変数を変えることでカスタマイズできるようにしました。

使い方

まずはinitでインスタンスを生成して、updateの最初で呼び出します。
その後、myGamePadの値を使って分岐します。

var myGamePad;
init = function() {
  myGamePad = new GamePad();
}
update = function() {
  myGamePad.update();
  if(myGamepad.LEFT) { // 左
    player.x--;
  } else if(myGamepad.RIGHT) { // 右
    player.x++;
  }
}

コントローラーによる分岐がスッキリかけました。

キーのマッピングをカスタマイズ

さきほどのソースでは、キーのマッピングをマイクラのようにしています。
具体的には上下左右のキーを
上がEキー、下がDキー、左がSキー、右がFキー
に割り当てています。
これを、たとえば、viのように
上がKキー、下がJキー、左がHキー、右がLキーに割り当てるなら、keyboardMapを次のように変更すればOKです。

const keyboardMap = {
  UP: ["K"],    // 変更
  DOWN: ["J"],  // 変更
  LEFT: ["H"],  // 変更
  RIGHT: ["L"], // 変更
  A: ["SPACE", "K"],
  B: ["ENTER", "J"],
    }

まとめ

よく使うキー配置を自分なりのクラスにまとめてみました。
ゲームづくりも楽しいですが、ゲームづくりを楽にするライブラリづくりも楽しいものです。
それではまた。