9スライスを用いて綺麗に画像を拡大【Unity】【NGUI】

はじめに

例えばNGUIで以下の様な正方形の画像を

単純に横長にしてしまうと、以下の様にボケてしまいます。

こんな時に使えるのが9スライスで、これを使って横長にすると、

このように綺麗に出来ます！

9スライスとは

9スライスとは、以下のように画像を9分割し、分割した領域毎に拡大するといったものです。

例えば左上の領域は拡大をせず、真ん中上の領域は左右にのみ拡大をする

といった感じです。cocosやuGUI等にもある機能です。

9スライス設定方法

Inspector上でUISpriteのTypeをSlicedにすると

9スライス形式で拡大する事が出来ます。

その後、SpriteのEditボタンを押してUIAtlasの情報を開き、

Border内の数値を調整し、

下に写ってる点線を任意の位置に調整する事で分割領域を設定出来ます。

---