2.ウィジェットのセットアップ

左マウスボタンを押したときに何がおこるかをスクリプティングします。

Windows
MacOS
Linux
このページ中

左マウスボタンが押されたことを判断し、スクリーン スペースで押された場所を保存します。 DetectDragIfPressed を使って、プレイヤーが指定されたキーでドラッグしているかを判断します。

ステップ

  1. HealthBar Widget ブループリントを開いて、[Hierarchy] ウィンドウで キャンバス パネル を削除します。

  2. Progress Bar (進捗バー) を追加します。次にその上で 右クリック して、Details パネルで 500 x 50 に設定された Size BoxWrap With します (囲みます)。

    DragDrop4a.png

    任意で、進捗バーをスタイライズすることができます。以下は、調整したプレビューを Desired on Screen に設定し、Percent1.0 にして、進捗バーが充たされて、色が緑に変わるようにしました。

    DragDrop4b.png

    このチュートリアルで作成するヘルスバーは機能せず、デモ目的に限ったものです。

  3. Graph モードに切り替えて、My Blueprint パネルで、 OnMouseButtonDown のオーバーライドと OnDragDetected のオーバーライドを追加します。

    DragDrop5.png

    ご自身のカスタム スクリプトを呼び出すようにオーバーライドできるいくつかの関数があります。ここでは、マウス ボタンが押されたとき、およびウィジェットのドラッグが検知される場合にいくつかのチェックを行います。

  4. OnMouseButtonDown ノード内で、My Geometry ピンからドラッグして Absolute to Local ノードを追加します。

  5. Mouse Event ピンから Get Screen Space Position ノードを追加し、以下のように接続します。

    DragDrop6.png

    ここでは Health Bar ウィジェットの絶対座標をローカル空間に変換します。これを行うには、マウスボタンがボタンのキー押下を登録したスクリーン空間の位置を取得します。 これで、ウィジェットのどこでプレイヤーが実際にクリックしたかがわかります。ウィジェットをドロップする場合にこれを使ってどこに配置すべきかを判断し、それを変数として保存します。

  6. Absolute to Local ピンの Return Value右クリック し、Drag Offset という変数に Promote (昇格) します。

    DragDrop7.png

    On Mouse Button Down ノードでエラーが発生しても大丈夫です。関数が完了するとエラーはなくなります。

  7. グラフ内を 右クリック して、 Detect Drag if Pressed ノードを追加します。

  8. Drag KeyLeft Mouse Button に設定し、Mouse Event と残りのピンを以下のように接続します。

    DragDrop8.png

    ここでは、On Drag Detected スクリプトを開始する前に、プレイヤーが Left Mouse Button をドラッグしているかを判断しています。

プレイヤーが所定の位置をドラッグしているかを検知する機能を使って、次にドラッグが検知されると何が起こるかを設定して完成させます。

Select Skin
Light
Dark

新しい Unreal Engine 4 ドキュメントサイトへようこそ!

あなたの声を私たちに伝えるフィードバックシステムを含め、様々な新機能について開発をおこなっています。まだ広く使える状態にはなっていないので、準備ができるまでは、ドキュメントフィードバックフォーラムで、このページについて、もしくは遭遇した問題について教えていただけると助かります。

新しいシステムが稼働した際にお知らせします。

フィードバックを送信