最終更新日 2019/05/27

派生するボタンを作る

ゲームのUIを作っていると、一部意外アニメーション含め同じ動きのボタンというのはよく出てくる。
ベースのボタンカラー等に修正が入ってしまうと、後々泣きながらすべてのボタンを修正しなければならない羽目に陥るため、回避策として派生ボタンを作ってみる。

テキストを追加する

「Test_Button01/02/03」はビジュアルデザイナ上での赤枠の数値は違うが、中身は同じ１つのウィジェットを並べたもの。
中のデータをいじらずともウィジェット上から簡単に数値を変更できるようにする。

「ボタンを作る」で作ったボタンを再利用。
パレットから「Text」をD&Dで配置する。
変数として扱うので「Is Variable」にチェックを入れる。

このテキストを「Test_Button」ウィジェットの詳細からいじれるようにする。

ノードの設定

「Test_Button」ウィジェットで入力したテキストを入れるための変数を用意。
インスタンス上から変更できるよう「インスタンス編集可能」にチェックをいれておく。
カテゴリは自分でわかりやすいものに設定しておく。

一度コンパイルしておく。

ノードの設定は画像の通り。
テキストの書き換えができる「SetText」を出し、ターゲットは今回作成した「テキスト」を繋ぐ。
「Test_Button」ウィジェットから入力されたテキストが入る変数も繋げば、ターゲットのテキストを書き換えてくれる。

「Test_Button01/02/03」ウィジェットの「詳細」に、上で設定した「カテゴリ」の項目が増えているので、
それぞれテキストを入力しコンパイル＞実行で正しくテキストが書き換わっているかを確認する。

イベント設定のための設定

ボタンを押した際の挙動もそれぞれ別に設定できるようにする。

「Test_Button」ウィジェットのグラフモードにあるイベントディスパッチャーを新規で１つ作成。

「Test_Button」の詳細の一番下にある「イベント」の「On Clicked」の「+」を押す。

「On Clicked」ノードが出来るので、イベントディスパッチャーをD&Dして繋ぐ。

これでクリックした際のイベントをウィジェットの中ではなく外から設定出来るようになる。

「Test_Button01/02/03」ウィジェットの「詳細」の一番下に「イベント」の項目が追加されているのが確認できる。
それぞれのボタンに別々のイベントを割り当てることができる。