Spriteでワイプエフェクトを作成した (360度編)
Unityで画像を表示する方法に、Sprite RendererとuGUIのImageがあります。
ImageコンポーネントにはImage Typeという項目があり、
これを使うことで簡単にワイプエフェクトを作ることができます。
docs.unity3d.com
しかしSprite RendererにはこのImage Typeの項目はありません。
今回私はSpriteで360°ぐるっとワイプを行うエフェクトを作りたかったので、
そのようなシェーダーを書いてみました。
こちらの記事を参考に、今回の目的に合うように改造させていただきました。
qiita.com
動きはこんな感じです。
SpriteでImageのImage Type: Filledの動きを模倣できるようにしてみた。左がSpriteで右がImage。いい感じだ... pic.twitter.com/RFLDe9Z9OP
— きり (@KiliWare) October 27, 2018
マテリアルのプロパティからワイプエフェクトの値を設定できます。
・FillAmount: 表示する画像の量
・Clockwise: 時計回りかどうか
・FillFromX(Y): ワイプをどこから開始するかのXとYの位置
FillFromX(Y)は-1~1の値を取り、
設定することでワイプの開始位置を定めることができます。
FillFromXを0, FillFromYを-1のようにすると
ImageのFillOrigin: Bottomと同じ開始位置になります。
詳しい使い方はこちらのプロジェクトを参考にしてください。
github.com
