Posted Articles

わんころのUE5勉強会 Jun/17/2025 19:04

【UE5.3:検証】キーコンフィグ「Map Player Key」のSlotについて

皆様、お疲れ様です!

UE5.3 で実験的な機能として登場した Enhanced Input User Settings でキーコンフィグがより扱いやすくなりました。
この機能は UE5.5 で正式対応となりました。



上記画像はキーコンフィグを行う関数「Map Player Key」の "In Args" の構造体を分割した状態です。その中のメンバ変数 Slot について検証を行いました。

この記事は UE5.3.2 を利用しています。
以降のバージョンでも同じように利用できると思いますが、仕様変更等あるかもしれないためご注意下さい。

先に結果を記載しますと「IMC で設定する Mapping Name に対して最大2つまでキーやボタンの割り当てが出来る」役割があります。


利用するための準備3つ

1. プロジェクト設定


この機能を利用するには「プロジェクト設定」>「Enhanced Input」 の中にある "ユーザー設定を有効化(実験段階)" にチェックを入れる必要があります。

UE5.3 から実装されている機能なので、それ以下のバージョンではこの項目は存在しません。


2. IMC の設定


今回の例では、IMC_Default という IMC に IA_Interact を追加し、Eキーでトリガーする設定と、"Player Mappable Key Settings" の名前を KB_Interact に設定しています。

3. Register する


「Map Player Key」関数で利用するには Register する必要があるため、 Blueprint の適切な場所で「Register Input Mapping Context」を使って登録を行うか、「Add Mapping Context」の "Options" ピンを分解すると出てくる "Notify User Settings" を True にすれば Register されます。

「Map Player Key」は Register 出来ていれば利用できるため「Add Mapping Context」はしてなくても良いです。

これで準備は完了です。


「Map Player Key」の基本的な使い方


特に重要な設定は [Mapping Name] [Slot] [New Key] です。

この関数は Register された IMC の中から [Mapping Name] と一致するものを探し、見つかった場合は指定の [Slot]に割り当てたキーを [New Key] に置き換えます。

上記の画像だと IMC_Default が Register されているので、KB_Interact と一致する IA_Interact の Eキーを左クリックに置き換えるという挙動になります。この関数だけでキーコンフィグできるので非常に扱いやすくなりました。

[Slot] についてですが、基本的に First を選ぶことが多くなると思います。



例えば IA_Move を見ると、IA_Move という1つの入力アクションに対して複数のキーを設定していますが、上から順に Slot の First, Second, Third... と並んでいるわけではないようで、IMC で設定するキーはすべて First の Slot が使われているということが分かりました。


また、最大2つ(First, Second) まで利用できることがプルダウン内の説明から確認できますが、Third ~ Seventh はどう使うかは分かりませんでした(プロジェクト設定では該当しそうな項目を見つけられませんでした)


Second Slot の扱いですが、例えばインタラクトを Eキーと左クリックにしたい場合、IMC 内で各キーに名前を付けますが Eキーには KB_Interact、左クリックには KB_Interact2 のように名前を分ける必要が出てきます。(名前は一意でないといけないため重複した名前は設定できません)


IMC_Default の設定ではインタラクトに Eキーだけ設定していました。


この状態で画像のように「Map Player Key」を呼ぶと KB_Interact を指定していますが、Eキーも左クリックも両方トリガーされるようになります。

ここでさらに重要な設定が [Create Matching Slot if Needed] を True にすることで、Second Slot がまだ作成されてない場合は作成し、Second Slot に新しいキーを割り当ててくれるようです。

KB_Interact という名前に対し、First が Eキー(IMCで設定したキー)、Second が「Map Player Key」の左クリックが割り当てられたということになります。

更に追加で「Map Player Key」を呼び、Slot は Second, New Key を Yキーにすると Second Slot は既に作成されているため、左クリックが Yキーに置き換わるという挙動になります。


「Apply Settings」「Save Settings」で適用、セーブが可能


「Map Player Key」で設定を変更してもセーブしないと変更箇所はなくなってしまうため、「Apply Settings」でゲーム中に適用、「Save Settings」でセーブすることができます。

「Save Settings」を呼べば設定が保存され、次回ゲーム起動時に勝手にロードしてくれるので大変便利です。

また、「Apply Settings」や「Save Settings」を呼んだタイミングを知りたい場合は、過去の記事 を参照下さい。


どういう時に役立ちそうか


これは現在開発中のゲームのキーコンフィグ画面ですが、2つまでキーコンフィグ可能な仕組みが欲しい場合に役立ちそうです。

キーコンフィグ可能な PC ゲームは最大2つまで設定できるゲームが多い印象です。



軽い紹介程度ですが、Input Key Selector が2つ並んでおり、それぞれ First, Second という Slot を指定し、中身の「Map Player Key」では [Create Matching Slot if Needed] を True にしています。

こうすることで IMC 内に余計な設定を増やすことなく Slot を追加するという実装で対応できるようになりました。

結構いい機能なのにちゃんと理解できてなかったのが勿体なかったですが大変勉強になりました。




いきなり暑くなりすぎですが、熱中症等お気を付けくださいませ!

If you liked this article, support the creator with a tip!

Sending tips requires user registration.Find details about tips here.

わんころのUE5勉強会 May/22/2025 20:27

【UE5:検証】Common Action Widgetで画像が表示されない

皆様、お疲れ様です!

今回は CommonUI の機能の1つ Common Action Widget に加えて、編集> プロジェクト設定> ゲーム - Common Input Settings の Enable Enhanced Input Support を有効にした際の検証です。

Common Action Widget で表示する画像ですが、ある条件で画像が表示されない問題があったためそれを検証していた記事になります。

UE5.5.4 で確認した内容です。


Common Action Widget とは


専用のアセットで設定したキーやボタンに対応した画像を表示するための Widget です。キーボード ⇋ ゲームパッドに操作を切り換えた時に表示する画像を変えたりできます。

利用するための準備

プラグインとプロジェクト設定


編集> プラグイン から Common UI Plugin を有効にし、プロジェクトを再起動します。


さらに、編集> プロジェクト設定> Common Input Settings の Enable Enhanced Input Support を有効し、プロジェクトを再起動します。

※ CommonUI を利用する際、プロジェクト設定の "ゲームのビューポートクラス" に[CommonGameViewportClient]を設定することが多いですが、今回の検証は画像の表示を確認するだけなのでこの設定は不要です。


Input MappingContext, Input Actionを作成


IMC_UI_InputTest
IA_MenuTest01, IA_MenuTest02, IA_MenuTest03 を作成しました。

画像を表示するために利用する
Input Mapping Context(IMC)になります。画像はそれぞれキーをマッピングしたものです。
今回は W, E, Enter の3つのキーを設定しています。


UI の作成

その後、コンテンツブラウザで右クリック> ユーザーインターフェース> ウィジェットブループリントから CommonUserWidget を選択して作成します。ここでは CUI_MenuTest としておきました。

※ User Widget(いつもの) を選んで作成しても Common Action Widget は利用できるのでこの例だとどちらでもOK。


CUI_MenuTest を開き、Vertical Box に Common Action Widget を3つ追加しました。


Common Action Widget のプロパティで Enhanced Input Action に Input Action を設定します。
今回は Common Action Widget を3つ使っているので、それぞれに IA_MenuTest01, IA_MenuTest02, IA_MenuTest03 を設定しています。

UI 側の設定はこれだけです。


表示する画像を設定する


CommonInputBaseControllerData を選択してブループリントを作成します。名前を KeyboardIcon としました。


これを開き "Input Type" を[Mouse and Keyboard]にします(デフォルトでこれになってます)

"Input Brush Data Map" の「+」を押してキーと画像を割り当てます。W, E, Enter のキーを設定していますが、IMC_UI_InputTest で設定したキーと一致させる必要があります。

キーの画像には KENNEY 氏が公開されているアイコン をお借りしています!


検証開始


いつもの IMC_Default はそのままに、後ろに IMC_UI_InputTest を Priority 0 で追加しています。


適当な場所で Create Widget から CUI_MenuTest を作成し、「Add to Viewport」しました。

検証1:期待した挙動


3つのキーが Common Action Widget によって表示されました!
やったー!なんですが次の検証を行います。

検証2:Add Mapping Context しない場合


IMC_UI_InputTest を「Add Mapping Context」しない場合は画像が表示されません。

利用する場合は「Add Mapping Context」する必要があります。


検証3:Priorityを変える


IMC_Default の Priority が高くなるように設定してプレイしてみます。


W が表示されなくなりました。
これは、IMC_Default のキャラ移動 W とかぶっているからだと思います。


先程は W が表示されていましたが、「Add Mapping Context」する際、同じ Priority が設定されている場合、後から追加した方が Priority が高くなります。

Common Action Widget に設定した Input Action は Priority の設定に影響するということが分かりました。


検証4:Consume Input はどうなる?


今は IMC_Default の方が Priority が高いので、W を利用している IA_Move を開きます。
その中の "Consume Lower Priority Enhanced Input Mappings" という設定があります。

IA_Move よりも Priority が低いキーもトリガーさせるかの設定です。
この設定を OFF にします。



また W が表示されたので Consume Input の設定に影響するということも分かりました。

まとめ

Common Action Widget で設定した Input Action を「Add Mapping Context」された IMC から探し、そこにマッピングされたキーと一致する画像を CommonInputBaseControllerData から参照して表示。

同じキーが見つかった場合は、Priority が高い IMC があると画像が表示されない。

Consume Input の影響も受けるという結果になりました。

キーコンフィグに利用できないかなと思ってここ数日検証していたんですが、画像が表示されないキーがあったので原因を探っておりました。


おわりに

連携出来るのはいいな~と思ったんですが、キーコンフィグに利用しようとすると、Prioroty や「Add Mapping Context」されてないといけないので一工夫いるかもと思いました。

なかなかややこしいですね。

If you liked this article, support the creator with a tip!

Sending tips requires user registration.Find details about tips here.

わんころのUE5勉強会 Apr/28/2025 21:37

【UE5:検証】CommonUIとGame PadのFace Button Bottom(Aボタン)

皆様、こんばんは!

以前 X で検証した内容ですが、解決できずこんな仕様なんだというのが分かっただけの記事です。


▼ 以前色々試して撃沈した様子
https://x.com/UE5wancoro/status/1884024134549790825


この記事の内容

CommonUI + Input Key Selector を使ってキーコンフィグを実装しようとした時に、Face Button Bottom(以降Aボタン)がマウス左クリックとして扱われたのを検証していた時のお話です。


プロジェクト設定

CommonUI プラグインを有効にすると、プロジェクト設定の「GameViewportClientClassName(ゲームのビューポートクライアントクラス)」で "CommonGameViewportClient" を選択できます。

以降はこの設定にしてる場合の Input Key Selector の挙動です。


どういう挙動なのか


UI 作成時に "Common User Widget" を親にし、
Canvas Panel, Input Key Selector を配置しました。


ゲームパッドで A, B, X, Y ボタンを押した動画です。
分かりづらいですが Aボタンの部分が「マウスの左ボタン」となっています。


Aボタンが左クリックとして扱われる

CommonUI の入力等に関しては 入力技術ガイド に色々書いてありました。

一部抜粋:
FCommonAnalogCursor では、現在のウィジェットで 結合アクション によってキャプチャされていないゲームパッド上の標準的な「Accept」アクションの入力は処理しません。代わりに、その入力が FAnalogCursor::HandleKeyDownEvent に送信されて、FAnalogCursor によって FSlateApplication で処理する合成マウス クリック イベントが作成されます。
この時点で、このマウス イベントは通常のクリックと同じような入力処理プロセスを経て、最終的なクリックをトリガーします。

自分には難しい内容だったので誤った解釈をしている可能性はありますが、ゲームパッド操作時に内部的にマウスカーソルで操作してるような動きに置き換えられているので、Hovered や Clicked イベントが利用できるのかなと思いました。

また、ゲームパッド上の標準的な「Accept」というのがAボタンのことなら、Input Key Selector でAボタンを押すと通常のクリック(左クリック)として扱われるという説明に納得できます。


特定の操作時はAボタンとして扱われる


この動画は Input Key Selector を先にマウスでクリックして入力受付状態にし、ゲームパッドでAボタンを押した時の挙動です。

この場合はAボタンとして扱われるようです。
ゲームパッドで Accept(Aボタン) を利用しなかったので、通常のゲームパッドとして認識されたのかなと思いました。

また、Input Key Selector の On Key Selected イベント時に入力されたキーの種類を判別する Blueprint も作成し、入力がマウスであることも確認出来ました。


※ チェック用の処理


ちなみに Common Input Subsystem> Get Current Input Type の方で確認すると GamePad と表示されます。

この結果で、Input Key Selector 選択時はゲームパッド入力の判断が出来ていて、内部でマウスイベントに置き換えられているということが分かりました。

なるほど~とは思いましたがAボタンで返ってきて欲しかったんですよね...


C++ を使えば回避できるかも?

私はこの時点でお手上げだったので解決はできませんでした。
UE5.4 以降ならこういう方法があるそうです。

https://forums.unrealengine.com/t/why-does-left-mouse-click-register-when-i-press-gamepad-face-button-bottom-on-gamepad/1809814/3


他の機能で代用しようか検討中

CommonUI を使うとボタンやスライダ含め、ゲームパッドでのUIナビゲーションに利用できそうでいいな~と思ってたんですが、ゲーム制作にキーコンフィグを入れようと確認していた時にこの内容にぶつかってしまったのが今回の経緯でした。

プロジェクト設定で "GameViewportClient" にしていればこの挙動は発生しなかったので CommonUI をやめて UI Navigation 3.0 を代わりに使う方法も検証してたのですが、エディタが高頻度で落ちるようになったのでやむなく断念しました。

代わりにボタン+テキストの構成で、キー入力があったらキーの名前をテキストにセットしてそれっぽく見せる方法でどうにか出来ないかなと考えています。

キー入力の取得やキーコンフィグは Enhanced Input User Settings を使って色々検証出来ているので UI のナビゲーションが出来れば行けそうな気はしています(フラグ)


最後に

やっぱり UI 周りかなり難しいなと感じますね...
もうそろそろ UE5.6 もリリースになると思いますが何かしらアップデートがあると嬉しいですね。

UE5.6 の新テンプレートも結構楽しみにしています。


それではまた!

If you liked this article, support the creator with a tip!

Sending tips requires user registration.Find details about tips here.

わんころのUE5勉強会 Feb/28/2025 21:32

【UE5:検証】Actor Componentでタイムラインを使ってみる

皆様、こんばんは!

最近 UE5 に触れる時間が少し出てきたのでまた楽しんでおります。

今回は「Add Component by Class(クラスごとにコンポーネントを追加)」ノードを利用した時にたまたま見かけた "Timeline Component" というコンポーネント。

Actor Component で「Add Timeline」は利用できないけどコンポーネント経由ならもしかして利用できたりするのかな...という疑問から始まった久々の検証記事です。

結果的に利用できたという内容なのですが、Actor Component で「Add Timeline」ノードは普通の方法で利用できず、使い方的に大丈夫なのかは一切不明なため利用の際は十分ご注意下さい!

UE5.3.2 を利用しました。


この記事で行う事

Actor Component 内で Timeline Component を利用したタイムラインの挙動を作成し、この Actor Component を別の Actor(BP_Cube) で利用してキューブの位置を動かすだけのサンプルを作成します(Blueprint のみです)

始める前に

既にそういう機能が Fab で販売されているので興味のある方は是非!
Component Timeline


Actor Component では検索してもヒットしない


タイムラインの追加はグラフ上で右クリックし、add timeline など検索すると見つかりますが、Actor Component では "状況に合わせた表示" のチェックを外しても見つかりません。

パレットからドラッグ、別の Actor BP からコピペして張るとかも禁止されています。

そこで今回の趣旨である "Timeline Component" を使ってタイムラインを作成し、必要なイベントをバインドして利用するというのが目的です。


Actor Component の作成


コンテンツブラウザから右クリック> ブループリントクラス> Actor Component をクリックし、名前を "AC_TimelineSample" で作成しました(AC = Actor Component)

Timeline Component の追加


"AC_TimelineSample" のイベントグラフで、「BeginPlay」から「Add Component by Class」を繋ぎ、"Target"ピンに「Get Owner(Actor Component)」、"Class"ピンに [Timeline Component] を指定します。

そして "Return Value"ピンから変数へ昇格(Promote to variable)します。
いつもならここで変数名を決めるんですが、変数名を変えてもデフォルトの New Var に戻ってしまうのでそのまま New Var として扱います(理由は分かりません)



タイムラインエディタ内の [+トラック]ボタンからトラックを追加することができますが、そのトラックは関数が用意されています。

画像にも載せましたが「Add Interp Float」「Add Interp Vector」「Add Interp Linear Color」「Add Event」となっています。
今回はキューブの位置を動かすだけなので「Add Interp Float」を利用します。


「Add Interp Float」とイベントのバインド


先程の New Var を作成した続きです。
New Var から引っ張り「Add Interp Float」を出します。

"Float Curve"ピンから引っ張り、これも変数へ昇格しました。後ほどカーブアセットを作成して指定します。

"Interp Func"ピンにはカスタムイベントを繋ぎ、名前はタイムラインノードに合わせて Update としました。

例えばタイムラインの「Play from Start」を呼ぶと、Update が再生~終了まで継続的に呼ばれます。

"Output"ピンには後ほど作成するカーブアセットに基づいた Float値が流れてきます。後ほどキューブの位置を動かす処理で追記します。

"Property Name" / "Track Name"ピンに必要に応じて名前を付けます。
プロパティ名・トラック名それぞれ None でもバインド先の Update はちゃんと機能していたので必須ではないようです。


「Set Timeline Finished Func」とイベントのバインド

キューブを動かすだけなので終了後に何かすることはないのですが、タイムラインの再生終了後に何かしたい時の備忘録として記載しました。
(おまけの項目で簡単に触れています)



先程の「Add Interp Float」からの続きです。
今度は New Var から引っ張り「Set Timeline Finished Func」を出します。これはタイムラインの "Finished" 実行ピンと同じくタイムラインの再生終了時にバインドしたイベントが呼ばれます。

"New Timeline Finished Func"ピンにカスタムイベントを繋ぎ、名前を「FinishedTimeline」としました。

必須ではないですが、イベントディスパッチャー(OnFinished としました)を作成し、「FinishedTimeline」の後に呼び出しておくと今回作成した AC_TimelineSample を BP で利用する際、"OnFinished” というイベントで利用できるので便利になるかもしれません。



カーブアセットの作成


コンテンツブラウザから右クリックし、その他> カーブをクリックします。「カーブクラスを選択」のウインドウが出たら Curve Float を選択ます。名前は CA_Cube としました(CA = Curve Asset)


CA_Cube を開き、右クリック> キーを追加から2つキーを追加します(マウスホイールをクリックでもキーの追加は可能です)

追加されると △ アイコンがタイムライン上に作成されます。



1つキーをクリックし、左上の入力欄へ直接数値を入力します。
記載がないので分かりづらいですが、左側が時間、右側が値になります。それぞれ 0, 0 のキーと、1, 1 のキーが出来ればOKです。

これは1秒かけて0~1へ値が変化するという意味になります。
Float値は先程「Add Interp Float」で作成したカスタムイベント(Update)の "Output"ピンから受け取ることが出来ます。


カーブアセットをセットして残りの処理を完成させる

AC_TimelineSample に戻り、変数 "Float Curve" の初期値に CA_Cube をセットします(表示がない場合は AC_TimelineSample のコンパイルが必要です)



AC_TimelineSample の「BeginPlay」に追加の処理を入れていきます。New Var の変数を昇格した後くらいに、「Get Owner」>「Get Actor Location」を出し、"Return Value" を変数に昇格します。

名前を "Start Location" としました。
この位置から適当な距離移動させるために利用します。



次は「Add Interp Float」で作成したカスタムイベント(Update)に追加の処理を入れていきます。

Lerp(Vector) の "Alpha"ピンと "Output"ピンを繋ぎ、 "Start Location" から Y軸方向に適当な距離動かすような処理にしました。

これで1秒かけて初期位置から250動く挙動が完成です。


BP_Cube で AC_TimelineSample を利用する

コンテンツブラウザで右クリックから、ブループリントクラスをクリックし、Actor を選択して作成します。名前を BP_Cube としました。



BP_Cube を開き、「コンポーネント」パネルからキューブと、AC_TimelineSample を追加したのが画像の左側です。

BP_Cube のイベントグラフより、"AC_TimelineSample"> "Get New Var(Timeline Component)"> 「Play from Start」を出し、「BeginPlay」と繋いだのが画像の右側です。



余談ですが、「Play from Start」はタイムラインの入力実行ピンの1つです。これは最初からタイムラインを再生したい時に利用できます。


これで BP_Cube をレベルに配置してプレイすると、キューブの位置が1秒間Y軸方向に250動きます。
簡単な挙動ですが、タイムラインの機能は利用出来てそうな雰囲気です。

おまけ:タイムラインの再生終了時に何かしたい場合


「Set Timeline Finished Func」の所でちらっと書いた Finished ですが、使い方は BP_Cube 内だとこんな感じになります。

また、タイムラインで利用可能な関数はイベントグラフで右クリックから「コンポーネント>タイムライン」カテゴリで確認してみて下さい。


最後に

冒頭にも書きましたが、Actor Component ではタイムラインノードが使えないので無理やり使ってるような気がしなくもないです。

利用できると便利なのに...と感じることがちょくちょくあったので今回はとても勉強になりました。

それでは、また!

If you liked this article, support the creator with a tip!

Sending tips requires user registration.Find details about tips here.

わんころのUE5勉強会 Jan/20/2025 21:44

【UE5】よく忘れるセットの「Difference」「Intersection」「Union」備忘録

皆様、あけましておめでとうございます!
今年も宜しくお願い致します!



新年早々から備忘録ですが、変数のセットで利用できる関数「Difference」「Intersection」「Union」というセット同士を比較してなんかする関数があるのですが未だに結果どうなるんだっけ...がごっちゃになるので備忘録となります。


変数のセットというのはこれです。



今回利用する変数は String 型のセットにしています。
変数が二つ必要なのでそれぞれ画像のように用意しました。
(※ 変数名は String A, String B ですが、記事内では Set A, Set B と呼んでいます)

この変数を利用して「Difference」「Intersection」「Union」の結果どうなるかをまとめた記事になります。

前提として第一引数に「String A(Set A)」、第二引数に「String B(Set B)」を繋いだ結果になります。


Difference


Difference は Set A の中に Set B と同じ要素があればそれを除外した要素だけ出力されます。

Set A は「A, B, C」、Set B は「D, E, F」となっており、 Set B と同じ要素はないため Set Aの「A, B, C」がそのまま出力されています。



もう一つの例で Set B の初期値を「D, A, C」とした場合は
Set A の「A, B, C」から Set B と同じ要素「A, C」を除外した B が出力されたということになります。

Intersection


Intersection は Set A と Set B で重複する要素だけ出力します。

Set A は「A, B, C」、Set B は「D, E, F」となっており、重複する要素が1つもないため結果は何もなしです。



もう一つの例で Set B の初期値を「D, A, C」とした場合は
Set A の「A, B, C」と重複する要素「A, C」が出力されたということになります。

Union


Union は Set A と Set B を結合した結果を出力します。
もし Set A 内に Set B と重複する要素があった場合はその要素は結合されず除外されます(そもそもセットは重複する要素を持つことが出来ません)

Set A は「A, B, C」、Set B は「D, E, F」となっているので重複した要素がないため全て結合された結果になっています。



もう一つの例で Set B の初期値を「D, A, C」とした場合は
Set A の「A, B, C」と重複する要素「A, C」が除外されて結合されるため「A, B, C, D」が出力されたということになります。

最後に

今年は UE5 触れる時間が作れますように><

If you liked this article, support the creator with a tip!

Sending tips requires user registration.Find details about tips here.

« 1 2 3 4 5 6 7

Search by Article Tags

Monthly Archive

Search by Exclusive Perks

Search Articles