スマホアプリは、タッチが命という事を、心の底から理解している、弓削田です。
前回に引き続き、ゲームのコントロールをタッチ対応する作業を進めていきたいと思います。
画面にタッチする仕組みができたので、その座標をもとに、キャラクターの進むべき方向を算出する処理を加えてみたいと思います。
実は、もともと、キーボードで操作するのをデフォルトにしていたので、カーソル操作の時にも、迷ったんですが、
タッチ操作は、さらにカオスになるかもしれません。
でも、ゲームの性質として、プログラミングを打ち込むモードなどもあるので、そうした、入力処理を邪魔しないようにしないといけないという
設計も重要なので、今回はとりあえず、キャラを歩かせる事に全力を注ぎますが、
次回以降に、お悩みタイムに入りたいと思います。
（でも、じつは、やり方はすでに、思考済みですが・・・）
タッチした座標からマップアドレスを取得
以前に、管理画面でも同じ様な処理を書いたんですが、
やはりゲーム画面で使うので、もう少ししっかりとした処理を作ってみようと思い、
やり方をガラっと変えてみました。
クォータービューのマップアドレス計算方法
前回は、マップアドレスのすべてのコマを配置する時に、それぞれのコマの座標をメモリに持っていて、
クリック座標と、そのメモリ座標を比較して、一番近似値のデータを採用するという方式だったのだが、
明らかなメモリの無駄使いなので、タッチ座標から、マップアドレスをアルゴリズムで取得できる方式に切り替えようと思う。
こうしたクォータービューのマップアドレスを取得するのは、結構しんどいんですが、
このゲームの肝処理だとも思われるので、歯を食いしばって構築することにしました。
そして、マップアドレスは、左右真ん中一の一番上が、(0,0)というアドレスになって、
そこから、右に向かって、x軸、
左に進むと、y軸が、加算される仕様です。
※今回のこのゲームの仕様なので、別のクォータービューマップは、違うアドレス配置の可能性もあります。
この場合に、必要な情報として、マトリクス状態になっている、マップデータのxとyのそれぞれの個数です。
これをmax値として、max.xとmax.yとして保持しておきます。
そして、複雑に組み合わさったコマ１つを4分割した状態にすることで、1ドット毎のずれを、コマ半分ずつのズレの状態でキープすることができ、
その半分のコマ状態を計算するベースとして考えます。
(0,0)の位置のコマを分割してみました。
これを全コマ分のマップとして、見た目の左上から、マトリクス状態で、縦横の座標として考えます。
そして、ここからが複雑なんですが、
// マップの1コマのサイズ
let tile_size = {
x : 64,
y : 32
};
// マップデータの配列個数
let map_count = {
x : 10,
y : 4
};
// マップ縦横が違う数の場合のズレ防止計算用値
map_count.diff = (map_count.x - map_count.y) / 2;
// x,yそれぞれの基準値の計算
map_count.base = {
x : (map_count.x - 1) /2,
y : (map_count.y - 1) /2
};
// ゆらぎ値
let yuragi = 0.75;
// quoterブロックに分けた座標を計算
let block = {
x : Math.floor(タッチした座標(x) / (tile_size.x / 2) - yuragi) /2,
y : Math.floor(タッチした座標(y) / (tile_size.y / 2) - yuragi) /2
};
// マップ座標計算
let map_pos = {
x : Math.round(((block.x - map_count.base.y) / 0.5) + (map_count.base.x - (block.x - block.y)) - map_count.diff),
y : Math.round((map_count.base.y - (block.x - block.y)))
}
これで無事に、map_posの値に、x,yの数値が入ってくるようになりました。
この計算式が、参考になる人がいたら、コピペして関数化して使ってくれたまえ！
そして、まださらに続きますが、
次回は、タッチ座標から、キャラクターの方向を変換して、歩かせたいと思います。
