<h1 id="%E6%A6%82%E8%A6%81" data-line="0" class="code-line">
<a class="header-anchor-link" href="#%E6%A6%82%E8%A6%81" aria-hidden="true"></a> 概要</h1>
<p data-line="2" class="code-line">この記事は<a href="https://qiita.com/advent-calendar/2024/solo-dariadvent-calendar" target="_blank" rel="nofollow noopener noreferrer">一人アドベントカレンダー by ダリア</a>の13日目の記事です。</p>
<p data-line="4" class="code-line">今回はBPからUMGのローカル座標をワールド座標に変換させるやり方をまとめたものになります。<br>
想定してるイメージはこちらになります。<br style="display:none">
<span class="embed-block zenn-embedded zenn-embedded-tweet"><iframe id="zenn-embedded__693cef1b3e806" src="https://embed.zenn.studio/tweet#zenn-embedded__693cef1b3e806" data-content="https%3A%2F%2Fx.com%2Fdaria_nicht%2Fstatus%2F1859505257677811965" frameborder="0" scrolling="no" loading="lazy"></iframe></span><a href="https://x.com/daria_nicht/status/1859505257677811965" style="display:none" target="_blank" rel="nofollow noopener noreferrer">https://x.com/daria_nicht/status/1859505257677811965</a></p>
<p data-line="8" class="code-line">今回はローカル座標から変換したワールド座標の位置にデバッグ用のボックスを表示させるようにしてます。</p>
<h1 id="%E7%92%B0%E5%A2%83" data-line="11" class="code-line">
<a class="header-anchor-link" href="#%E7%92%B0%E5%A2%83" aria-hidden="true"></a> 環境</h1>
<p data-line="13" class="code-line">UE5.4.4</p>
<h1 id="%E3%82%84%E3%82%8A%E6%96%B9" data-line="15" class="code-line">
<a class="header-anchor-link" href="#%E3%82%84%E3%82%8A%E6%96%B9" aria-hidden="true"></a> やり方</h1>
<p data-line="17" class="code-line">まずUMGを作ります。<br>
レイアウトはこちらになります。</p>
<p data-line="20" class="code-line">サンプルのため適当な場所にテキストブロックを出しています。</p>
<p data-line="22" class="code-line"><img src="https://res.cloudinary.com/zenn/image/fetch/s--j-Ke4ePq--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_1200/https://storage.googleapis.com/zenn-user-upload/deployed-images/1253cd90a9f1bb6930ff6662.png%3Fsha%3D301107ed28c2427d3e68a9d6804295b316ac9494" loading="lazy" class="md-img"></p>
<p data-line="24" class="code-line">次にBPの方に移動し、ローカル座標からビューポート座標に変換させた際のスクリーン座標を取得する関数を作ります。<br>
取得の仕方は<code>GetCachedGeometry</code>ノードから<code>Local to Viewport</code>ノードでローカル座標からビューポート座標に変換したPixelPositionを渡すようにします。</p>
<p data-line="27" class="code-line"><img src="https://res.cloudinary.com/zenn/image/fetch/s--8LZAnUID--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_1200/https://storage.googleapis.com/zenn-user-upload/deployed-images/c3ec92f6728bae4a20806820.png%3Fsha%3D6df1aaefb9e576a01382479741e6073700528b6e" loading="lazy" class="md-img"></p>
<p data-line="29" class="code-line">次に作成したウィジェットを表示するアクターを作ります。</p>
<p data-line="31" class="code-line">BeginPlayでウィジェットを作り、Event Tickで先程作った関数を呼んで、ピクセルの座標をワールド座標に変換して表示するようにします。<br>
<img src="https://res.cloudinary.com/zenn/image/fetch/s--ImCk1kq7--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_1200/https://storage.googleapis.com/zenn-user-upload/deployed-images/2723736600e22cd10f7301c4.png%3Fsha%3D1a7501c5c65b90945bc9ccff260561d33a18987e" loading="lazy" class="md-img"></p>
<p data-line="34" class="code-line">ここまでできれば冒頭の動画のようになります。</p>
<p data-line="36" class="code-line">記事は以上になります。<br>
最後まで読んでいただきありがとうございました。</p>
<h1 id="%E5%8F%82%E8%80%83" data-line="39" class="code-line">
<a class="header-anchor-link" href="#%E5%8F%82%E8%80%83" aria-hidden="true"></a> 参考</h1>
<p data-line="40" class="code-line"><a href="https://logicalbeat.jp/blog/8197/" target="_blank" rel="nofollow noopener noreferrer">【UE4】カーソルの位置とウィジェットの座標系について</a></p>


【UE5】BPでUMGのローカル座標からワールド座標に変換させる方法

Discussion