見出し画像

【UE4】ゲームパッドでウィジェットを操作する

こんにちは、結城です!
今回はゲームパッドでウィジェットを操作する方法について、解説していきます。今回使用する方法は非常に簡単で、かつUE4の基本機能のみを使っています。そのため、プラグイン等と違い、バージョンのアップデートによって使えなくなりにくい利点があります。
一度身に着けると様々なプロジェクトで役立つので、是非身に着けておきましょう!

原理

ウィジェットブループリントでは、入力イベントを取得することができません。そこで、まず入力イベントを受け取るアクター(ポーン)が入力を受け取り、それをブループリントインターフェースで通知することで、疑似的にウィジェットで入力イベントを取得することができます。

原理

データを準備する

まず、データを揃えていきます。
最終的に必要なデータは以下の通りです。

・ウィジェット
・ウィジェットを表示するレベル
・アクター(ポーン)
・ブループリントインターフェース

・ウィジェット
まずは、UIとなるウィジェットを作成します。
適当なフォルダ内で右クリックし、「ユーザーインターフェース」から「ウィジェットブループリント」を選択します。
ここでは、仮に「TestWidget」という名前で保存します。

図1

・ウィジェットを表示するレベル
次に、ウィジェットを表示させるためのレベルを作成します。
レベルファイル→新規レベルから「Default」を選択し、新しいレベルを作成します。ここでは仮に「TestMap」という名前で保存します。

イメージ01

・アクター(ポーン)
次に、入力を受け取り、ブループリントインターフェースへ通知するための中継用アクターを作成します。
適当なフォルダ内で右クリックし、「ブループリントクラス」を選択します。出てきたダイアログから「Pawn」を選択し、作成します。
ここでは、仮に「KeyNortifyPawn」という名前で保存します。

図2

・ブループリントインターフェース
最後に、ブループリントインターフェースを作成します。ブループリントインターフェースは、通知用のみの機能の集まりです。これを使用することで、自由にタイミングを相手先に通知することができます。
適当なフォルダ内で右クリックし、「ブループリント」から「ブループリントインターフェース」を選択します。
ここでは、仮に「KeyNortifyInterface」という名前で保存します。

図3

すべての作成が終わるとこのようになります。

図10

1、レベルでウィジェットを呼び出す

まず初めに、レベルでウィジェットを呼び出す設定をしていきます。
TestMapのレベルブループリントを開き、以下のように処理を作ります。
なお、コメントは必須ではありません。

レベル

これにより、このレベルを再生したときに、TestWidgetが画面に表示されるようになります。
処理が終わったらコンパイルしておきます。

2、ブループリントインターフェースの設定

次に、ブループリントインターフェースの設定を行います。
KeyNortifyInterfaceを開き、「新規追加」ボタンから関数を追加します。
ここではテスト用に「Button1」「Button2」を作成します。
ここで作成した関数が通知名となります。
関数を追加したらコンパイルしておきます。

図5

3、アクターの設定

次に、中継用アクターに設定を行います。
KeyNortifyPawnのイベントグラフを開き、「SetWidget」というカスタムイベントを作成します。インプットにTestWidget型のオブジェクトリファレンスを追加します。このイベントはウィジェットから起動され、通知先となるウィジェットを保存するために使われます。

図6

SetWidgetイベントからWidgetを引き延ばし、「変数に昇格」を選択して変数を作成します。わかりやすいように、変数名を「Widget」に変更します。

図7

入力用のイベントを以下のように作ります。
ここでは簡易的に直接ゲームパッドのAボタン・Bボタンイベントを呼び出していますが、キーマッピングを使用しても構いません。

図14

これにより、「Aボタンが押された時にウィジェットへボタン1」「Bボタンが押された時にウィジェットへボタン2」の通知がそれぞれされることになります。
全ての設定が終わったらコンパイルしておきます。

4、ウィジェットの設定

最後に、ウィジェットを設定していきます。
まず、デザイナーで見た目を設定していきます。ウィジェットが表示されていることがわかるように、背景を設定し、それぞれのボタンで動作させるボタンを追加します。

図9

次に、グラフで処理を作っていきます。
ウィジェットが作成された時に、入力中継用アクターをスポーンさせ、コントローラーに紐づけます。また、自身(ウィジェット)を入力用アクタに送り、ウィジェットへ通知できるようにします。

図11

また、ブーリアン型の変数「IsButton1」「IsButton2」を作成し、それぞれTrueにしておきます。この変数はウィジェットのボタン1・ボタン2がアクティブかどうかをチェックするための変数です。最初はボタンが表示になっているため、両方ともアクティブ(True)にしておきます。

図13

次に、メニューバーから「クラス設定」をクリックし、実装インターフェースにKeyNortifyInterfaceを追加します。
追加が終わったら一度コンパイルします

図12

インターフェースを追加すると、そのインターフェースに入っている関数をイベント形式で呼び出すことができます。イベント「Button1」「Button2」を呼び出し、それぞれ以下のように処理を作ります。Button2は使用している変数(IsButton1)、ボタン(Button_1)が異なるだけで、同じ処理です。

図14

これで出来上がりです。
再生してゲームパッドでボタンを押してみると、それに応じてウィジェットのボタンの表示・非表示が切り替わります。後はこれを応用して、ゲームに応じて作り替えてみてください。

まとめ

いかがだったでしょうか。
比較的簡単に、ゲームパッドとウィジェットの紐づけが行えたと思います。今回は直接ボタンを指定しましたが、キーマッピングを使うことで、スティックの傾きによっての操作も可能です。また、この方法では、マウスの入力も同時に取れるため、どちらも使いたいゲーム等には適しています。(もちろん、マウス判定を消せばゲームパッドのみでの操作も可能です。)

宜しければ、サポート頂けると幸いです!サポート頂いた資金は、個人開発・勉強費に充てさせて頂きたいと思います。よろしくお願い致します!