シェーダー基礎
教材一覧

Appearance

改訂前の参考解説

このページは改訂前の教材です。現在の授業の回番号・内容は、後期の授業計画で確認してください。

第15回 補間・UV・テクスチャと色

3 / 4 Textureの入力とUV・Tintの設定 ​

このステップの目的

Materialの入力欄とHLSLの宣言を用意してから、UVによる参照と色の乗算を追加します。

MaterialにTextureとTintの入力欄を作る ​

編集するファイルはTextureTint.shaderです。現在はUVを赤と緑で表示しています。最初に、ShaderLabのShader直下、SubShaderの前へPropertiesを追加します。

shaderlab
Shader "Course/TextureTint"
{
    Properties
    {
        _BaseMap ("Texture", 2D) = "white" {}
        _Tint ("Tint", Color) = (1, 1, 1, 1)
    }

    SubShader

PropertiesはMaterialのInspectorに表示する入力欄です。_BaseMapと_Tintはコードで参照する名前、括弧の最初の文字列は表示名です。保存し、MaterialのTexture欄に練習画像を割り当てます。Tintは白にします。この時点ではUVの色表示が続きます。

HLSLに参照するデータを宣言する ​

Textureは格子状に保存した色などのデータ、Samplerは範囲外や画素の間をどう読むかを決めるものです。前期で変更したWrap Mode・Filter Modeが、この読み方へ関係します。

HLSLPROGRAM内のVaryings宣言の閉じ括弧と、Vert関数の間へ、次の宣言を追加します。

hlsl
    float2 uv : TEXCOORD0;
};

TEXTURE2D(_BaseMap);
SAMPLER(sampler_BaseMap);

CBUFFER_START(UnityPerMaterial)
    float4 _BaseMap_ST;
    float4 _Tint;
CBUFFER_END

Varyings Vert(Attributes input)

TEXTURE2DとSAMPLERは、Core.hlslから利用できる宣言用のマクロです。UnityPerMaterialはMaterialごとの数値をまとめるConstant Bufferです。Textureそのものをこの数値領域へ入れるのではなく、倍率・移動量・Tintの数値を宣言します。

_BaseMap_STのxyはTiling、zwはOffsetです。UnityはMaterialのTexture設定をこの名前で渡します。Inspectorの入力欄とHLSLの名前が一致していることを確認してください。

UVからTextureを読む ​

宣言を追加した後、Frag関数の本文を次の二行へ置き換えます。引数のVaryings inputとSV_Targetは残します。

hlsl
float4 color = SAMPLE_TEXTURE2D(_BaseMap, sampler_BaseMap, input.uv);
return color;

SAMPLE_TEXTURE2Dの入力はTexture、Sampler、読むUVです。UVの色表示で確認した値を、今度は画像を読む位置に使います。保存し、Consoleのエラーがなく、練習画像がQuadへ表示されることを確認します。画像が表示されなければ、MaterialのTexture欄とUVの受け渡しへ戻ります。

TilingとOffsetの適用 ​

Vert関数のoutput.uv = input.uv;を、次の一行へ置き換えます。同じメンバーへ二重に代入する行を残さないでください。

hlsl
output.uv = input.uv * _BaseMap_ST.xy + _BaseMap_ST.zw;
  • input.uv：元のUV
  • _BaseMap_ST.xy：倍率
  • _BaseMap_ST.zw：移動量

元UV=(0.25,0.5)、Tiling=(2,1)、Offset=(0.1,0)なら(0.6,0.5)を読みます。MaterialでTilingだけを変更して保存し、次に元へ戻してOffsetだけを変えます。

読んだ色とTintの乗算 ​

Fragのreturn color;をreturn color * _Tint;へ置き換えます。Textureを読む行はそのまま残します。

hlsl
float4 color = SAMPLE_TEXTURE2D(_BaseMap, sampler_BaseMap, input.uv);
return color * _Tint;

白(1,1,1,1)は元の色を保ち、赤(1,0,0,1)は緑と青の成分を0にします。Tintを赤へ変更する前に、練習画像の青い部分がどうなるか予想してください。変更後は白へ戻して確認します。

Tiling=(1,1)、Offset=(0,0)、Tint=白で保存します。次のステップでは同じ計算をShader Graphと比べます。

チェックリスト
  • PropertiesとHLSLの宣言を先に追加し、名前を照合した。
  • UVの表示からTextureの表示へ切り替えられた。
  • Tiling・Offset・Tintを一つずつ変え、結果を予測できる。
  • 基準のTiling・Offset・Tintへ戻した。