uGUIでのボタンの配置は大きく2通りありますが、どちらもそこまで難しくありません。
- Button コンポーネントを利用する
- イベントハンドラを実装する
Buttonコンポーネントを利用する
ButtonコンポーネントはAddComponentから設定できます。
ButtonにしたいGameObjectを選択して、AddComponent → UI → Button を選択します。
Buttonが追加されます。
Buttonの利用にはこのパラメータを環境に合わせて適切に設定するだけで利用可能です。
判定範囲
クリック判定の範囲はButtonコンポーネントが付いているGameObjectのRectTransformの矩形、もしくはPhysx2DのColliderの範囲です。
このあたりは以下の記事も参考にしてください。
各パラメータ
Interactable
ボタンが反応するかどうかの指定です。false(チェック外す)の場合は押すことができなくなり、Disabled状態になります。
Transition
ボタンを押下した時等のボタンの反応の設定です。
Target Graphicには反応させるImage等を指定します。デフォルトはButtonコンポーネントが付いているGameObjectです。
Buttonの判定と画像を分けたい時は別のGameObjectを指定できます。
Transitionの指定は以下のようになっています。
- Color Tint
- 頂点カラーの変化
- Sprite Swap
- 画像を差し替える
- Animation
- 設定されているAnimationのTriggerを起動する
Transitionに指定されたものを以下の各状態ごとで設定できます。
- Normal
- 通常時
- Highlight
- マウスオーバー時やフォーカス時
- Pressed
- 押下中
- Disabled
- Interactableがfalseの時
また、Color Tintの場合の表示色は「元の色 * 指定色 * ColorMultiplier」となり、Fade Duration秒かけて色が変化します。
Navigation
これはButtonに限らずユーザーが選択できるもののつながりを設定するものです。
例えばキーボードの上下左右を押した時にフォーカスがどのように移り変わるか、と言ったものを指定できます。
On Click
ここにボタンがクリック(タップ)された時の関数を指定します。
右下の+を押すことで、ヒエラルキー上のGameObjectとその中のコンポーネント(MonoBehaviour)に定義されている関数を指定できます。
上記画像のだと以下のような感じです。
using UnityEngine;
using System.Collections;
public class ButtonCallback1
: MonoBehaviour
{
public void OnClick()
{
Debug.Log( "OnClick1" );
}
public void OnClick2( string param )
{
Debug.Log( "OnClick2:" + param );
}
public void OnClick3( GameObject param )
{
Debug.Log( "OnClick3:" + param );
}
public void OnClick4( GameObject param, float value )
{
Debug.Log( "これは引数が多すぎて設定できない・・・" );
}
}
このスクリプトを適当なGameObjectに設定し、そのGameObjectをドラッグ＆ドロップすると関数が選択できます。
この関数にはいくつか制限があります。
- アクセス指定子はpublic
- 返り値はvoid
- 引数の数は0か1つ
- 引数の型はbool、int、float、string、Object(UnityEngineの)、Obejctを継承したもの
- 引数に渡すパラメータはEditor上で設定できるもの(可変しないもので設定する必要があり、例えばGameObjectのnameを設定といった使い方はできません)
- staticでも良い
- setプロパティでも良い
- この場合でも上記引数の型でなければいけません
という感じです。
イベントハンドラの実装
イベントハンドラを自分で実装する事もできます。
この際はボタンの見た目の変更といったButtonが提供していたクリック以外の部分は(必要なら)自分で実装する必要があります。
判定範囲
Buttonと同様にクリック判定の範囲はコンポーネントが付いているGameObjectのRectTransformの矩形、もしくはPhysx2DのColliderの範囲です。
というのもButtonはこのイベントハンドラを利用して作られているようです。
実装方法
実装にはMonoBehaivourを継承したクラスにUnityEngine.EventSystemsの中にある各イベントハンドラインターフェースを実装します。
クリックに反応するサンプルです。
using UnityEngine;
using UnityEngine.EventSystems;
public class ButtonCallback2
: MonoBehaviour
, IPointerClickHandler
{
public void OnPointerClick( PointerEventData eventData )
{
Debug.Log( "OnClick" );
}
}
このコンポーネントを設定すると、設定されたGameObjectがクリックされるとログが表示されます。
※その他の設定は基本的には必要ありませんが、EventSystemやRaycasterが存在しないとイベントが発生しません。これらは自分で消さなければ無いことは無いと思われます。
IPointerClickHandlerというのがイベントハンドラインターフェースの1つです。
この他にもイベントハンドラインターフェースには以下のものがあります。
- IBeginDragHandler
- IDragHandlerと一緒に利用します。
- IEndDragHandler
- IDragHandlerと一緒に利用します。
- IDragHandler
- ドラッグの開始(OnBeginDrag)、ドラッグ中(OnDrag)、ドラッグの終了(OnEndDrag)を検知します。
- ICancelHandler
- なんらかの入力のキャンセルを検知します。
- ISelectHandler
- 選択されたのを検知します。
- IDeselectHandler
- 選択されていたが、別のオブジェクトに選択が移ったのを検知します。
- IDropHandler
- ドラッグ＆ドロップされたのを検知します。
- IInitializePotentialDragHandler
- ドラッグ＆ドロップの対象が発見された場合に呼ばれます。(よくわからない)
- IMoveHandler
- フォーカスの移動を検知します。(Deselectとの違いはあまり良くわかりません。)
- IPointerClickHandler
- クリック(押下して離した)を検知します。
- IPointerDownHandler
- 押下されたのを検知します。
- IPointerEnterHandler
- マウスオーバー(ホバー)を検知します。
- IPointerExitHandler
- マウスオーバー状態から外れたのを検知します。
- IPointerUpHandler
- 離されたのを検知します。
- IScrollHandler
- ScrollView等でスクロールされたのを検知します。
- ISubmitHandler
- Enterキーを押す等何かが決定されたのを検知します。
- IUpdateSelectedHandler
- 選択中を検知します。
とたくさん用意されています。
これらのうち必要なものを実装することで、自由にイベント制御することができます。
クリックの定義
Unityでのクリックは
「あるオブジェクトを押し(クリックし)、同じオブジェクト上で指が離されたら」
となっているようです。
押した後オブジェクトからカーソルが上からずれた状態で離してもクリックイベントは発火しません。
ただ、押した後一度カーソルが上からずれた後、再度上に戻ってきて離すとイベントは発火します。
まとめると
以下はクリック判定です。
- オブジェクト上で押下し、そのまま離される
- オブジェクト上で押下し、一度ドラッグ(スワイプ)でオブジェクトの外に出るが、再度オブジェクト上に戻ってきて離される
以下はクリック判定ではありません。
- オブジェクトの上で押下し、ドラッグ(スワイプ)でオブジェクトの外に出て離される
- オブジェクトの外で押下し、ドラッグ(スワイプ)でオブジェクトの上に来てから離される
