ゲーム制作記#031「進捗：スワイプでパネル変更_後編」
■ はじめに
この記事は「こんな問題、こんな感じで解決したで～」という流れを紹介したものです。技術解説サイトのように丁寧な手順解説やコード掲載はしていませんのであしからず。
今回は、「すでにある技術をどうにかこうにか自己流で再現しただけ」の車輪の再開発的な記事です。長いので前後編に分けてます。前編はこちら
＊＊＊＊＊＊＊＊
完成動画を先に見たい方は目次下側の『■ そしてこれが完成形！』へ飛んだってください。
このまま記事を読み進めてくれる方は下へスクロール。
＊＊＊＊＊＊＊＊
では、後編をどうぞ。
■ 次は切り替え用の「パネル」が必要
次はどのくらいの速度や距離で切り替えるのか、数値を決めるために実際動かすパネルが必要。
さて、問題はパネルを何枚用意するか。
まず記事の『■ 最初にしたこと』でも書いた以下の２点を採用するにはどうすればよいか考える。
▼ポイント１
『NPCの人数を変更してもゲームオブジェクトの数を変更しなくて済むようにコードで制御したい』
コード制御なら極論パネルは１枚で対応できる。
▼ポイント２
『スワイプ中、移動先のパネルもチラ見させるようにしたい』
チラ見させるためには「現在のパネル」と「移動先パネル」が同時に表示されるタイミングがある。
スワイプが始まったタイミングでコードを実行して、移動先のパネルを作ることもできるけど、さすがにそこまでミニマム思考じゃなくても良いかも…。
というような事をゴニャゴニャ考えて、
結果、パネルの数は「現在のパネル(1)」「移動先パネル左(0)」「移動先パネル右(2)」の３枚用意して、それをエンドレスで回したら無限にループ出来るのでは！？と考えてみた。
■ パネルを設置後、実機で速度の検証
構想が出来たのでさっそくパネルを置いてみる。
こんな感じ↓
UpData処理で、スワイプした際のX軸の移動距離を常に取得→3枚のパネルのポジションに反映させて、スワイプに合わせて左右にスライドするようにした（Y軸の数値は固定）。
とりあえず仮設定として、画面横幅3/4以上 サイドパネルが表示されたら、中央パネルが入れ替わる様にした。
この状態でAndoroid端末にデータ転送し、実機テスト開始！
今度は速度や距離の数値を見ながら、ひたすらスワイプを繰り返し、最適な数値を探る。
（この状態の動画を撮り忘れた…。）
■ やっと見つけた最適数値！！
検証の結果、以下が自分的パネル切り替えのベスト値だった！
▼ 距離で判定するパターン
・画面横幅の半分 < 移動距離(絶対値) なら交代！
▼ 速度（距離と時間）で判定するパターン
・ ((移動距離(絶対値) > 140f) && (スワイプ時間 < 0.15f))
※どちらの場合も移動距離が0以上か以下かで右移動、左移動を判定
この判定をコードに書き込んで完成だーーー！！！
Scene画面の方が全体の動きが分かりやすかったからセットで動画撮った。
端から反対の端へ移動するときは、背景で移動の瞬間が見えちゃうので非表示にしてます。そのせいか、動画だと端にどんどん沸いているように見えるかも。
パネル以外の場所の処理を邪魔しないように、パネル切り替えスワイプの判定が発動するのはパネルの上だけにした。
▼ 色んな所で使いまわせるように、こんな機能（？）も実装した
最大パネル数を設定可能（事前指定も、コード内で指定も可能）
スクロール制限フラグ。ON＝最初と最終ページ以上進まない。OFF＝エンドレスループ（最終から最初のパネルへ or 最初から最終パネルへつながる）
移動先ナビ画像（画像は自由に設定可能）。先に移動できるパネルがある場合は、画面端にアイコンが表示される（エンドレスループの場合は常に表示）。
スタートページを自由設定可能（常に1ページ目から開始や、最後に開いたパネルから再開も可能）
今回使用しているのは横スライドだが、フラグで縦スライドも有効に出来るようにした
現在値ナビゲーション（ページの全体数と現在値が表示される）。表示はサンプル動画のように〇表示と、1/5のように数字表示の好きな方を選択できるようにした。
■ そしてこれが完成形！
完成したパネル切り替えコードに、『ＮＰＣと商品の変更処理』を追加してついに今回の最終目標も達成！
■ 今回学んだこと
既存の処理を舐めたらあかん！
まさか、開発序盤でこんな大冒険をするとは思わんかった。
時期先取で夏休みの自由研究した気分…。
ただ大冒険やったけど、最初に書いた通りこれは車輪の再発明！
最初にこの動きを考えた人はホンマ偉大！
今回は疲れた！ 楽しかった！ おわります！
今は安価でゲームが買える時代…そのお金は是非ともあなたのゲームライフに還元してください。ゲームの話題が増えるのがメンバーの喜び。