Fragment shader - checkerboard?

Hello. Total newbie programmer here, been toying with SDL and glew, and followed some tutorials on how to load some basic vertex and fragment shaders.

Basically, I’m creating a viewport, lets say 500x500, with a quad that fits the viewport. I can do some basic things like changing the quad’s color or moving the vertex points using a uniform. The next thing I want to do is to fill the quad with 10x10 squares alternating between black and white (or any arbitrary color). I would assume that the easiest way would be done in the fragment shader, but I can’t seem to wrap my head around how to do it. Any help would be appreciated.

as a newbie.
it is a very bad news to hear that i want tp learn glfw and glsl.
ok i am a newbie .i can draw quads.then you had many works to do.
such as how to compile. how to rotate.how to use my mouse…
that 's my suggest

Some of the source codes of this page including accumaa.c draw a checkerboard without loading any textures. You don’t need shaders to do it.

Thanks for the link, some good basic samples there. However, I am really only interested in figuring this out just using shaders. I can think of a few fairly easy ways to accomplish the output of a checkerboard, but my goal is to learn more about how fragment shaders works.

Not sure if I can even use any of the accumaa.c bits, looks like it is self-generating a texture with the checkerboard pattern, and I want to do this without textures.

Thanks for the encouragement! I’m still hacking away at it. :slight_smile:

hi mksaccount.

i dont know what is the mean of hacking way at it.

i meaned if you were a senior programer.pls ingro what i had said.

Finally got time to experiment a bit more and got a basic working example. Basically, gl_FragCoord returns the size of the viewport window and then use mod to divide it into 100 pixel squares. Then some basic comparisons to divide into 50x50 squares and determine black or white color. I originally had this as a single and/or statement, but it wouldn’t compile and learned that glsl doesn’t handle | (or).

void main(void)
{
vec2 pos = mod(gl_FragCoord.xy,vec2(100));
if ((pos.x > 50.0)&&(pos.y > 50.0)){
gl_FragColor=vec4(1.0, 1.0, 1.0, 1.0);
}
if ((pos.x < 50.0)&&(pos.y < 50.0)){
gl_FragColor=vec4(1.0, 1.0, 1.0, 1.0);
}
if ((pos.x < 50.0)&&(pos.y > 50.0)){
gl_FragColor=vec4(0.0, 0.0, 0.0, 1.0);
}
if ((pos.x > 50.0)&&(pos.y < 50.0)){
gl_FragColor=vec4(0.0, 0.0, 0.0, 1.0);
}
}

Single pipe | is bitwise OR, GLSL 1.3 needed.
Double pipe || is logical OR, the one you want, and is present since the beginning.

No need for all those 'if’s. Just floor the components, sum them, and check if the sum is even or odd. This routine makes a checkerboard texture with 1x1x1 cubes. Scale texc as appropriate.


vec4 checker3D(vec3 texc, vec4 color0, vec4 color1)
{
  if ((int(floor(texc.x) + floor(texc.y) + floor(texc.z)) & 1) == 0)
    return color0;
  else
    return color1;
}