FC2ブログ
ヽ|∵|ゝ(Fantom) の 開発blog? ホーム »uGUI
このページの記事一覧

【Unity】【C#】制限付きでテキストのサイズに合わせて他のオブジェクトのサイズも変化させる  


 ContentSizeFitter を使えば近い感じにもなるが、最小~最大みたいになると、レイアウトの入れ子になったり、オブジェクトを階層化しなくてはならなかったりと複雑になる気がするので、もっと簡単にできるものないかとググってみたら、やはり同じ様なものがあった

TextSizeAdjuster



 ただ試してみたら、ちょっと私が欲しい挙動と違ったので、元のスクリプトを参考に改造してみた。簡単に言えば「テキストの幅が最小~最大サイズまでは伸縮し、最大を超えたら折り返す」みたいにできるようにスクリプトに書き換えた。

 まぁ、自動レイアウトを駆使すれば同じことはできるかもしれないが、実は私も自動レイアウトは苦手なので、今回のスクリプト1つで簡単に実現できるのなら、それもアリかと(笑)。

【Unity】uGUIの自動レイアウトが分かりにくいと評判なので解説してみる

(※) Unity 2018.4.8f1 / Windows10(x64) で確認



■テキストのサイズに合わせて他のオブジェクトのサイズも変化させる(サイズ制限付き)

●TextSizeSync.cs
using UnityEngine;
using UnityEngine.UI;
#if UNITY_EDITOR
using UnityEditor;
#endif

/// <summary>
/// https://gist.github.com/iwashihead/db6e88e7de74f43c43fb9ebbd6769516
/// を改造
/// Text の preferredWidth / preferredHeight に合わせて
/// 他の RectTransform のサイズも変更する.
/// </summary>
[ExecuteInEditMode]
//[ExecuteAlways]
public class TextSizeSync : MonoBehaviour
{
//サイズを調整する方向
public enum AdjustMode
{
Width, Height, Both,
}
public AdjustMode adjustMode = AdjustMode.Width;

public bool alwaysAdjust = false; //Update でテキスト変化を検出

public Text referenceText; //サイズを参照するテキスト

public float minWidth = -1; //調整する最小幅 (※負で無視)
public float maxWidth = -1; //調整する最大幅 (※負で無視)
public float minHeight = -1; //調整する最小高 (※負で無視)
public float maxHeight = -1; //調整する最大高 (※負で無視)

//同期させるオブジェクトの余白(テキストサイズ+余白になる)
public RectOffset padding = new RectOffset();

//サイズを同期させるオブジェクト
public RectTransform[] syncRectTransforms = new RectTransform[0];


//Editor only
private void Reset()
{
if (referenceText == null)
referenceText = GetComponent<Text>();
}

//Editor only
private void OnValidate()
{
if (referenceText != null)
Adjust();
}

private void OnEnable()
{
if (referenceText != null)
Adjust();
}

// Use this for initialization
private void Start()
{
Adjust();
}

// Update is called once per frame
private void LateUpdate()
{
if (alwaysAdjust && IsTextChanged)
Adjust();
}

string _oldText;

//テキストの内容が変化したか?
public bool IsTextChanged {
get {
if (_oldText == null || _oldText != referenceText.text)
{
_oldText = referenceText.text;
return true;
}
return false;
}
}

//サイズの調整
public void Adjust()
{
switch (adjustMode)
{
case AdjustMode.Width:
AdjustWidth();
break;
case AdjustMode.Height:
AdjustHeight();
break;
case AdjustMode.Both:
AdjustBoth();
break;
}

AdjustSyncRectTransforms();
}


Vector2 _size = Vector2.zero;

//幅を調整
void AdjustWidth()
{
var w = ClampWidth(referenceText.preferredWidth);
var h = referenceText.rectTransform.sizeDelta.y;
_size.Set(w, h);
referenceText.rectTransform.sizeDelta = _size;
}

//高さを調整
void AdjustHeight()
{
var w = referenceText.rectTransform.sizeDelta.x;
var h = ClampHeight(referenceText.preferredHeight);
_size.Set(w, h);
referenceText.rectTransform.sizeDelta = _size;
}

//幅・高さの両方を調整
void AdjustBoth()
{
var w = ClampWidth(referenceText.preferredWidth);
var h = ClampHeight(referenceText.preferredHeight);
_size.Set(w, h);
referenceText.rectTransform.sizeDelta = _size;
}

//幅の制限
float ClampWidth(float w)
{
if (minWidth >= 0) w = Mathf.Max(minWidth, w);
if (maxWidth >= 0) w = Mathf.Min(maxWidth, w);
return w;
}

//高さの制限
float ClampHeight(float h)
{
if (minHeight >= 0) h = Mathf.Max(minHeight, h);
if (maxHeight >= 0) h = Mathf.Min(maxHeight, h);
return h;
}

//他の RectTransform のサイズ同期(余白付き)
void AdjustSyncRectTransforms()
{
var w = ClampWidth(referenceText.preferredWidth);
var h = ClampHeight(referenceText.preferredHeight);

foreach (var rt in syncRectTransforms)
{
var x = rt.sizeDelta.x;
var y = rt.sizeDelta.y;
switch (adjustMode)
{
case AdjustMode.Width:
x = padding.left + w + padding.right;
break;
case AdjustMode.Height:
y = padding.top + h + padding.bottom;
break;
case AdjustMode.Both:
x = padding.left + w + padding.right;
y = padding.top + h + padding.bottom;
break;
}
_size.Set(x, y);
rt.sizeDelta = _size;
}
}
}


#if UNITY_EDITOR
//※エディタ用
//OnValidate() では他のコンポーネント変化が検知できないので、
//インスペクタの更新で変化をチェックする
[CustomEditor(typeof(TextSizeSync))]
public class TextSizeSyncEditor : Editor
{
public override void OnInspectorGUI()
{
base.OnInspectorGUI();

var obj = target as TextSizeSync;
if (obj.IsTextChanged)
{
obj.Adjust();
}
}
}
#endif

 色々付け加えたので長くなった(笑)。まぁ、少し古いバージョン(.NET3.5)でも対応できるようにしてるせいもあるけどね。
"[ExecuteInEditMode]" なんかもいつの間にか "[ExecuteAlways]" になったらしいしね。

 使い方は、参照する Text と同じ GameObject にアタッチし、変化させたいオブジェクトを syncRectTransforms に登録するだけだ。あとは最小~最大サイズや余白を設定しておく。






●例えば以下のようタグを囲むのに使っている


※ただし、レイアウトの計算は同じフレーム内では上手く反映されないので、1フレーム遅らせて反映させた方が確実。



 ちなみに、gif アニメの ContetnSizeFitter と TextSizeAdjuster の設定は以下のようになる。



●ContentSizeFitter ① を使い、LayoutElement で MinWidth を設定





●ContentSizeFitter ② を使い、LayoutElement で MinWidth, PereferedWidth を設定





●TextSizeAdjuster と ContentSizeFitter を使う

TextSizeAdjuster






 まぁ、自動レイアウトを極めれば色々できるかも知れないが、とにかく組み合わせを考えるのが大変なので、何重にもレイアウトの入れ子になるくらいなら、簡単なスクリプトを作るのも1つの手かも知れない(笑)。

【Unity】uGUIの自動レイアウトが分かりにくいと評判なので解説してみる
【Unity】逆引き自動レイアウトのトレーニング。UIをLayoutGroupで並べる
逆引き、UnityのuGUIのレイアウトトレーニング(uGUI RectTransform入門その2)






(関連記事)
【Unity】【C#】RectTransform の矩形の実座標を取得する
【Unity】【C#】uGUI ドロップダウンの要素をコードで設定と取得、外観のカスタマイズなど
【Unity】【C#】インスペクタの表示項目を動的に変更する
【Unity】【C#】独自のギズモ(Gizmo)を表示する


関連記事
スポンサーサイト



category: Unity

thread: ゲーム開発

janre: コンピュータ

tag: Unityライブラリ  Unityリファレンス  uGUI 
tb: 0   cm: --

【Unity】【C#】RectTransform の矩形の実座標を取得する  


 ちょっとパネルのドラッグ機能を付けたときに必要だったので、備忘録的にメモ。


 特にスマホなどは解像度によって見た目の大きさと実際のピクセルサイズが違うので、動的に取得する必要があった。調べたらすぐにわかったが、視覚的な解説が無かったので、簡単に書いてみた。

(※) Unity 2018.2.1f1 / Windows10(x64) で確認


●RectTransform の矩形の実際の座標を取得する
using UnityEngine;

public class Sample : MonoBehaviour {

public RectTransform target;

//RectTransform の矩形の実座標を Rect にして返す
public Rect GetRect(RectTransform rt)
{
Vector3[] corners = new Vector3[4];
rt.GetWorldCorners(corners);
return new Rect(corners[0], corners[2] - corners[0]);
}

//Rect 型にして、左下-右上座標を表示
void DisplayRect()
{
Rect rect = GetRect(target);
Debug.Log("(" + rect.xMin + ", " + rect.yMin + ") - ("
+ rect.xMax + ", " + rect.yMax + ")");
}

//4コーナー(左下, 左上, 右上, 右下)座標を表示
void DisplayCorners()
{
Vector3[] corners = new Vector3[4];
target.GetWorldCorners(corners);

for (var i = 0; i < 4; i++)
{
Debug.Log("corners[" + i + "] : " + corners[i]);
}
}

// Use this for initialization
private void Start () {
if (target == null)
target = GetComponent();

DisplayCorners();
DisplayRect();
}
}

corners[0] : (460.0, 240.0, 0.0)
corners[1] : (460.0, 480.0, 0.0)
corners[2] : (820.0, 480.0, 0.0)
corners[3] : (820.0, 240.0, 0.0)
(460, 240) - (820, 480)

 RectTransform.GetWorldCorners() は画面の左下を(0, 0)、右上が解像度の最大座標として、[0]:左下, [1]:左上, [2]:右上, [3]:右下 の座標を返す。


 この例では Canvas の設定が「Canvas Scaler」で「UI Scale Mode>Scale With Screen Size」, 「Reference Resolution>800x600 となっていて、パネルのサイズは 300x200 となっている。また、画面解像度は 1280x720 になっているときの値だ。


 ちなみに画面解像度を 2560x1440 にすると以下の値となる。
corners[0] : (920.0, 480.0, 0.0)
corners[1] : (920.0, 960.0, 0.0)
corners[2] : (1640.0, 960.0, 0.0)
corners[3] : (1640.0, 480.0, 0.0)
(920, 480) - (1640, 960)

 また、DisplayCorners() は公式のサンプルそのものだが、ちょっと手を加えて Rect 型で返す関数を GetRect() としても定義しておいた。矩形領域だけなら [0]:左下 - [2]:右上 の座標だけでも十分なことも多いからだ。


 冒頭に書いたパネル上での使用方法は、パネルをロックしたときに、パネル外ではカメラ回転、パネル内では無視するために座標を取っている(パネル上でマウスでカーソル合わせたりして、動かすたびにカメラが回転するのは鬱陶しいので(笑))。

 私はエクスプローラからのファイルドラッグ&ドロップにも対応しているが、UIの矩形座標を取れば、ドロップした先で処理を分岐するのも可能だろう。色々使える気がする(笑)。






(関連記事)
【Unity】【C#】制限付きでテキストのサイズに合わせて他のオブジェクトのサイズも変化させる
【Unity】【C#】uGUI ドロップダウンの要素をコードで設定と取得、外観のカスタマイズなど
【Unity】VRM(VRoid)をライブステージで踊らせるアプリを作ってみた


関連記事

category: Unity

thread: ゲーム開発

janre: コンピュータ

tag: Unityリファレンス  uGUI 
tb: 0   cm: --

【Unity】【C#】UI-Text 版 FPS(フレームレート)をリアルタイムに測定して表示する  


 以前に作ったレガシーGUI を uGUI(UI.Text)に移植しただけのもの。

 StandardAssets には「FPSCounter」という FPS測定ライブラリも入っているが、ソースを見てみると、一定間隔の平均を求めてるようなので、できればリアルな(平均でない)値を見たいと思って、わざわざ移植した(と言ってもほとんどまるっとコピーだが(笑))。

(※) Unity 5.6.3p1 - 2018.2.1f1 / Windows10(x64) で確認



●UI-Text 版 リアルタイムにFPSを測定して表示する
using System.Text;
using UnityEngine;
using UnityEngine.UI;

// FPS 測定値を UI-Text に表示する
// http://fantom1x.blog130.fc2.com/blog-entry-307.html
public class FpsText : MonoBehaviour {

public Text targetText; //表示する UI-Text
public string displayFormat = "{0:F1} FPS"; //表示フォーマット(F0 とすれば小数点以下は無くなる)

//測定用
int tick = 0; //フレーム数
float elapsed = 0; //経過時間
float fps = 0; //フレームレート

StringBuilder sb = new StringBuilder(16);

// Use this for initialization
private void Start () {
if (targetText == null)
targetText = GetComponentInChildren<Text>();
}

// Update is called once per frame
private void Update () {
tick++;
elapsed += Time.deltaTime;
if (elapsed >= 1f) {
fps = tick / elapsed;
tick = 0;
elapsed = 0;

if (targetText != null)
{
sb.Length = 0;
sb.AppendFormat(displayFormat, fps);
targetText.text = sb.ToString();
}
}
}
}

 使い方は UI の Text などにアタッチし、targetText に表示する Text をセットすれば完了だ(未セットでも子要素までは自動で探す)。

 測定(計算)方法は Update() による Time.deltaTime で集計した単位時間あたりのフレーム数である。あくまでもフレーム更新での測定なので、現実時間に近い測定(連続した時間)にしたいなら Time.realtimeSinceStartup で測定するのも良いだろう(StandardAssets の FPSCounter は Time.realtimeSinceStartup での測定)。

 実は色々な FPSカウンターを見てみると、測定(計算)方法はまちまちなので、用途に合わせた選択をした方が良いだろう。例えば StandardAssets の「FPSCounter」では連続的な時間での平均的な fps 測定に、今回の「FpsText」では一定更新毎(連続的というより、更新約1秒ごとにフレーム数を測定という感じ)の測定には向いてるかも知れない。具体的に言えば、平均化されてる場合は、もたったりして、ある程度バラついてもフラットな値になるが、平均化されてない場合は、もたったりしてる瞬間は値が激変する。自分がどちらの値を欲してるかで決めれば良い。

 以前の記事にも書いたが完全にフレームごとの超詳細な測定をしたいなら、毎フレーム「1f / Time.deltaTime」で計算する方法もある。ただしこの場合、ほんの僅かなもたりでも(人間の感覚ではわからないくらい小さいものでも)値として出るので、通常使う分には向いてないかも知れない(また、物凄く更新が速いため、見づらいという欠点もある)。仕様はケースバイケースで合わせた方が良いだろう。


※この記事のスクリプトはプラグインのライブラリにも同梱されています。


※とりあえず試してみたい方には、最新版をビルドした apk デモをダウンロードできます。動作確認にもどうぞ。

プラグインデモをダウンロード
(Google Drive を利用)


Android 4.2以上
※「提供元不明アプリのインストール」許可が必要です。


(関連記事)
【Unity】【C#】FPS(フレームレート)をリアルタイムに測定して表示する
【Unity】【C#】FPS(フレームレート)をリアルタイムに測定して表示するv2(4隅選択可能で、画面サイズの変更にも対応版)


関連記事

category: Unity

thread: ゲーム開発

janre: コンピュータ

tag: Unityライブラリ  uGUI 
tb: 0   cm: --

【Unity】5.6 の Canvas の警告:Shader channels Normal and Tangent are most often used with lighting~ を消す  


 ただのメモ。Unity5.6 にアップグレードしたら Canvas に警告が出るようになった。とりあえず英文を翻訳にかけて、試してみたら警告が消えたので記録。


(※) Unity 5.6.0f3 / Windows10(x64) で確認

●インスペクタの警告
Shader channels Normal and Tangent are most often used with lighting, which an Overlay an Overlay canvas does not support. Its likely these channels are not needed.

●Google翻訳
シェーダのチャンネルNormalとTangentは、OverlayとOverlay canvasがサポートしていないライティングで最もよく使用されます。 その可能性が高いこれらのチャネルは必要ありません。

●対処法
・「Additional Shader Channel」の「Normal」と「Tangent」のチェックを外す(※「Nothing」でも良い)。



(関連記事)
【Unity】アイコン画像のフォーマット警告:Compressed texture XXX is used as icon. This might compromise visual quality of~ を消す
【Unity】InitializeUnityExtensions: Must have a valid path for the plugin [XX] (XX:番号) というエラーの修正方法
【Unity】【C#】AssetBundleManager を WebGL で使う・エラー対処法
【Unity】"~\Temp\Assembly-CSharp.dll.mdb" is denied. と出たら…


関連記事

category: Unity

thread: ゲーム開発

janre: コンピュータ

tag: Unityトラブルシューティング  uGUI 
tb: 0   cm: --

【Unity】【C#】uGUI ドロップダウンの要素をコードで設定と取得、外観のカスタマイズなど  


 どちらかというと備忘録。調べているとき色々な方法があったので、少しまとめておいた感じ。どのやり方でも違いはないので、用途によって使いやすい方を選べば良いと思う。

※ Unity 5.5.0f3 / Windows10(x64) で確認




■ドロップダウンの要素をコードで設定する

 まずはドロップダウンを画面に置いてしまおう。「GameObject」メニューから「UI>Dropdown」で「Canvas」以下に生成される。インスペクタで下の方へスクロールして見てみると、予め3つの要素が設定されている。これをコードで変更することになる。なお、GUI 関連をシーンビューで見るときは、「2D」のボタンをオンした方が見やすいかも知れない。







 要素を設定するコードは以下のようになる。インスペクタで操作するドロップダウンオブジェクトを設定して、スクリプトで変更する感じだ。「using UnityEngine.UI」を入れて置いた方が簡潔だろう。なお、クラス名は任意で良い。

●要素を文字列のリストで設定する
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

public class DropdownTest : MonoBehaviour {

public Dropdown dropdown; //操作するオブジェクトを設定する

// Use this for initialization
void Start () {
if (dropdown) {
dropdown.ClearOptions(); //現在の要素をクリアする
List<string> list = new List<string>();
list.Add("1");
list.Add("2");
list.Add("5");
dropdown.AddOptions(list); //新しく要素のリストを設定する
dropdown.value = 1; //デフォルトを設定(0~n-1)
}
}
}

 このスクリプトを適当なオブジェクトにアタッチして、操作するオブジェクトをドラッグ&ドロップで設定しておく。今回は「Canvas」にアタッチしてあるが、どこでも良い。プレイして「Dropdown」をインスペクタで見てみると要素が変わっていることがわかる。なお、デフォルトの値(value)は要素の先頭を0とした連番となっている。ここでは2番目([1])の要素を設定している。



●プレイ中




 もう1つ、直接プロパティに設定する方法もある。内容的には上記の例と同じものだが、追加するリストには「Dropdown.OptionData」クラスの要素を使う。リストの内容はこの形式で保持されていると考えれば良いだろう。

●要素を「Dropdown.OptionData」のリストに直接設定する
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

public class DropdownTest : MonoBehaviour {

public Dropdown dropdown; //操作するオブジェクトを設定する

// Use this for initialization
void Start () {
if (dropdown) {
dropdown.options.Clear(); //現在の要素をクリアする
dropdown.options.Add(new Dropdown.OptionData("1"));//新しく要素を追加する
dropdown.options.Add(new Dropdown.OptionData("2"));
dropdown.options.Add(new Dropdown.OptionData("5"));
dropdown.value = 1; //デフォルトを設定(0~n-1)
//dropdown.RefreshShownValue();//更新を確認(画像を設定したとき)
}
}
}

 こちらを使った場合はアイコン画像(Sprite)なども一緒に設定できる。以下に資料を載せておくので必要があれば参照して欲しい。「Dropdown.RefreshShownValue()」は画像も更新したときは必要になるようだ。文字列だけなら無くても構わない。

(参考)
Unity5のドロップダウンのオプション値をスクリプトで設定する




■ドロップダウンの要素を取得する

 次に設定した要素を取得してみよう。今回は値(value)とテキストを取得することにする。ちなみに値の方は先頭からの連番(0~n-1)になる。

 この場合はコールバックイベントの「Dropdown.onValueChanged(int)」が使える。まずはスクリプトを用意して、「+」ボタンを押してインスペクタに設定しよう。なおここでは「DropdownTest」スクリプトは「Canvas」オブジェクトにアタッチしてあるものとする。

●「OnValueChanged(int)」コールバックを使って要素を取得する
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

public class DropdownTest : MonoBehaviour {

public Dropdown dropdown; //操作するオブジェクトを設定する

// Use this for initialization
void Start () {
if (dropdown) {
dropdown.ClearOptions(); //現在の要素をクリアする
List<string> list = new List<string>();
list.Add("1");
list.Add("2");
list.Add("5");
dropdown.AddOptions(list); //新しく要素のリストを設定する
dropdown.value = 1; //デフォルトを設定(0~n-1)
}
}

public void OnValueChanged(int value) {
Debug.Log("value = " + value); //値を取得(先頭から連番(0~n-1))
Debug.Log("text(options) = " + dropdown.options[value].text); //リストからテキストを取得
Debug.Log("text(captionText) = " + dropdown.captionText.text); //Labelからテキストを取得
}
}


 プレイしてドロップダウンを変更してみると値がコンソールにデバッグ表示される(はじめの1回はデフォルト設定の変更のため。0からならデフォルト設定は必要ない)。


 値(連番)ではなくて、直接選択されたテキストを使いたいときもあるだろう。この場合は大まかに2つの方法がある。1つは上記のドロップダウンに設定したリストを取得する方法と、選択したときに表示されるラベルを取得する方法だ。


 内容的にはリストの方は設定した値を取得しているだけなので説明はいらないと思うが、「Label」からというのはヒエラルキーで「Dropdown>Label」と開くと、このオブジェクトに選択したテキストが設定されているのがわかるからだ。「Dropdown.captionText」はそのテキストを保持しているオブジェクトと考えれば良いだろう。




■ボタンを押したとき、ドロップダウンの要素を取得する

 まずはドロップダウンがある状態から、「GameObject」メニューの「UI>Button」でボタンを追加しよう。このボタンを押したとき、選択されているドロップダウンの要素を取得するようにする。基本的には今までの方法と変わらない。取得タイミングをボタン押下にしただけだ。

 ボタンには「Button.onClick()」というコールバックが標準で備わっている。ドロップダウンのときと同じようにスクリプトを用意して、「+」ボタンを押してインスペクタで設定しよう。先のドロップダウンの例をそのまま使うなら、以下のようになる。


●「OnClick()」コールバックを使って要素を取得する
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

public class DropdownTest : MonoBehaviour {

public Dropdown dropdown; //操作するオブジェクトを設定する

// Use this for initialization
void Start () {
if (dropdown) {
dropdown.ClearOptions(); //現在の要素をクリアする
List<string> list = new List<string>();
list.Add("1");
list.Add("2");
list.Add("5");
dropdown.AddOptions(list); //新しく要素のリストを設定する
dropdown.value = 1; //デフォルトを設定(0~n-1)
}
}

public void OnClick() {
Debug.Log("dropdown.value = " + dropdown.value); //値を取得(先頭から連番(0~n-1))
Debug.Log("text(options) = " + dropdown.options[dropdown.value].text); //リストからテキストを取得
Debug.Log("text(captionText) = " + dropdown.captionText.text); //Labelからテキストを取得
}
}

 この例のようにドロップダウンの初期化とボタンの操作を1つのクラスで管理する場合は上記のやり方で十分だが、別々のクラスで管理したいときはどうすれば良いのだろうか。もちろん同じように操作するオブジェクトを設定させても良いが、コールバックのオーバーロードをすればもう少し簡潔に書くこともできる。

●コールバックのオーバーロードを使って要素を取得する
(初期化のみのクラス「DropdownTest」)
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

public class DropdownTest : MonoBehaviour {

public Dropdown dropdown; //操作するオブジェクトを設定する

// Use this for initialization
void Start () {
if (dropdown) {
dropdown.ClearOptions(); //現在の要素をクリアする
List<string> list = new List<string>();
list.Add("1");
list.Add("2");
list.Add("5");
dropdown.AddOptions(list); //新しく要素のリストを設定する
dropdown.value = 1; //デフォルトを設定(0~n-1)
}
}
}

(要素の取得のみのクラス「ButtonTest」)
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

public class ButtonTest : MonoBehaviour {
//OnClick のオーバーロード
public void OnClick(Dropdown dropdown) {
Debug.Log("dropdown.value = " + dropdown.value); //値を取得(先頭から連番(0~n-1))
Debug.Log("text(options) = " + dropdown.options[dropdown.value].text); //リストからテキストを取得
Debug.Log("text(captionText) = " + dropdown.captionText.text); //Labelからテキストを取得
}
}

 この「ButtonTest」を例えばボタンにアタッチし、要素を取得するドロップダウンをインスペクタで設定すれば、スクリプトはかなり簡潔になる。ドロップダウンの状態は「Dropdown」オブジェクトが保持しているわけだから、これを引数にして直接渡してしまえば良いわけだ。もちろん「Label」オブジェクトを引数にするのもアリだろう。





●プレイ中にボタンを押すと…




■uGUI の見た目を変更する(簡易的な外観のカスタマイズ)

 一番簡単な方法として、各オブジェクトの「Image>Source Image」を入れ替えれば良い。試しに Asset Store (Ctrl-9) から「Cartoon UI Pack」をインポートして使ってみよう。キーワードに「Cartoon UI」を入れて「無料のみ」のボタンを押せば簡単に見つかる。


 インポートし終わったら、あとは適当なものを選ぶだけだ。好きなものを設定してみよう。見た目が変わったハズだ。




 また、ボタンをハイライトしたときの色などの設定は「Highlighted Color(ハイライト)」「Pressed Color(押したとき)」「Disabled Color(無効化のとき)」を変更すれば良い。好きな色を設定してみよう。



 他にも細かい設定ができるようなので参考URLを載せておこう。色々試してみると良いだろう。

(参考)
【Unity】uGUIドロップダウンメニュー(コンボボックス)の使い方
【Unity開発】uGUIのDropDownの使い方【ひよこエッセンス】






(関連記事)
【Unity】【C#】制限付きでテキストのサイズに合わせて他のオブジェクトのサイズも変化させる
【Unity】【C#】【JavaScript】4.6.x の Canvas~UI Text のテキストをコードで変更する
【Unity】【C#】【JavaScript】GUIText をコードで生成する


関連記事

category: Unity

thread: ゲーム開発

janre: コンピュータ

tag: Unityリファレンス  uGUI  サンプル 
tb: 0   cm: --


プロフィール

Social

検索フォーム

全記事一覧

カテゴリ

ユーザータグ

最新記事

リンク

PR

▲ Pagetop