OpenGL ES Shaderで2D画像の輪郭を整える

Question

OpenGL 2.0を使用して2DのiOSゲームを作成していますが、画像を輪郭描写するシェーダを書くことができるかどうかは疑問です。すべての画像は2Dスプライトです。アウトラインのために見たシェーダの例は3Dオブジェクト用ですので、2D画像で可能かどうかはわかりません。

Answer 1

エッジ検出フィルタ（Sobelなど）を受け入れて、the Wikipedia articleのような画像を生成し、その結果にガウスブラーを適用して、エッジを柔らかくしてより多くの輝きを与えて合成しますあなたのシーンにそのイメージを表示しますか？

実際には、あなたが見た3Dアウトラインシェイダーを再利用することができます。理論的に深度の量を調べることはできますが（私はESで長時間の努力をしましたが）レンダリングされたイメージ

EDIT：ラプラシアンは、単純な畳み込みシェーダ（場所like thisに記載されているように）として行うことができるため、Sobelよりも少し適用しやすいかもしれません。携帯電話でも安全であるように、せいぜい3x3のカーネルに固執し、データで行うのではなく、各エフェクトごとに異なるシェーダーを作成することができます。だから長さで書き出さラフガウスぼかし、：

void main() 
{ 
    mediump vec4 total = vec4(0.0); 
    mediump vec4 grabPixel; 

    total +=  texture2D(tex2D, texCoordVarying + vec2(-1.0/width, -1.0/height)); 
    total +=  texture2D(tex2D, texCoordVarying + vec2(1.0/width, -1.0/height)); 
    total +=  texture2D(tex2D, texCoordVarying + vec2(1.0/width, 1.0/height)); 
    total +=  texture2D(tex2D, texCoordVarying + vec2(-1.0/width, 1.0/height)); 

    grabPixel =  texture2D(tex2D, texCoordVarying + vec2(0.0, -1.0/height)); 
    total += grabPixel * 2.0; 

    grabPixel =  texture2D(tex2D, texCoordVarying + vec2(0.0, 1.0/height)); 
    total += grabPixel * 2.0; 

    grabPixel =  texture2D(tex2D, texCoordVarying + vec2(-1.0/width, 0.0)); 
    total += grabPixel * 2.0; 

    grabPixel =  texture2D(tex2D, texCoordVarying + vec2(1.0/width, 0.0)); 
    total += grabPixel * 2.0; 

    grabPixel = texture2D(tex2D, texCoordVarying); 
    total += grabPixel * 4.0; 

    total *= 1.0/16.0; 

    gl_FragColor = total; 
} 

ラプラシアンエッジ検出には似ていますがと異なる定数を探してしまいます。

最適化として、可変シェイダーではなく、可変シェイダーの相対サンプリングポイントを、バリアンスの制限を考慮して、できるだけ離散テクスチャーの読み取りを避けるように調整する必要があります。