We Keep Coding

How to create and use VBOs in OpenGL ES 2

I am looking for help with understanding VBOs. I have done a ton of research and have found tutorials on the subject, but they are still vague to me. I have a few questions:
Where should a VBO be created, and how should I create one?
I am currently using the code right below to initialize my vertex and index buffers:
vertices = new float[]
{
p[0].x, p[0].y, 0.0f,
p[1].x, p[1].y, 0.0f,
p[2].x, p[2].y, 0.0f,
p[3].x, p[3].y, 0.0f,
};
// The order of vertex rendering for a quad
indices = new short[] {0, 1, 2, 0, 2, 3};
ByteBuffer bb = ByteBuffer.allocateDirect(vertices.length * 4);
bb.order(ByteOrder.nativeOrder());
vertexBuffer = bb.asFloatBuffer();
vertexBuffer.put(vertices);
vertexBuffer.position(0);
ByteBuffer dlb = ByteBuffer.allocateDirect(indices.length * 2);
dlb.order(ByteOrder.nativeOrder());
drawListBuffer = dlb.asShortBuffer();
drawListBuffer.put(indices);
drawListBuffer.position(0);
If I am correct, this is not creating a VBO. So, if I wanted to make a VBO, would the code to create a VBO go right after the code listed above? If so, how would it be created?
Also, how is a VBO rendered and drawn to screen?
Is it rendered and drawn the same way as just using vertex and index arrays? If not, what is the process? Currently, I render and draw my objects as shown in the code below:
GLES20.glUseProgram(GraphicTools.sp_SolidColor);
mPositionHandle =
GLES20.glGetAttribLocation(GraphicTools.sp_SolidColor, "vPosition");
GLES20.glEnableVertexAttribArray(mPositionHandle);
GLES20.glVertexAttribPointer(mPositionHandle, 3,
GLES20.GL_FLOAT, false,
0, vertexBuffer);
mtrxHandle = GLES20.glGetUniformLocation(GraphicTools.sp_SolidColor,
"uMVPMatrix");
GLES20.glUniformMatrix4fv(mtrxHandle, 1, false, m, 0);
GLES20.glDrawElements(GLES20.GL_TRIANGLES, indices.length,
GLES20.GL_UNSIGNED_SHORT, drawListBuffer);
GLES20.glDisableVertexAttribArray(mPositionHandle);
If you have any questions, let me know. Thanks in advance.

A Vertex Buffer Object is a buffer where vertex array data can be stored. The data are uploaded one time to the graphics memory (GPU) and can be used repeatedly to draw a mesh.
First you have to create 2 buffer objects, one for the vertices and one for the indices:
int buffers[] = new int[2];
GLES20.glGenBuffers(2, buffers, 0);
int vbo = buffers[0];
int ibo = buffers[1];
Then you have to bind the buffer and to transfer the data
GLES20.glBindBuffer(GLES20.GL_ARRAY_BUFFER, vbo);
GLES20.glBufferData(
GLES20.GL_ARRAY_BUFFER,
vertexBuffer.capacity() * 4, // 4 = bytes per float
vertexBuffer,
GLES20.GL_STATIC_DRAW);
GLES20.glBindBuffer(GLES20.GL_ARRAY_BUFFER, 0);
GLES20.glBindBuffer(GLES20.GL_ELEMENT_ARRAY_BUFFER, ibo);
GLES20.glBufferData(
GLES20.GL_ELEMENT_ARRAY_BUFFER,
drawListBuffer.capacity() * 2, // 2 = bytes per short
drawListBuffer,
GLES20.GL_STATIC_DRAW);
GLES20.glBindBuffer(GLES20.GL_ELEMENT_ARRAY_BUFFER, 0);
If you want to draw the mesh, then you have to define the array of generic vertex attribute data and you have to bind the index buffer, but you don't have to transfer any data to the GPU:
GLES20.glBindBuffer(GLES20.GL_ARRAY_BUFFER, vbo);
GLES20.glVertexAttribPointer(
mPositionHandle, 3,
GLES20.GL_FLOAT, false,
0, 0); // <----- 0, because "vbo" is bound
GLES20.glEnableVertexAttribArray(mPositionHandle);
GLES20.glBindBuffer(GLES20.GL_ELEMENT_ARRAY_BUFFER, ibo);
GLES20.glDrawElements(
GLES20.GL_TRIANGLES, indices.length,
GLES20.GL_UNSIGNED_SHORT, 0); // <----- 0, because "ibo" is bound
GLES20.glDisableVertexAttribArray(mPositionHandle);
GLES20.glBindBuffer(GLES20.GL_ARRAY_BUFFER, 0);
GLES20.glBindBuffer(GLES20.GL_ELEMENT_ARRAY_BUFFER, 0);
See also An Introduction to Vertex Buffer Objects (VBOs)

Why is the texture coordinate in my fragment shader always (0, 0)?

I'm using LWJGL to draw "tiles", or textured 2D squares on the screen. However, the texture coordinate is always (0, 0) and therefore the textured square only uses the first pixel colour to fill it.
This is my vertex shader:
#version 330 core
in vec4 in_Position;
in vec4 in_Color;
in vec2 in_TextureCoord;
out vec4 pass_Color;
out vec2 pass_TextureCoord;
void main(void) {
gl_Position = in_Position;
pass_Color = in_Color;
pass_TextureCoord = in_TextureCoord;
}
And this is my fragment shader:
#version 330 core
uniform sampler2D texture_diffuse;
in vec4 pass_Color;
in vec2 pass_TextureCoord;
out vec4 out_Color;
void main(void) {
out_Color = pass_Color;
// Override out_Color with our texture pixel
out_Color = texture(texture_diffuse, pass_TextureCoord);
}
And this is essentially the code I'm using to draw the square:
ARBShaderObjects.glUseProgramObjectARB(shaderProgram);
glBindTexture(GL_TEXTURE_2D, sprite.getId());
glBegin(GL11.GL_QUADS);
glVertex2d(screenMinX, screenMinY);
glTexCoord2d(0.0, 0.0);
glVertex2d(screenMaxX, screenMinY);
glTexCoord2d(1.0, 0.0);
glVertex2d(screenMaxX, screenMaxY);
glTexCoord2d(1.0, 1.0);
glVertex2d(screenMinX, screenMaxY);
glTexCoord2d(0.0, 1.0);
glEnd();
// release the shader
ARBShaderObjects.glUseProgramObjectARB(0);
I cannot fix it because I don't know how the above code works in the first place. I have not told the shaders what in_Position, in_Color or in_TextureCoord are but the first two seem to work just fine. It is in_TextureCoord, which is eventually passed to the fragment shader, that seems to have a constant value of (0, 0) - I have determined that by setting the output colour of the fragment shader to have one of the channels equal to the X-coordinate of the texture coordinate. It remained a solid colour throughout the square, indicating that there was no change in texture coordinate.
The square produced with the code above should be textured but instead is painted a solid colour - the first pixel of the texture given. How can I change the code to make the texture coordinate change accordingly? If I appear to have some misunderstanding to how this all fits together, please correct me.
This is the tutorial I used to try to accomplish the above.
p.s. I am aware that the Java snippet is using deprecated immediate-mode, but I don't know how to use glDrawArrays or any other commonly suggested method to accomplish the same. Could you help me to change this?

I am aware that the Java snippet is using deprecated immediate-mode, but I don't know how to use glDrawArrays or any other commonly suggested method to accomplish the same. Could you help me to change this?
Since you do not need the attribute in_Color anymore, you have to delete the attribute from the vertex shader (and of course also pass_Color from the vertex shader and the fragment shader).
Otherwise, you have to expand my solution logically by the color attribute.
Set up an array for the vertex positions an for the texture coordinates:
float[] posData = {
screenMinX, screenMinY, 0.0, 1.0,
screenMaxX, screenMinY, 0.0, 1.0,
screenMaxX, screenMaxY, 0.0, 1.0,
screenMinX, screenMaxY, 0.0, 1.0 };
float[] texData = { 0.0, 0.0, 1.0, 0.0, 1.0, 1.0, 0.0, 1.0 };
Generate a vertex array object:
int vaoObj = glGenVertexArrays();
glBindVertexArray(vaoObj);
Generate array buffers for the vertices and texture coordinates, enable the attribute indices and associate them buffers to the attribute indices:
FloatBuffer posBuffer = MemoryUtil.memAllocFloat(posData.length);
posBuffer.put(posData).flip();
FloatBuffer texBuffer = MemoryUtil.memAllocFloat(texData.length);
texBuffer.put(texData).flip();
int vboPosObj = glGenBuffers();
glBindBuffer(GL_ARRAY_BUFFER, vboPosObj);
glBufferData(GL_ARRAY_BUFFER, posBuffer, GL_STATIC_DRAW);
// index 0 to associate with "in_Position"
glVertexAttribPointer(0, 4, GL_FLOAT, false, 0, 0);
glEnableVertexAttribArray(0); // 0 = attribute index of "in_Position"
int vboTexObj = glGenBuffers();
glBindBuffer(GL_ARRAY_BUFFER, vboTexObj);
glBufferData(GL_ARRAY_BUFFER, texBuffer, GL_STATIC_DRAW);
// index 0 to associate with "in_TextureCoord"
glVertexAttribPointer(1, 2, GL_FLOAT, false, 0, 0);
glEnableVertexAttribArray(1); // 1 = attribute index of "in_TextureCoord"
Release the vertex array object:
glBindBuffer(GL_ARRAY_BUFFER, 0);
glBindVertexArray(0);
You have to specify the attribute indices of the attributes in_Position and in_TextureCoord.
Either you use explicit layout specifications in the vertex shader:
layout (location = 0) in vec4 in_Position;
layout (location = 1) in vec2 in_TextureCoord;
Or you specify the attribute indices in the shader program, right before you link the shader program (glLinkProgram).
glBindAttribLocation(shaderProgramID, 0, "in_Position");
glBindAttribLocation(shaderProgramID, 1, "in_TextureCoord");
If the object is to be drawn, it is sufficient to bind the Vertex Array Object:
glBindVertexArray(vaoObj);
glDrawArrays(GL_QUADS, 0, 4); // 4 = number of vertices
glBindVertexArray(0);
Note, if a buffer objects or a vertex array object is not further used, it has to be deleted, to prevent memory leaks. Buffer objects are deleted by glDeleteBuffers and vertex array objects are deleted by glDeleteVertexArrays.
Buffer objects are not "created under" vertex array objects, it is not sufficient to delete the vertex array object only (see OpenGL Vertex Array/Buffer Objects)

If you use need to use box to show some texture image that will be fit the full box area you can use two triangles for it and following parameters for -1,-1 to 1,1 area (that can be used with appropriate shaders to show).
Vertex (two triangles coordinates):
-1.0f, 1.0f, 0.0f,
-1.0f, -1.0f, 0.0f,
1.0f, 1.0f, 0.0f,
1.0f, 1.0f, 0.0f,
-1.0f, -1.0f, 0.0f,
1.0f, -1.0f, 0.0f
Then use can use following texture coordinates for full size:
0.0f, 1.0f,
0.0f, 0.0f,
1.0f, 1.0f,
1.0f, 1.0f,
0.0f, 0.0f,
1.0f, 0.0f

LWJGL doesn't render anything

I am trying to learn how to use LWJGL3 and I just got to a state where I want to render something (a test quad for now). I have a class that represents a mesh where I set up the VAO with vertex, colour and indices buffers and another object later takes the mesh instance, retrieves its VAO ID and attempts to render it.
The problem I have is that no matter what I try, nothing renders in the window. I can change the background colour through the glClearColor() method but the quad never shows up.
The VAO set up:
vertexCount = indices.length;
vaoID = glGenVertexArrays();
glBindVertexArray(vaoID);
glEnableVertexAttribArray(0);
glEnableVertexAttribArray(1);
//Vertices
FloatBuffer verticesBuffer = BufferUtils.createFloatBuffer(positions.length);
verticesBuffer.put(positions).flip();
vboID = glGenBuffers();
glBindBuffer(GL_ARRAY_BUFFER, vboID);
glBufferData(GL_ARRAY_BUFFER, verticesBuffer, GL_STATIC_DRAW);
glVertexAttribPointer(0, 3, GL_FLOAT, false, 3 * 4, 0);
//Colours
FloatBuffer colorsBuffer = BufferUtils.createFloatBuffer(colors.length);
colorsBuffer.put(colors).flip();
colVboID = glGenBuffers();
glBindBuffer(GL_ARRAY_BUFFER, colVboID);
glBufferData(GL_ARRAY_BUFFER, colorsBuffer, GL_STATIC_DRAW);
glVertexAttribPointer(1, 3, GL_FLOAT, false, 3 * 4, 0);
//Indices
IntBuffer indicesBuffer = BufferUtils.createIntBuffer(indices.length);
indicesBuffer.put(indices).flip();
idxVboID = glGenBuffers();
glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, idxVboID);
glBufferData(GL_ELEMENT_ARRAY_BUFFER, indicesBuffer, GL_STATIC_DRAW);
//Unbind
glBindBuffer(GL_ARRAY_BUFFER, 0);
glBindVertexArray(0);
The rendering code:
//Bind the shader
shaderProgram.bind();
//Bind the VAO
glBindVertexArray(mesh.getVaoID());
//Draw
glDrawElements(GL_TRIANGLES, mesh.getVertexCount(), GL_UNSIGNED_INT, 0);
//Restore
glBindVertexArray(0);
shaderProgram.unbind();
Vertex shader:
#version 330
layout (location=0) in vec3 pos;
layout (location=1) in vec3 inColor;
out vec3 exColor;
void main()
{
gl_Position = vec4(pos, 1.0);
exColor = inColor;
}
Fragment shader:
#version 330
in vec3 exColor;
out vec4 fragColor;
void main()
{
fragColor = vec4(exColor, 1.0);
}
What am I doing wrong?

The problem was not in the parts of code shown, but in the main loop that I copied from a book without thoroughly thinking through what it did. I ended up with a glClear call right before glfwSwapBuffers call, which cleared the buffer right before showing it.
Lesson of the day: don't just copy from a book, think thoroughly about what you're doing
(Thank you to the people of LWJGL formus for helping me discover this mistake)

libgdx, render shapes using Mesh and ShaderProgram

I just started using libgdx and want to render some 2D shapes using a Mesh and a custom ShaderProgram.
I'm experienced in OpenGL, but I don't see my mistake here, maybe someone can help me.
The shader is very basic, vertex:
attribute vec2 v;
uniform mat4 o;
void main(){
gl_Position = vec4(o*vec3(v, 1.0), 1.0);
}
fragment:
#ifdef GL_ES
precision mediumhp float;
#endif
void main(){
gl_FragColor = vec4(1, 1, 1, 1);
}
The mesh (quad 100x100px):
Mesh mesh = new Mesh(true, 4, 6, new VertexAttribute(Usage.Position, 2, "v"));
mesh.setVertices(new float[]{0, 0,
100, 0,
0, 100,
100, 100});
mesh.setIndices(new short[]{0, 1, 3, 0, 3, 2});
The render stage:
Matrix4 o = new Matrix4(); // also tried OrthographicCamera and SpriteBatch.getProjectionMatrix() here...
o.setToOrtho2D(0, 0, Gdx.graphics.getWidth(), Gdx.graphics.getHeight());
shader.begin();
shader.setUniformMatrix(shader.getUniformLocation("o"), o);
mesh.render(shader, GL20.GL_TRIANGLES);
shader.end();
And thats it. I get no output at all, black screen.
Of course I clear the screen and everything, SpriteBatch (which I also use for different purposes) just works fine. But I don't get how this is done in libgdx or whats wrong here...

How do you display a 3D object using indices in jogl 2 with OpenGL 3.3

im tryign to write a script to display basic 3D objects/polygon triangles using JOGL 2 with OpenGL 3.3 however when the item compiles i receive no error and get an blank window of where the object appears. So my question is, is there anything in specific im missing in adding to make the object to appear.. my code is as follows...
public void init(GL3 gl)
{
gl.glGenVertexArrays(1, IntBuffer.wrap(temp));
//create vertice buffers
int vao = temp[0];
gl.glBindVertexArray(vao);
gl.glGenBuffers(1, IntBuffer.wrap(temp));
int[] temp2 = new int[]{1,1};
gl.glGenBuffers(2, IntBuffer.wrap(temp2));
vbo = temp2[0];
ebo = temp2[1];
//creates vertex array
float vertices[] = {
-0.5f, 0.5f, 0.0f,//1,0,0, // Top-left
0.5f, 0.5f, 0.0f,//0,1,0, // Top-right
0.5f, -0.5f, 0.0f,//0,0,1, // Bottom-right
-0.5f, -0.5f, 0.0f//1,1,0 // Bottom-left
};
gl.glBindBuffer(GL.GL_ARRAY_BUFFER, vbo);
gl.glBufferData(GL.GL_ARRAY_BUFFER, vertices.length * 4,
FloatBuffer.wrap(vertices), GL.GL_STATIC_DRAW);
//creates element array
int elements[] = {
0,1,2,
2,3,0
};
gl.glBindBuffer(GL.GL_ELEMENT_ARRAY_BUFFER, ebo);
gl.glBufferData(GL.GL_ELEMENT_ARRAY_BUFFER, elements.length * 4,
IntBuffer.wrap(elements), GL.GL_STATIC_DRAW);
gl.glVertexAttribPointer(0, 3, GL.GL_FLOAT, false, 3*4, 0* 4);
gl.glEnableVertexAttribArray(0);
}
public void draw(GL3 gl)
{
gl.glBindVertexArray(vao);
gl.glDrawElements(GL.GL_TRIANGLES, 2, GL.GL_UNSIGNED_INT, 0);
}
As for where my shaders being initiated, its in a different class, which is as follows..
//Matrix4 view = new Matrix4(MatrixFactory.perspective(scene.camera.getHeightAngle(),scene.camera.getAspectRatio(),scene.camera.getPosition());
projection = MatrixFactory.perspective(scene.camera.getHeightAngle(), scene.camera.getAspectRatio(), 0.01f, 100f);
view = MatrixFactory.lookInDirection(scene.camera.getPosition(), scene.camera.getDirection(), scene.camera.getUp());
try {
shader = new Shader(new File("shaders/Transform.vert"), new File("shaders/Transform.frag"));
shader.compile(gl);
shader.enable(gl);
shader.setUniform("projection", projection, gl);
shader.setUniform("view", view, gl);
}
catch (Exception e) {
System.out.println("message " + e.getMessage());
}
for (Shape s : scene.shapes) {
s.init(gl);
}
And finally, my shader files
#version 330
out vec4 fragColour;
//in vec3 outColour;
void main() {
fragColour = vec4(1,0,0,1);
}
#version 330
uniform mat4 projection;
uniform mat4 view;
layout(location=0) in vec3 pos;
//layout(location=2) in vec2 texCoord;
//layout(location=1) in vec3 colours;
out vec2 fragTex;
out vec3 outColour;
vec4 newPos;
void main() {
newPos = vec4(pos,1.0);
gl_Position = projection * view * newPos;
//fragTex = texCoord;
//outColour = colours;
}
i am unsure on where i am going wrong, whether it is the shader files, or the actualy code itself..

I am not experienced in JOGL, I am used to c++ GL. However there are several problems: First, as Reto Koradi stated you are using the same value to ebo, vbo and vao. It should be like,
gl.glGenVertexArrays(1, IntBuffer.wrap(tempV));
int vao = tempV[0];
gl.glGenBuffers(2, IntBuffer.wrap(tempB));
int vbo = tempB[0];
int ebo = tempB[1];
Lastly, your draw seems a bit problematic, you seem to skip a step."bind the array to want to draw." Then draw.
gl.glBindVertexArray (vao);
gl.glDrawElements(GL.GL_TRIANGLES, 2, GL.GL_UNSIGNED_INT, 0);
I hope these help.

Ok, after many frustrating hours. someone helped me with the solution. The issue wasnt making seperate buffers, but rather not clearing them each time, meaning i needed to do
gl.glGenVertexArrays(1, IntBuffer.wrap(temp));
//create vertice buffers
vao = temp[0];
gl.glGenBuffers(1, IntBuffer.wrap(temp));
vbo = temp[0];
gl.glGenBuffers(1, IntBuffer.wrap(temp));
ebo = temp[0];
which is similar to how Hakes however i didnt need a seperate temp, i just needed to clear the buffer each time. one other thing i needed to do was to also put
gl.glBindVertexArray(vao);
in the init as well as the draw.
(edit)
im actually not too sure gl.glBindVertexArray(vao); needed to be in the draw method