OpenGL ES 2.0 does not have a front/back color. This was removed from core OpenGL 3.x and at the same time never introduced into OpenGL ES 2.0. Likewise, gl_Color
is invalid in your fragment shader.
Technically, I think #version 110
is also invalid, as I have never come across a formal specification for GLSL 110 in OpenGL ES. This is very likely a bad habit that people carried over from desktop GL (GLSL was introduced in OpenGL 2.0 starting at #version 110
). GLSL 100 does exist but not as a properly ratified specification; it uses very old ARB extensions.
OpenGL ES 2.0 introduced GLSL ES with #version 100
, proper GLSL ES shaders should begin with either #version 100
(OpenGL ES 2.0) or #version 300
(OpenGL ES 3.0).
Below are some pre-declared variables that you might encounter when working with shaders that were originally designed for desktop OpenGL (compatibility profile):
Vertex
- gl_FrontColor
- gl_BackColor
- gl_FrontSecondaryColor
- gl_BackSecondaryColor
Fragment
- gl_Color
- gl_SecondaryColor
None of these are valid in core OpenGL 3.x or OpenGL ES 2.0; you will have to create your own varying that is shared between your vertex shader and fragment shader for this purpose.
To correct your situation, I have updated your vertex and fragment shaders to avoid using gl_FrontColor
, gl_Color
, etc..
Modified Vertex Shader:
#version 100
attribute vec3 vPosition;
// Vertex and Fragment Shaders will both use this varying to communicate
// interpolated color between vertices...
varying vec4 color;
void main (void)
{
gl_Position = vec4 (vPosition, 1.0);
color = vec4 (0.3, 0.3, 0.3, 1.0);
}
Modified Fragment Shader:
#version 100
/* This takes the place of the old *gl_Color*, but it does not handle
* polygon side. If you _really_ do need a different color for
* front and back, then you will have to do things a little
* differently (SEE BELOW).
*/
varying vec4 color;
void main(void)
{
gl_FragColor = color;
}
It is rare that you truly need a different color per-side, but if you actually do, here is how you can achieve this. In order to implement a per-side color in OpenGL ES 2.0, you can use the built-in gl_FrontFacing
. This variable is a boolean that tells you which side of the polygon is being shaded.
Hypothetical Two-sided Fragment Shader:
#version 100
varying vec4 front_color;
varying vec4 back_color;
void main (void) {
gl_FragColor = gl_FrontFacing ? front_color : back_color;
}
If you are using a tutorial to learn GLSL, I suspect you are following one that is based on desktop OpenGL. There are slight differences between OpenGL's GLSL and OpenGL|ES's GLSL, and in ES 2.0 the GLSL syntax is roughly equivalent to OpenGL's GLSL 120.
The biggest difference overall, is that most things that are merely deprecated in desktop OpenGL are actually removed from OpenGL|ES. This is why following a desktop GL tutorial may not be so great - OpenGL 3.0 introduced GLSL version 130, which has syntax ES 2.0 does not understand. At the same time, tutorials written for OpenGL 3.0 are the ones most likely to avoid using deprecated features.
Even though OpenGL and OpenGL|ES are derived from the same API, little nuances like this make it difficult to take tutorials written for one API and apply them to the other :-
I have included links to the specifications for each version of OpenGL, OpenGL ES, GLSL and GLSL ES discussed in the first part of the answer to help you truly "master" OGLES2.