GARNET LOG

円形ゲージとは？ 円形ゲージは、HPやMP、クールダウン、ローディングの進捗などをリング状・扇形で表現するUIです。 UnityではImageコンポーネントのImage TypeをFilledに設定することで、画像を一定の割合で切り取って表示できます。 この機能を使うと、テクスチャ1枚でシンプルに円形ゲージを実装できます。 スライダーを使ったゲージの実装はこちらの記事も参考にしてください。 【Unity】Sliderからゲージを作る - GARNET LOG UnityのuGUIでSliderコンポーネントをカスタマイズしてHPゲージなどを作る方法を解説。外観の変更から値の連動まで手順を紹介。 GARNET LOG

CanvasGroupとは？ UIを作っていると、パネルやダイアログの表示・非表示を切り替えたり、フェードさせたい場面がよくあります。 そのとき、パネル内のButtonやImageを一つずつ操作するのは手間がかかりますし、管理も複雑になりがちです。 CanvasGroupは、こうした課題を解決するためのコンポーネントです。 GameObjectにアタッチするだけで、そのオブジェクトと子オブジェクトすべてのUI要素に対して、透明度・操作可否・レイキャストのブロックをまとめて制御できます。 たとえばalphaを0にするだけでパネル全体を透明にしたり、interactableをfalseにするだけで全ボタンを一括で無効化したりできます。 個別に制御するコードを書く必要がなくなるので、UIまわりの実装がシンプルになります。 Canvas Group - Unity マニュアル Canvas Group は、個別に処理することなく一ヶ所から UI 要素のグループ全体における特定の機能を与えるのに用いることができます。Canvas Group のプロパティは、そのコンポーネントがアタッチされているゲームオブジェクトだけでなく、すべての子要素に影響を与えます。 docs.unity3d.com

RawImageとは？ RawImageは、uGUIでテクスチャを直接表示するためのコンポーネントです。 よく似たコンポーネントにImageがありますが、2つには以下の違いがあります。 コンポーネント 表示できるもの 主な用途 Image Sprite 通常のUI画像、ボタンの背景など RawImage Texture全般 RenderTexture、ダウンロードした画像、動画など RawImageはSpriteへの変換が不要なため、RenderTextureやTexture2Dをそのまま表示できます。 カメラ映像をミニマップとしてUIに出したり、動画プレイヤーを組んだりするときによく使うコンポーネントです。

RectTransformUtilityとは？ Unityにおいて、Canvas以下にあるGameObjectはTransformの代わりに UI要素の位置やサイズ調整を行う際に使用する、RectTransformコンポーネントを持っています。 RectTransformUtilityはRectTransformに関する便利な機能を提供するクラスです。 RectTransformUtility - Unity スクリプトリファレンス RectTransform と動作するヘルパーメソッドを含むユーティリティクラス。 docs.unity3d.com

uGUIのレイアウト UnityのCanvas上にImageやButtonを配置する際に一つずつ並べるのは面倒で、綺麗に並べるのもちょっと苦労します。 そんなときに役に立つのが、Horizontal Layout GroupとVertical Layout Groupです。 これらを持つオブジェクトの子になるUI要素を横や縦に並べるのに便利です。 UI.HorizontalLayoutGroup - Unity スクリプトリファレンス 子のレイアウト要素を並べてレイアウトします docs.unity3d.com UI.VerticalLayoutGroup - Unity スクリプトリファレンス 子のレイアウト要素を並べてレイアウトします docs.unity3d.com

TextMeshProについて TextMeshProについてと導入の手順についてはこちらをご覧ください。 【Unity】TextMeshProで日本語を扱う - GARNET LOG TextMeshProで日本語フォントを使うためのFontAsset作成手順と、文字化けや豆腐表示の対処法を解説。日本語対応に必要な設定がひととおりわかる。 GARNET LOG

スプライトアトラスとは？ スプライトアトラス（Sprite Atlas）とは、スプライトの地図という意味になります。 Unityでは、2D Spriteパッケージで提供されています。 複数のスプライトを一つのテクスチャにまとめることで、描画パフォーマンスを向上させるのに役立ちます。 スプライトアトラス V2 - Unity マニュアル Sprite Atlas (スプライトアトラス) システムの元のバージョン 1 では、テクスチャ (スプライトやテクスチャ内のスプライト、およびフォルダー内のスプライトからの) をアトラステクスチャにパックします。バージョン 1 は、再生モードに入るときや、プレイヤーやアセットバンドルをビルドするときに、これらのテクスチャをパックします。AssetDatabase V1 は依存関係を持つことができず、名前付きオブジェクトのインポーターサポートもありません。そのため、Unity はカスタムメカニズムを通じてスプライトアトラスをパックし、テクスチャとレンダリングデータの出力データを Library/AtlasCacheフォルダーに保存します。 docs.unity3d.com

ContentSizeFitterとは？ ContentSizeFitterは、UnityのUIシステムの一部で、 RectTransformのサイズを自動的に調整する機能を提供します。 これにより、テキストや画像などのUI要素が動的に変化する場合でも、UIのレイアウトが適切に保たれます。 Content Size Fitter - Unity マニュアル Content Size Fitter は自体のレイアウト要素のサイズを管理するコントローラーとして機能します。サイズはゲームオブジェクトの Layout Element コンポーネントの提供する Min や Preferred のサイズによって決まります。このようなレイアウト要素は Image、Text、Layout Group、Layout Element などのコンポーネントで定義されます。 docs.unity3d.com

ゲージとは ゲームを作っているとよくゲージを使う場面が出てきます。 格闘ゲームの体力の残量を示すゲージ アイテム効果の残り時間を示すゲージ 目標までの進捗具合を示すゲージ などなど。 今回は、UnityのuGUI向けに用意されているSliderを改造して簡易的にゲージを作ってみます。 UI.Slider - Unity スクリプトリファレンス 最小値と最大値の間を移動できる標準的なスライダー。 docs.unity3d.com

テキストの途中にスプライトを表示する ゲームを作っているとテキストの途中に画像を追加したい場合があります。 RPGで魔法の属性を表す画像を挿入したい 操作説明でボタンを表す画像を挿入したい ボタン上のテキストの前にアイコンを添えたい などです。 TextMeshProにはそのような機能もあります。