【Defold】Shader:最小限のコード

Defold, DEVELOP, Shader

最小限のSprite 用のシェーダープログラミングは何をしているのかを確認してみました。

Vertex Shader

(1)
uniform highp mat4 view_proj;
(2)
attribute highp vec4 position;
attribute mediump vec2 texcoord0;
(3)
varying mediump vec2 var_texcoord0;
void main()
{
    (4)
    gl_Position = view_proj * vec4(position.xyz, 1.0);
    (5)
    var_texcoord0 = texcoord0;
}
  1. ビュー行列、射影行列を乗算した定数
  2. 頂点の情報をシェーダー側で受け取る変数
  3. 頂点シェーダーとフラグメントシェーダーの橋渡し
  4. 頂点データ受け取り
  5. UV座標をフラグメントシェーダーに渡す

Fragoment Shader

(1)
varying mediump vec2 var_texcoord0;
(2)
uniform lowp sampler2D texture_sampler;
(3)
uniform lowp vec4 tint;
void main()
{
    (4)
    // Pre-multiply alpha since all runtime textures already are
    lowp vec4 tint_pm = vec4(tint.xyz * tint.w, tint.w);
    (5)
    gl_FragColor = texture2D(texture_sampler, var_texcoord0.xy) * tint_pm;
}
  1. 頂点シェーダーから受け取ったUV情報
  2. サンプリングされたテクスチャ。テクスチャデータ。
  3. 色情報。値はスクリプトから渡すことができる。
  4. カラー情報
  5. テクスチャデータとカラー情報を掛け合わせた結果を色として出力。

sprite.material

Vertex Constants

NameTypeValue
view_projViewproj0, 0, 0, 0

Fragment Constants

NameTypeValue
tintUser1, 1, 1, 1

まとめ

ひとつひとつ確認していけばシンプルで分かりやすいです。皆さんもDefold でシェーダーライフ、やってみませんか?

Posted by kazupon