UnityのuGUIでフレームのみのボタンを作る

UnityのuGUIでフレームのみのボタンを作ります

■完成イメージ

■画像の用意
外枠のみが白で内側が透過されている画像を用意する
画像はサイズ32x32で縁幅がそれぞれ2ピクセル

■Unityの切り分け
画像をUnityへインポートしインスペクターからSprite2d(2D and UI)を選択する
その後、SpriteEditorを起動する

SpriteEditorでは以下のように設定する
Pivot: Center
L, R, T, B : 3
このようにすると　ボタンのサイズ、比率が変わっても縁が崩れないまま表示されるようになる

■ボタンへ反映
uGUIでボタンを作成、ボタンオブジェクトのImageにあるSourceImageに作成した画像を適用する

■色を変更する
ボタンのImageの色、子オブジェクトのTextの色を変更すれば好きな色のボタンを作成できる

■素材画像
白背景の白画像なので見づらいが、以下にはります
============

============