glslシェーダで2つのアルファテクスチャを合成する

Question

シェイダーで2つのテクスチャをPhotoshopのようなプログラムとまったく同じにしたいと思っています。つまり、階層化されているかのように、別のテクスチャの頂点にテクスチャがあります。 両方のテクスチャにはアルファが付き、には結果の出力に正しいアルファが含まれている必要があります。

目標はです。

ただし、式のグーグルにもかかわらず、正しい色を得ることができません。 ここで参照を使用する：（https://microsoft.github.io/Win2D/html/PremultipliedAlpha.htm）たとえば、

（グレー50％オーバーレイの音差）

シェーダコードをブレンドとしてこれを使用するlibgdxに設定されています。

context.setBlending(true,GL20.GL_SRC_ALPHA ,GL20.GL_ONE_MINUS_SRC_ALPHA);   

私はまっすぐgl_FragColorに入力テクスチャ（A）を渡した場合、その後、私はピクセル完璧な色の一致を得るためミスが、私のフラグメントシェーダブレンディング（上の画像内のコードを参照）であるかなり確信していますそのアルファを含むAの
;

gl_FragColor = backdiffuse;

が問題ありません。

=====

編集

アドバイスに続いて、私の代わりにpremulitipliedアルファを使用して試してみました。

context.setBlending(true,GL20.GL_ONE, GL20.GL_ONE_MINUS_SRC_ALPHA); 

しかし、これは私がlibgdxsが間違っブレンド設定アムシェーダは、単に出力A

backdiffuse = texture2D(u_backSample2D, vTexCoord);  
backdiffuse=backdiffuse*backdiffuse.a; //convert to premultiply  
gl_FragColor = backdiffuse; 

に設定されていても、間違った効果を生成しますか？これは明らかに明るすぎます。

---

ソリューション（受け入れ答えのおかげで）。

backdiffuse.rgb *= backdiffuse.a; //premultiply source 
v_backBackColor.rgb *= v_backBackColor.a; //premultiply source 

finalCol.rgb = backdiffuse.rgb + (v_backBackColor.rgb * (1 - backdiffuse.a));  
finalCol.a = backdiffuse.a + (v_backBackColor.a * (1.0 - backdiffuse.a)); 

Answer 1

あなたがプリマルチプライ済みアルファ方程式を使用したい場合は、適切なブレンドの方程式で画面に出力を描く必要があります。GL_ONE、GL_ONE_MINUS_SRC_ALPHA。

宛先アルファにもソースアルファを1つ乗算する必要があります。従って：

finalCol.a = backDiffuse.a + v_backBackColor * (1.0 - backDiffuse.a); 

あなたが現在使用しているより典型的な混合式を使いたい場合、シェーダの方程式はもっと複雑になります。 alpha compositing on Wikipediaを検索すると、それらを見つけることができます。ただし、事前乗算されたアルファは、スプライトのアンチエイリアス処理されたエッジで暗いまたは薄いフリンジを避けるため、好ましい形式です。