I have a fragment shader :
precision mediump float;
uniform vec4 vColor;
uniform sampler2D u_Texture; // The input texture.
varying vec2 v_TexCoordinate; // Interpolated texture coordinate per fragment.
varying vec4 vAlpha;
void main() {
gl_FragColor = vec4(texture2D(u_Texture, v_TexCoordinate).xyz, texture2D(u_Texture, v_TexCoordinate).w * vAlpha[3]);
}
And vertex shader :
attribute vec3 vPosition;
attribute vec2 aTextureCoord; // Per-vertex texture coordinate information we will pass in.
attribute vec4 aAlpha;
varying vec2 v_TexCoordinate;
varying vec4 vAlpha;
void main() {
v_TexCoordinate = aTextureCoord;
vAlpha = aAlpha;
gl_Position = uMVPMatrix * vec4(vPosition,1.0);
}
And try to set alpha value to texture from my program.
private final int mAlphaHandle;
private float[] color = {0.5f};
Set :
mAlphaHandle = GLES20.glGetAttribLocation(mProgram,"aAlpha");
Using :
GLES20.glEnableVertexAttribArray(mAlphaHandle);
GLES20.glVertexAttribPointer(mAlphaHandle, 1,GLES20.GL_FLOAT, false,4, alphaBuffer);
Blending is enabled.
GLES20.glEnable(GLES20.GL_BLEND);
GLES20.glBlendFunc(GLES20.GL_SRC_ALPHA, GLES20.GL_ONE_MINUS_SRC_ALPHA);
But i have no effect on the screen. So a question is why i getting no effect on the screen? Actually a want to change alpha value dynamically in the future.
Related
I want to apply an alpha mask to a video. Each frame of the video has color information on top and alpha information at the bottom. Like this:
In my case, i want the white pixels in the alpha image to be transparent in the main image. I have an other texture that fills in those transparent pixels.
I was able to generate the only color images or only alpha images, but not able to apply the alpha on to the image. I am using GLES20 in android.
Here is my code which is giving a black screen:
private val vidVertexShaderCode =
"""
precision highp float;
attribute vec3 vertexPosition;
attribute vec4 uvs;
varying vec2 varUvs;
varying vec2 varMaskUvs;
uniform mat4 texMatrix;
uniform mat4 mvp;
void main()
{
varUvs = (texMatrix * vec4(uvs.x, uvs.y, 0, 1.0)).xy;
varMaskUvs = (texMatrix * vec4(uvs.x, uvs.y * 0.5, 0.1, 1.0)).xy;
gl_Position = mvp * vec4(vertexPosition, 1.0);
}
"""
private val vidFragmentShaderCode =
"""
#extension GL_OES_EGL_image_external : require
precision mediump float;
varying vec2 varUvs;
varying vec2 varMaskUvs;
uniform samplerExternalOES texSampler;
void main()
{
vec2 m_uv = vec2(varMaskUvs.x, varMaskUvs.y);
vec4 mask = texture2D(texSampler, m_uv);
vec2 c_uv = vec2(varUvs.x, varUvs.y * 0.5);
vec4 color = texture2D(texSampler, c_uv);
gl_FragColor = vec4(color.rgb, color.a * mask.r)
}
"""
What am i doing wrong?
P.S. I am new to opengl.
Compute the v coordinate of the image (uvs.y * 0.5 + 0.5) and the mask (uvs.y * 0.5) in the vertex shader:
precision highp float;
attribute vec3 vertexPosition;
attribute vec4 uvs;
varying vec2 varUvs;
varying vec2 varMaskUvs;
uniform mat4 texMatrix;
uniform mat4 mvp;
void main()
{
varUvs = (texMatrix * vec4(uvs.x, uvs.y * 0.5 + 0.5, 0, 1.0)).xy;
varMaskUvs = (texMatrix * vec4(uvs.x, uvs.y * 0.5, 0.0, 1.0)).xy;
gl_Position = mvp * vec4(vertexPosition, 1.0);
}
You don't need any further transformation in the fragment shader:
#extension GL_OES_EGL_image_external : require
precision mediump float;
varying vec2 varUvs;
varying vec2 varMaskUvs;
uniform samplerExternalOES texSampler;
void main()
{
vec4 mask = texture2D(texSampler, varMaskUvs);
vec4 color = texture2D(texSampler, varUvs);
gl_FragColor = vec4(color.rgb, color.a * mask.r)
}
I use Vuforia SDK to render the video stream of my phone's camera on the screen.
So the texture is generated by the Vuforia library, not me.
The shaders used to render this background are:
// Vertex Shader
attribute vec4 a_position;
attribute vec2 a_textureCoords;
varying vec2 v_textureCoords;
uniform mat4 u_projectionMatrix;
void main()
{
gl_Position = u_projectionMatrix * a_position;
v_textureCoords = a_textureCoords;
}
// Fragment Shader
varying highp vec2 v_textureCoords;
uniform sampler2D u_currentTexture;
void main()
{
vec4 currentColor = texture2D(u_currentTexture, v_textureCoords);
gl_FragColor = currentColor;
}
Now, I want an overlay in the upper-left corner of the screen:
I don't want this overlay to display only a pink texture, but rather a multiply blend of the pink texture and the background texture. Note that the textures do not have the same coordinates.
But for now, let's forget about the blending and let's just render the background texture in the shader program of the pink texture. So in the end, yes, one should see no difference between the background-only version and the bacground with overlay version.
As you can see (look at the painting and the top of the chair), there is a small offset...
The shaders used to render the overlay are:
// Vertex Shader
attribute vec4 a_position;
attribute vec2 a_currentTextureCoords;
varying vec2 v_currentTextureCoords;
void main()
{
gl_Position = a_position;
v_currentTextureCoords = a_currentTextureCoords;
}
// Fragment Shader
varying highp vec2 v_currentTextureCoords;
uniform sampler2D u_currentTexture;
uniform sampler2D u_backgroundTexture;
void main()
{
vec2 screenSize = vec2(1080.0, 1920.0);
vec2 cameraResolution = vec2(720.0, 1280.0);
vec2 texelSize = vec2(1.0 / screenSize.x, 1.0 / screenSize.y);
vec2 scaleFactor = vec2(cameraResolution.x / screenSize.x, cameraResolution.y / screenSize.y);
vec2 uv = gl_FragCoord.xy * texelSize * scaleFactor;
uv = vec2(scaleFactor.y - uv.y, scaleFactor.x - uv.x);
vec4 backgroundColor = texture2D(u_backgroundTexture, uv);
gl_FragColor = backgroundColor;
}
Are my calculations wrong?
Why do you need this line?
uv = vec2(scaleFactor.y - uv.y, scaleFactor.x - uv.x);
Not sure what arithmetic relationship the absolute texture coordinates have with the scale factor which needs an addition or a subtraction ...
P.S. it's not related to your question, but your shaders will be shorter and easier to read if you just use the vector operations in the language. For example, replace:
vec2 scaleFactor = vec2(cameraResolution.x / screenSize.x, cameraResolution.y / screenSize.y);
... with ...
vec2 scaleFactor = cameraResolution / screenSize;
As long as the vector types are the same length, it will do exactly what you expect with a lot less typing ...
I would like to draw a simple square and change the color dynamically so that it is the brightest in the center and darkest in the borders.
however when I am rendering I can't see anything .
here is my vertex shader:
uniform mat4 u_Matrix;
attribute vec4 a_Position;
attribute vec4 a_Color;
varying vec4 v_Color;
varying vec4 pos;
void main()
{
v_Color = a_Color;
pos = u_Matrix * a_Position;
gl_Position = pos;
}
and here is my fragment shader :
precision mediump float;
varying vec4 v_Color;
varying vec4 pos;
void main()
{
float len = length(normalize(pos));
gl_FragColor = vec4(1-len , 1-len , 1-len , 1);
}
You can't reference gl_Position in the fragment shader.
Either hand gl_Position over to the fragment shader
attribute vec4 a_Position;
varying vec4 pos;
void main()
{
pos = a_Position;
gl_Position = a_Position;
}
or use gl_FragCoord in the fragment shader float dist = length( gl_FragCoord - viewPortCenter ); if you want to work in window coordinates.
Also rather use length, which is faster, instead of doing your own distance calculation.
I want to colorize a sprite so that RGB channels are all 1 and alpha remains unchanged.
I gather this should be done with shaders, but the two accepted answers on StackOverflow (Change sprite color into white and libgdx changing sprite color while hurt) don't work for me - the result is transparent, and they don't work on http://shdr.bkcore.com/ either
All you need is to replace the RGB each with 1.0 in the fragment shader.
Vertex shader-- This is like the one in SpriteBatch with vertex color removed since you aren't using it:
attribute vec4 a_position;
attribute vec2 a_texCoord0;
uniform mat4 u_projTrans;
void main()
{
v_texCoords = a_texCoord0;
gl_Position = u_projTrans * a_position;
}
Fragment shader-- grab just the alpha value from the texture.:
#ifdef GL_ES
precision lowp float; //since the only value we're storing is part of a color
#endif
varying vec2 v_texCoords;
uniform sampler2D u_texture;
void main()
{
float alpha = texture2D(u_texture, v_texCoords).a;
gl_FragColor = vec4(1.0, 1.0, 1.0, alpha);
}
I've been stuck for several days now, trying to make my shader working properly.
The problem is that when I'm not attaching a texture on my object, I multiply the ambient by the light color and I get a dark object when no light, and illuminated properly when a light source is activated.
The problem is that when I attach a texture and multiply it by ambient and light color I get a transparent object that shows up only when a light source is activated, and you can even see through the object while it is illuminated!
I've been trying several codes snippets from the internet but I always get the same result. What I'm doing wrong here? I'm desperate...
The application is developed on Android.
Here is my Vertex Shader:
uniform mat4 uMVPMatrix;
uniform mat4 normalMatrix;
// eye pos
uniform vec3 eyePos;
// position and normal of the vertices
attribute vec4 aPosition;
attribute vec3 aNormal;
// texture variables
uniform float hasTexture;
varying float tex;
attribute vec2 textureCoord;
varying vec2 tCoord;
// lighting
uniform vec4 lightPos;
uniform vec4 lightColor;
// material
uniform vec4 matAmbient;
uniform vec4 matDiffuse;
uniform vec4 matSpecular;
uniform float matShininess;
// normals to pass on
varying vec3 vNormal;
varying vec3 EyespaceNormal;
varying vec3 lightDir, eyeVec;
void main() {
// pass on texture variables
tex = hasTexture;
tCoord = textureCoord;
// normal
EyespaceNormal = vec3(normalMatrix * vec4(aNormal, 1.0));
// the vertex position
vec4 position = uMVPMatrix * aPosition;
// light dir
lightDir = lightPos.xyz - position.xyz;
eyeVec = -position.xyz;
gl_Position = uMVPMatrix * aPosition;
}
And here is my Fragment shader:
precision mediump float;
// texture variables
uniform sampler2D texture1; // color texture
varying float tex;
varying vec2 tCoord;
varying vec3 vNormal;
varying vec3 EyespaceNormal;
// light
uniform vec4 lightPos;
uniform vec4 lightColor;
// material
uniform vec4 matAmbient;
uniform vec4 matDiffuse;
uniform vec4 matSpecular;
uniform float matShininess;
// eye pos
uniform vec3 eyePos;
// from vertex s
varying vec3 lightDir, eyeVec;
void main() {
vec4 b = lightColor;
vec4 c = matAmbient;
vec4 d = matDiffuse;
vec4 e = matSpecular;
vec3 g = eyePos;
float f = matShininess;
vec3 N = normalize(EyespaceNormal);
vec3 E = normalize(eyeVec);
vec3 L = normalize(lightDir);
// Reflect the vector. Use this or reflect(incidentV, N);
vec3 reflectV = reflect(-L, N);
// Get lighting terms
vec4 ambientTerm;
if (tex >= 1.0) {
ambientTerm = texture2D(texture1, tCoord);
}
else
ambientTerm = matAmbient * lightColor;
vec4 diffuseTerm = matDiffuse * max(dot(N, L), 0.0);
vec4 specularTerm = matSpecular * pow(max(dot(reflectV, E), 0.0), matShininess);
gl_FragColor = ambientTerm * diffuseTerm + specularTerm;
}
Thanks in advance.
OK I found it, thanks to JPD002, I was revising the shader again, and I found out that it has to be
vec4 diffuseTerm = matDiffuse * max(dot(N, L), 0.0);
vec4 specularTerm = matSpecular * pow(max(dot(reflectV, E), 1.0), matShininess);
Thanks JDP002, it is always good to have 4 eyes on code rather than 2 =D