uGUI
このスクリプトをUI要素にアタッチすることで、そのUI要素がドラッグ可能になり、親要素の範囲内で自由に移動できるようになります。 using UnityEngine; using UnityEngine.EventSystems; public class UIRectDraggable : UIBehaviour, IBeginDragHandler, …
ScrollRectの子供に配置されたオブジェクトが、IPointerDownHandlerを持つとドラッグ操作時に誤って呼び出される問題があります。 例えば、以下のようなコンポーネントがScrollRectの子供オブジェクトに存在する場合、 public class EventHandleTest : MonoB…
同じ階層にある子供オブジェクトに対して、親にGraphicRaycasterが存在しない場合、Rayが下のオブジェクトではなく上のオブジェクトに当たる問題が発生します。 例えば、以下のヒエラルキーが考えられます。ここで、GraphicRaycasterが「Node Up」と「Node D…
はじめに Unityのユーザーインターフェース（UI）構築において、イベントハンドラーは重要な役割を果たします。UGUI（Unity GUI）システムでは、さまざまなユーザー操作に応じてイベントを処理するために、多くのインターフェースが提供されています。この記…
EventSystems を 利用して Texture2D に絵をかけるスクリプト スクリプト using System; using System.Collections.Generic; using System.Linq; using UnityEngine; using UnityEngine.EventSystems; using UnityEngine.UI; [RequireComponent(typeof(RawIm…
時計盤を作成することがあったので実装をこちらにメモしておきます 特殊な実装はしていないのでスクリプトを読めばだいたい理解できると思います スクリプト using System; using UnityEngine; using UnityEngine.UI; public class UIClock : MonoBehaviour …
ノイズテクスチャを使って uGUI で Dissolve っぽい表現をやってみたかったので Unity2020 の uGUI Shader をもとに作成してみました 使い方 以下の Shader を作成してから、以下のコンポーネントを Image がある GameObejct に追加し よしななノイズテクス…
特定の状況で GraphicRaycaster の enable を切り替えると、 タップ判定が変わることがあったため、その状況と原因について記述する 以下のオブジェクトの配置で 以下のコンポーネントがついている状態で確認する Rootのコンポーネント Canvas1, Canvas2 の…
パラメータがどういった影響を与えるのか分からなくなることがあるので、こちらにまとめる ※ Unity2020.3.14f1 での検証のため パラメータや挙動が異なる可能性がある Padding 上下左右の余白部分のサイズ 0 5 20 Spacing 並べる要素間のサイズ 0 10 50 Chil…
TextMeshPro を利用してると TMP SubMeshUI が生成されることがある これは、設定したフォントにフォールバックフォントが呼び出された際に生成されるオブジェクトで 例えば あaaあ とTextMeshPro に設定すると、 フォールバックフォントの部分だけ SubMesh …
以前Graphic を利用してタップした座標から Ray を飛ばしてタップしたオブジェクトを取得する方法を記述した。 【Unity】uGUI を利用してタップした位置のオブジェクトを取得する - うにてぃブログ しかし、これだと様々な uGUI Event (PointerDown や Point…
最大幅を固定した UI を作成するのが面倒だったので 今後作成する必要があったときのために、設定をここにメモしておく オブジェクトの構成 各オブジェクトのコンポーネント MaxHorizontalSize RectTransform の Width に最大幅を入力 Root Text サンプル 実…
Unity では ContentSizeFitter や HorizontalLayout などを利用した 自動レイアウトのインスタンス生成時にサイズを取得しても正しいサイズが取得できない 下記のコードの場合 sizeDelta は (0, 0) になる using UnityEditor; using UnityEngine; public cla…
Image はデフォルトで色の乗算はできるが、色の加算つまり白っぽくする場合は 独自に Shader を作成する必要がある が、一応Shader を使わずに色の加算っぽい見た目にすることができる 色の加算方法 Image に Mask を追加して、その子供に Image をつけるだ…
EventSystems の イベントは子供の要素で呼び出されるため、親には伝わらない 例えば ScrollView の中に ScrollView を入れた場合は子供の ScrollView しか動かすことができない 親にイベントを伝える 同じ GameObject だったらイベントを受け取れることを利…
通常 uGUI の 画像を Y で反転するとクリックしても反応しない そのための方法として、以前描画する 頂点座標を拡張コンポーネントで変更する方法を記述した hacchi-man.hatenablog.com がもっと簡単にできたので紹介する それは GraphicRaycaster の Ignore…
hacchi-man.hatenablog.com 以前 Unmask の記事を書きましたが、Unmask したからには その部分のクリックをしたいと思ったのでクリック処理を追加してみました ICanvasRaycastFilter を使う方法もありますが、Mask内にボタンを設置する必要があったので 利用…
Image の alphaHitTestMinimumThreshold を 0以上にすればタップした際に有効な Alpha の値を変更できる alphaHitTestMinimumThreshold を 1にすると半透明な部分のタップが無効化される しかしテクスチャが半透明かどうか判定するために Read/Write Enable …
以下のように RenderTexture を生成して、uGUI を映しているカメラに紐付けたところ 下図のように Mask が適応されていない private void Init() { _renderTexture = new RenderTexture(200, 200, 0); ・・・ _camera = _instance.GetComponentInChildren<Camera>();</camera>…
Unity 付属の Outline を使うと下図のようにちょっと見栄えが悪くなってしまう [:plai:w300] そのため描画する数を指定できる Outline を作成してみました きれいには見えるようになりますが、その分描画負荷が上がってしまうので注意 MultiOutline 作成した…
Image にコンポーネントを追加するだけで以下のようなアピール演出をできるコンポーネントを作成しました アピールの大きさ、時間、リピート、インターバルを設定できます using System.Collections.Generic; using UnityEngine; using UnityEngine.UI; [Req…
github.com 以前 角丸UI を作成した記事を公開しましたが、これだとメッシュが増えてしまうため Shader 側 で角丸を作成する UI を作りました 頂点データにパラメータをもたせているため Shader 側に 転送するデータ量が少し増えます hacchi-man.hatenablog.…
CanvasGroup のように Graphic のColor を書き換えずに 一括で色変更をしてみようと CanvasGroup のコードをみたところ ネイティブの処理で記述されているらしく同じようなものはできなかったので とりあえず無理やり作ってみましたが微妙なやつです using S…
下のようなテキストのサイズに合わせてフレームを自動的に変える場合は uGUI の自動レイアウトを利用すると手軽にできる これを作成するには2つのGameObjectが必要で、下図のような親子関係にする 親のGameObject はこのように設定する RectTransformのサイ…
※Unity2019では動作しましたが2018では動作しなかった・・・ SpriteRenderer では Inside Mask と Outside Mask が選択できどちらの Mask をするか選択できますが uGUI には Inside Mask しかありません なので、Mask の処理を拡張し、 Outside Maskの機能を…
Text と TextMeshPro の違いを同じ機能の部分のみ簡単にまとめる UI 表示 Font Atlas Text TextMeshPro 文字色 Shadow Text TextMeshPro Outline Text TextMeshPro UI 表示 TextMeshPro のフォントはズームしてもきれいに表示され 文字の周りをぼかすには Fo…
uGUI では Hierarchy の上にあるものから順番に描画される この際に同じ Atlas の場合 バッチングされる そのため間に Text をはさんだ場合バッチングが途切れると思っていたが 特定のケースでバッチングされることがあったのでそれについてまとめる ※Unity2…
uGUI のドラッグするためには IDragHandler, IBeginDragHandler, IEndDragHandler の3つの interface を継承してやる必要があります これを継承していると Eventsystem が勝手に OnDrag, OnBeginDrag, OnEndDrag を呼び出ししてくれます ドラッグを反映させ…
Fade モードにすれば1文字ずつフェードして現れる using System.Collections.Generic; using UnityEngine; using UnityEngine.UI; [RequireComponent(typeof(Text))] public class AppearText : BaseMeshEffect { private enum DisplayType { NoFade, Fade, …
uGUI の画像を反転させる方法として、Rotation を180にする。もしくは Scale を -1 にするという二択があります が演出などで Rotation や Scale を使うことを考えると値をいじりたくありません また、Rotation.y を180にした場合、タップ等のイベントを取得…
