(:3[kanのメモ帳]

個人ゲーム開発者kan.kikuchiのメモ的技術ブログ。月木更新でUnity関連がメイン。

(:3[kanのメモ帳]


本ブログの運営者kan.kikuchiが個人で開発したゲームです!

    

ボタンの当たり判定(タッチ範囲)だけ広げる【Unity】【uGUI】


このエントリーをはてなブックマークに追加


この記事でのバージョン
Unity 5.3.4f1 Personal


はじめに

UIを作っていて、ボタンの当たり判定を見た目より大きくしたい、

なんて事はよくあります。


しかし、uGUIのボタンは当たり判定==画像となっているため、

そのまま使うと、当たり判定だけを大きくするという事は出来ません。

Unityのボタンは画像の範囲でクリック判定を行います。
この範囲は基本的にGraphicクラスが表示されている範囲に適応されます。
要するに「画像が表現されている範囲(の四角)」に適応されます。


じゃあどうするのかと言えば、上記の記事にもある通り、

見えないGraphicクラスを作成し、それをボタンに重ねることで

ボタンのタッチ範囲(当たり判定)だけを広げる事ができます。


------------追記------------

Unity2020.1からはRaycastPaddingという機能が追加され、

簡単に当たり判定だけ変えられるようになりました!



------------追記おわり------------


InvisibleGraphic

さっそくコードです!



このInvisibleGraphicをボタンの子に設定する事で、

ボタンの当たり判定がInvisibleGraphicの大きさと同じになります。


f:id:kan_kikuchi:20160512134502g:plain


処理内容は単にOnPopulateMesh内で、メッシュの頂点を消し、

表示されないようにしているだけです。

UI 要素が頂点を生成する必要があるときのコールバック関数

http://docs.unity3d.com/ja/current/ScriptReference/UI.Graphic.OnPopulateMesh.html


おわりに

今回の方法はボタンの当たり判定を大きするだけで小さくは出来ない方法でした。

当たり判定を小さくするにはICanvasRaycastFilterを使うそうです。

この当たり判定の範囲を絞るには、ICanvasRaycastFilterを使用します。この範囲を設定することで、実際に当たり判定が発生する範囲を限定することができます。