Search code examples
openglopengl-esshader

How to give smooth edges when filling a png with color in OpenGl/GLES


Right one is the orginal and left one is sampled by fragment shader

this is my fragment shader

 #ifdef GL_ES
 #define LOWP lowp
 precision mediump float;
 #else
 #define LOWP  
 #endif
 varying LOWP vec4 v_color;
 varying vec2 v_texCoords;
 uniform sampler2D u_texture;
 void main()
 {
        vec4 final_color = v_color * texture2D(u_texture, v_texCoords);
   if (final_color.w != 0.0){
                final_color = v_color;
   }

   gl_FragColor = final_color;
 }

Solution

  • It looks like your original image is anti-aliased. Try just using the color of v_color with the alpha from the texture:

    gl_FragColor.xyz = v_color.xyz;
    gl_FragColor.w = texture2D(u_texture, v_texCoords).w;