はなちるのマイノート

Unityをメインとした技術ブログ。自分らしくまったりやっていきたいと思いますー!

【Unity】フェードイン・アウトをShaderGraphで作ってみる

はじめに

今回ShaderGraphで作るフェードイン・アウトはこちら。

f:id:hanaaaaaachiru:20200830220415g:plain

結構簡単に作ることができるので、ShaderGraphの練習としても使えるかもしれません。

早速みていきましょう。

方針

alpha値を円形内を0,外を1とすることで再現をします。

前に記事を書いたのですが、円を書くためにはEllipse Nodeノードを使えば簡単に実現をすることができます。

f:id:hanaaaaaachiru:20191123232727p:plain

名前 入出力 タイプ 意味
UV 入力 Vector 2 入力するUVの値
Width 入力 Vector 1 楕円の幅
Height 入力 Vector 1 楕円の高さ
Out 出力 Vector 1 出力値

【Unity】ShaderGraphで色んな図形を作ってみる - はなちるのマイノート

このWidthHeightを動的に変更していけばOKというわけですね。

全体

f:id:hanaaaaaachiru:20200830215852p:plain

あとはスクリプトからプロパティー(円の半径)をいじることで完成になります。

さいごに

今回は円を使ってやりましたが、この考え方を応用すれば星であったり四角であったり色々なフェードイン・アウトを実現することができます。

是非自分好みなものを実装してみてください。

ではまた。