how to GLES2 Ortho Triangle?

[peepo]

Has anyone a really stripped down but complete 2d triangle using ortho projection and shaders?
using GLES2/gl2.h, EGL/egl.h and EGL/eglext.h

This process is already fairly complex and it will be helpful to have simple examples,

[Paeryn]

Is this any good? It doesn't have texturing yet, I'll expand the example later if you want it.
https://www.dropbox.com/s/5yox4ysbd0uzp ... 2ortho.zip
Sorry about the messy code - it uses some code from a project I'm working on, I think I've stripped the non-relevant stuff out.
Ask away if you need anything explaining.

[peepo]

Paeryn,

I'm really looking for a simple introduction, the minimum code, without bells and whistles.

[Emanuele]

I won't bother with an EGL setup, since I find the hello_* samples fine in that regard. Just be careful to pick one that sets EGL_CONTEXT_CLIENT_VERSION to 2. On the other hand, I too found the choice of using fractal sets, framebuffer objects and mouse events in the hello_triangle2 sample a bit puzzling.

Here is a quick and dirty ANSI C / OpenGL ES 2.0 port of http://people.freedesktop.org/~idr/Open ... world.html:

Code: Select all

#include <GLES2/gl2.h>

GLfloat data[] = { -.5f, -.5f, -.5f, .5f, .5f, .5f };

void init() {
        const GLchar *vertex_shader_code = "attribute vec4 pos; void main(void) { gl_Position = pos; }";
        const GLchar *fragment_shader_code = "void main(void) { gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0); }";
        GLuint vs, fs, program;
        GLint pos;
        vs = glCreateShader(GL_VERTEX_SHADER);
        glShaderSource(vs, 1, &vertex_shader_code, 0);
        glCompileShader(vs);
        fs = glCreateShader(GL_FRAGMENT_SHADER);
        glShaderSource(fs, 1, &fragment_shader_code, 0);
        glCompileShader(fs);
        program = glCreateProgram();
        glAttachShader(program, vs);
        glAttachShader(program, fs);
        glLinkProgram(program);
        pos = glGetAttribLocation(program, "pos");
        glUseProgram(program);
        glEnableVertexAttribArray(pos);
        glVertexAttribPointer(pos, 2, GL_FLOAT, GL_FALSE, 0, data);
}

void display() {
        glClear(GL_COLOR_BUFFER_BIT);
        glDrawArrays(GL_TRIANGLES, 0, 3);
}

[Paeryn]

I've cut the code down to minimal error-checking, vanilla C (and fixed a couple of bugs).
https://www.dropbox.com/s/fzuh3lfqjmsphyw/ortho.zip

It sets up an ortho projection where the vertex coords map to the pixel coords of the window. I'm guessing this might be what you want since you asked for a 2D triangle example.
Without having a projection matrix (i.e. the vertex shader just passing the coordinates straight to the frag shader as in Emanuele's code) is equivalent to an orthographic projection where the coordinate (-1,-1) is the bottom-left and (1,1) the top-right, and the near & far clip planes will be z=-1 and z=1.

In my code the vertices are defined with one array of 2-element floats as the x and y coord, and a second array of 4-element floats for the RGBA colour of each vertex.

As it stands there's no way to rotate the triangles without either :-
a) Actually altering the vertex coordinates yourself before passing them to GL, or
b) generating the required transformation matrix and multiplying the projection matrix (which the code generates) by it.

The problem with gles2 is that there is always going to be a fair amount of support code needed as a lot of things that gles1 provides you're expected to do yourself. That's the price of having a more flexible pipeline.

[Emanuele]

To complement both my and Paeryn's code. I'd like to add some tips that I think might be useful for a minimalistic, bottom up approach to learning OpenGL ES 2.

To avoid loading shaders from files, you can define a helper macro:

Code: Select all

#define SHADER(x) #x

const GLchar *vertex_shader = SHADER(

attribute vec4 pos;

void main(void)
{
    gl_Position = pos;
}

);

Note that since lines are concatenated, you cannot use preprocessing directives and // comments.

For loading textures, I recommend http://nothings.org/stb_image.c (150K). Plain C, no dependencies and just two functions:

Code: Select all

int w,h,n;
unsigned char *data = stbi_load(filename, &w, &h, &n, 4);
stbi_image_free(data);

You can load png and jpeg images (and several other formats), and data is ready to be uploaded as a w x h texture (GL_RGBA format).

As for vectors and matrices, I actually think there is some value in NOT using any math library to begin with, and taking the opportunity to nail C vs OpenGL matrix layout and brush up some linear algebra concepts.