【Unity】基本的なUVスクロールのやり方【Shader Graph】

はじめに
UVスクロールのやり方
おわりに

はじめに

今回はShader GraphでのUVスクロールのやり方を扱っていきます。基礎中の基礎的な内容なのですが、何かと必要になる機会があると思いますし、私自身まだまだShader Graphの機能を使いこなせていないので、勉強も兼ねてまとめていきます。

UVスクロールのやり方

使用環境

・Unity2022.3.31f1
・URP

・基本的なUVスクロールのノード組み合わせ

まずはUVスクロールのベースとなるノードの組み合わせを以下に載せます。

＜使用ノード＞
・Sample Texture 2D
・Tilling And Offset
・Time
＜追加プロパティ＞
・Texture2D（記事では「_MainTex」と命名）
上の画像のようにノードを組み合わせることで、設定したテクスチャが右上から左下へスクロールするようになります。

・X方向またはY方向にスクロール

UVを横方向（X）または縦方向（Y）にスクロールするには、先ほど紹介したノードの組み合わせを以下のように変更することで実現できます。

横方向にスクロールさせるなら、TimeノードをVector2ノードのＸに、縦方向にスクロールさせるならＹに繋げます。

・スクロールのスピードを変更する

スクロールのスピードを変更するには以下のようにノードを組みます。

スクロールのスピード調整をインスペクターで行うために、Black BoardにFloat型のプロパティを追加します。Multiplyノードを追加し、入力側にTimeと追加したFloat型のプロパティを繋げます。あとは、Multiplyノードの出力側をOffsetに繋げば完成です。

以下に異なるスピードのUVスクロール例を載せておきます。

なお、スクロールのスピードを可変させつつ、スクロール方向を横か縦にする場合は、MultiplyノードとTiling And Offsetノードの間にVector2ノードを追加し、スクロールさせたい方向に応じて、MultiplyノードとVector2ノードを繋ぎ変えればＯＫです。

・スクロール方向を反転させる

スクロールの方向を反転させるには、以下のようにノードを組みます。

Branchノードを追加し、Trueの値を「-1」、Falseの値を「1」に設定します。またBlack BoardにBoolean型のプロパティを追加します（記事内では「Reverse」と命名）。
プロパティを追加したら、BranchノードのPredicateにBoolean型のプロパティを接続します。

その後Multiplyノードを使い、TimeとBranchの出力を乗算し、乗算結果をOffsetに繋げば完成です。