[Unreal Engine 5]Tile Viewで作成したボタンをクリックしてイベントを発生させる

シンプルなタワーディフェンスゲームを作る part15

シンプルなタワーディフェンスゲームを作る part15

こちらのようなシンプルなタワーディフェンスゲームを作っています。前回は、「タワーソケット」をクリックすると複数の「砲台タワー」の候補から建設したいタワーを選択できるUIを作りました。本記事ではUIに表示されるボタンを押してタワーを建設する機能を作成します。

基本設計

「タワー建設UI」は「タワーソケット」をクリックすることで表示されます。
直前にどの「タワーソケット」をクリックしたか？を「プレイヤーコントローラ」の方で記憶しておき、「タワー建設UI」の「タワー建設ボタン」をクリックされたときに、直前に触れていた「タワーソケット」の場所に、「タワー建設ボタン」に対応した「砲台タワー」を出現させるようにします。
また、「タワー建設UI」が常に表示されないよう、「タワー建設ボタン」をクリックされたときと、右クリックされたときには「タワー建設UI」を非表示にする機能も作ります。

直前に触れていた「タワーソケット」を記憶する

「BP_PC_towerdefence」を開きます。(part8で作成)

「Add Custom Event」で新しいイベントを作成し、名称を「set_active_tower_socket」にします。
「BP_tower_socket」型の変数を作成し、名称を「active_tower_socket」にします。
イベント「set_active_tower_socket」の続きに変数セッター「set active_tower_socket」を追加し、イベントのインプットにセッターの入力ピン「active_tower_socket」を繋ぎます。

「BP_tower_socket」を開きます。

オブジェクトをクリック時に発火するイベント「OnClicked_Event」の続きに以下を作ります。
「get Player Controller」、「Cast To BP_PC_towerdefence」を追加します。
「set_active_tower_socket」を追加し、「active_tower_socket」ピンに自身の参照「Get a reference to self」を繋ぎます。

これで最後にクリックされたタワーソケットが「BP_PC_towerdefence」で記憶されます。

「タワー建設ボタン」をクリックしたらタワーを出現させる

「BP_tower_socket」を開きます。

タワーを建設する処理「spawn_tower」(part8で作成)を改造します。
「Spawn Actor」の「Class」ピンを「spawn_tower」にドラッグアンドドロップし、イベント「spawn_tower」のインプットとします。

「WBP_tower_select_entry」を開きます。

「button_make_tower」を選択し、左下の詳細パネルから「On Clicked」を選択します。
すると、「On Clicked(button_make_tower)」イベントが追加されます。

「On Clicked(button_make_tower)」の続きを以下のように作ります。
「get Player Controller」、「Cast To BP_PC_towerdefence」を追加します。
「Cast To BP_PC_towerdefence」から線を引き出して「get active_tower_socket」を追加します。
「Is Valid」を追加し、「Input Object」に「get active_tower_socket」を接続します。
「get tower_info」、「Break ST_tower_info」を追加します。
「active_tower_socket」から線を引き出して「spawn_tower」を追加します。
Classに「ST_tower_info」の「tower_class」を接続します。

ここまでで、「タワー建設UI」で建設したいタワーのボタンを押すと、最後に触った「タワーソケット」上にタワーを出現させることができます。

「タワー建設UI」表示/非表示を制御する

「タワー建設UI」を表示できる条件を定めます。「タワーを持たないタワーソケットをクリックしたとき」とし、現在別のタワーソケット用に「タワー建設UI」を表示していればそれを非表示にして改めて表示しなおします。
また「タワー建設UI」を非表示できるようにします。非表示したいのは「右クリックしたとき」と「タワーを建設したとき」とします。

「BP_tower_socket」を開きます。

「show_construction_ui」の続きに「get have_tower」「not boolean」「branch」を追加し、タワーを持っていないか判定します。
「Cast To BP_PC_towerdefence」、「get Player Controller」を追加します。
「Cast To BP_PC_towerdefence」の「AsBP_PC_towedefence」から「get active_tower_socket」を繋ぎ、それが「self」が一致しないかを判定します。
前回作成した「Create WBP Tower Construct Ui Widget」の「Return Value」を右クリック→「変数へ昇格」で変数を作成し、名称を「construction_ui」とします。

「Add Custom Event」で新しいイベントを作成し、名称を「remove_construction_ui」にします。
「get construction_ui」、「Is Valid」を追加します。validの場合、「construction_ui」を「Target」として「Remove from Parent」を繋ぎます。そのあとに「set construction_ui」を繋ぎます。

「BP_PC_towerdefence」を開きます。

「Add Custom Event」で新しいイベントを作成し、名称を「remove_construction_ui」にします。
※「BP_tower_socket」の「remove_construction_ui」と名称が被ってしまいました。
「get active_tower_socket」、「Is Valid」と繋ぎ、「active_tower_socket」を「target」とした「remove_construction_ui」ノードを追加します。そのあと「set active_tower_socket」を繋ぎます。
イベント「Right Mouse Button」を追加します。「self」を「target」とした「remove_construction_ui」を繋ぎます。

2つ前の画像の「この後作成する」には、ここで作成した「BP_PC_towerdefence」側の「remove_construction_ui」を追加します。