UnityでJoystick（ジョイスティック）を追加する方法【初心者向け】
Unityで【Joystick（ジョイスティック）】を追加する方法を初心者向けに解説した記事です。Unityで開発したスマートフォン用ゲームの操作性がアップします。今回はキャラクターを追加してから操作ができるまでの流れを紹介します。
テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元：GMOリサーチ株式会社 調査期間：2021年8月12日～8月16日 調査対象：2020年8月以降にプログラミングスクールを受講した18～80歳の男女1,000名 調査手法：インターネット調査
ゲームエンジンのUnityでJoystick（ジョイスティック）を追加する方法を初心者向けに解説した記事です。
ジョイスティックを追加すれば、Unityで開発したスマートフォン用ゲームにコントローラーを追加でき、操作性がアップします。
なお、本記事はTechAcademyのUnity入門オンライン講座の内容をもとにしています。
今回は、ゲーム画面内にバーチャルジョイスティックを実装してみようか。
キャラクターの操作とかに使うやつですよね。
そうだね。なのでジョイスティックの前にまずは画面内に操作するキャラクターを配置するところから始めてみよう。
はい！
事前準備
まず事前準備としてJoyStickで動かすキャラクターを用意する必要があります。今回はStandardAssetsから利用しましょう。
新規プロジェクトを作成する時にCharacter Controller.unityPackageにチェックを入れてCreate Projectボタンをクリックします。
ここでいったんシーンを保存しておきます。
この段階でシーンを保存するのは、途中で操作を一時中断した時に、後から再開するためにはシーンが必要だからです。
さて、早速キャラクターを追加といきたいところですが、このシーンにはオブジェクトがカメラしかありませんので、キャラクターを配置してプレイするとキャラクターが落下してしまいます。
そこで地面となるべき平面を先に用意します。
[GameOnjcet]→[Create Other]→[Plane]で平面を作成してください。
ここまで準備ができたら、キャラクターを配置します。
Projectビューで[Standard Assets]→[Character Controllers」と進み、3rd Person…となっているオブジェクトをシーンにドラッグ&ドロップして、大きさ・位置を調整してください。
InspectorでThird Person Controller(Script)のセクションのIdle Animation〜Jump Pose AnimationがMissingになっています。
右横の丸をクリックして、表示されるダイアログから該当するAnimation Clipを設定していきます。
設定が完了したら事前準備は完了です。この状態で実行して、キャラクターがキーボードのカーソルキーで動くことを確認してください。
平面とキャラクターの配置はできたかな？
準備完了です！
それではジョイスティックの実装に入ろうか。まずはパッケージをインポートする必要があるよ。
JoyStickの追加
シーンにJoyStickを追加するには、Packageを追加しなくてはなりません。
[Assets]→[Import Package]→[Standard Assets(Mobile)]を選択してください。
ダイアログが表示されますので、Importをクリックします。
次にJoyStickを割り当てる空のオブジェクトを作成します。
[GameObject]→[Create Empty]で空のオブジェクトを作成して、HierarchyビューでJoyStickとリネームします。
InspectorビューでPosition・Rotation・Scaleを全て0に設定します。
この状態ではまだ空のオブジェクトのままですので、テクスチャを設定します。
InspectorでAdd Componentをクリックして表示されるダイアログからGUITextureを選択します。
TextureがNoneになていますので、右横の丸をクリックして表示されるダイアログからJoystickThumbnailを選択します。
この状態で実行すると、画面左下にJoyStickが表示されました。
Scriptの修正
JoyStickが追加されたと言っても、ただオブジェクトとして追加されただけですので、Scriptを修正してJoyStickを動かす必要があります。
まずキャラクターのScriptを修正します。
Projectビューで[Standard Assets]→[Character Controller]→[Sources]→[Scripts]と開き、ThirdPersonController.jsをダブルクリックして修正してください。
最新のUnityを使っている場合は、91行目に
private var isControllable = true;
という行がありますので、その直下で変数宣言をします。
var inputX;
var inputY;
次に、144行目から
var v = Input.GetAxisRaw( “Vertical” );
var h = Input.GetAxisRaw( “Horizontal” );
の2行がありますので、先頭に//を付けてコメントアウトした上で、その下に
var v:float = inputX;
var h:float = inputY
として、先の変数の値を移動量とします。
ここにJoyStickの傾きの値を入れればキャラクターがJoyStickで操作できるようになります。
Projectビューに戻り[Standard Assets(mobile)]→[Scripts]と開きjoystick.jsをダブルクリックで開きます。
最終行の}の上に以下の行を追加します。
var controller = GameObject.FindObjectOfType( ThirdPersonController ) as ThirdPersonController;
controller.inputX = position.x;
controller.inputY = position.y;
これでcontrollerにはキャラクターオブジェクトが紐付けられました。
キャラクターのScriptに追加した変数inputXとinputYにJoyStickの位置を設定します。
これで実行するとキャラクターがJoyStickで操作できるようになりました。
ぜひ自分でも試してみてください！
ジョイスティックはただ配置しただけでは操作できないので、上の方法でキャラクターと関連付けよう。
スクリプトも変更する必要があるので、慎重にやらないとですね。
今回使ったStandard Assetsはプロジェクト作成時の設定によってはインポートされていない場合があるけれど、そのときは「Assets」→「Import Package」から利用できるからね。
分かりました。ありがとうございます！
Unityをさらに使いこなしたい場合は、プロから聞いたUnityの入門におすすめの書籍も合わせてご覧ください。
[お知らせ]TechAcademyではオリジナルゲームアプリが公開できるUnityオンラインブートキャンプを開催しています。現役Unityエンジニアのサポートで効率的に学びたい場合はご検討ください。
