丸いフチを描くシェーダー

 UnityのUIで円形のイメージを取り扱うのは
意外と面倒な作業です。

ビットマップは拡大や縮小でサイズを変更すると
どうしても画像がボケてしまいます。

その理由で、UIで使うビットマップイメージは
できれば元本サイズで描画するようにしています。

特に、丸いフチの四角形はUIで良く使われる形なので
角の半径によって複数サイズのイメージを
用意しないといけないのが面倒くさいです。

サイズ関係なくキレイな円を描く方法はないのか?

それで調べた結果、良いものを見つけました。


Unity-UI-Rounded-Corners

イメージの角を丸く描画するシェーダー

Github URL : https://github.com/kirevdokimov/Unity-UI-Rounded-Corners


シェーダーを使って半径を設定するとイメージの
角を丸く描きます。

特にuGUIと相性が良くて、既存Imageの機能と
競合しないのが素晴らしいです。

UnityEngine.UI.Buttonへ適用した姿


このシェーダーの面白い機能は、各角ごとに
それぞれ半径を設定することです。

半円形のUI構成する時に助かります。

これで一つ悩みが解決されてスッキリしました。

素敵なシェーダーを作ってくれた製作者に感謝

コメント