I can use the below code to scale and translate a square using OpenGLES. But I'm not sure how to calculate the translation and scale factors. For example using the below picture of the OpenGL coordinate system and Matrix.translateM(mViewMatrix, 0, .5f, 0, 0); I would expect the square to be drawn halfway to the right of the screen, but instead it's drawn halfway to the left from the center. However Matrix.translateM(mViewMatrix, 0, 0, .5f, 0); does translate the square halfway up the screen from the center.
How would I translate and scale in order to programmatically draw N squares side by side horizontally filling the top of the screen?
#Override
public void onDrawFrame(GL10 unused) {
// Draw background color
GLES20.glClear(GLES20.GL_COLOR_BUFFER_BIT | GLES20.GL_DEPTH_BUFFER_BIT);
// Set the camera position (View matrix)
Matrix.setLookAtM(mViewMatrix, 0, 0, 0, -3, 0f, 0f, 0f, 0f, 1.0f, 0.0f);
// Translate by some amount
// Matrix.translateM(mViewMatrix, 0, ?, ?, 0);
// Scale by some amount
// Matrix.scaleM(mViewMatrix, 0, ?, ?, 1);
// Calculate the projection and view transformation
Matrix.multiplyMM(mMVPMatrix, 0, mProjectionMatrix, 0, mViewMatrix, 0);
// Draw square
mSquare.draw(mMVPMatrix);
}
I am not sure why you would need translate and scale to fill up a row of squares. To get rows of squares programmatically in openGL ES I would just make a bunch of squares initialized where you want them. An edited snippet from one of my projects went something like this:
public void onSurfaceCreated(GL10 unused, EGLConfig config){
GLES20.glClearColor(bgr, bgg, bgb, bga);
float z=0.0f;
float y=0.0f;
for(float i=(-worldwidth);i<worldwidth;i+=(cellwidth)){
square=new Square(i,y,z);
cellvec.addElement(square);
}
}
public void onDrawFrame(GL10 unused) {
GLES20.glClear(GLES20.GL_COLOR_BUFFER_BIT | GLES20.GL_DEPTH_BUFFER_BIT);
Matrix.setLookAtM(mViewMatrix, 0, 0, 0, -3, 0f, 0f, 0f, 0f, 1.0f, 0.0f);
Matrix.multiplyMM(mMVPMatrix, 0, mProjectionMatrix, 0, mViewMatrix, 0);
for(int i=0;i<cellvec.size();i++){
cellvec.elementAt(i).draw(mMVPMatrix);
}
}
I am not entirely sure if something like this is what your looking for but it it seems to get the result of a row of squares like you wanted.
Related
I'm attempting to get a texture to show up on on a square made from a triangle fan, the texture is made from a Canvas.
The main color is just yellow and a smaller box is drawn inside of it, but the final texture is just solid yellow.
Yellow square with no texture (picture)
Fragment shadder:
public static final String fragmentShaderCode_TEXTURED =
"precision mediump float;" +
"varying vec2 v_texCoord;" +
"uniform sampler2D s_texture;" +
"void main() {" +
//"gl_FragColor = vColor;"+
" gl_FragColor = texture2D( s_texture, v_texCoord );" +
"}";
Texture generation:
public static int loadGLTexture(String s){
Rect r = new Rect();
ThreadDat.get().paint.getTextBounds(s, 0, 1, r); //get string dimensions, yeilds 8x9 pxls
Bitmap bitmap = Bitmap.createBitmap(bestSize(r.width()),bestSize(r.height()), Bitmap.Config.ARGB_8888);
//example size is 16x16pxls
Log.i("TextureSize", r.width() + " " + r.height());
Canvas c = new Canvas(bitmap);
//some temporary test code setting the background yellow
//Paint colors are stored per thread, only one right now
ThreadDat.get().paint.setARGB(255, 255, 255, 0);
c.drawRect(0, 0, c.getWidth(), c.getHeight(), ThreadDat.get().paint);
//type the letter, in this case "A" in blue
ThreadDat.get().paint.setARGB(255, 0, 0, 255);
ThreadDat.get().paint.setTypeface(Typeface.create("Consolas", Typeface.NORMAL));
c.drawText(s.charAt(0) + "", 0, 0, ThreadDat.get().paint);
//draw another square that is half width and height, should be Blue
c.drawRect(0, 0, c.getWidth() / 2, c.getHeight() / 2, ThreadDat.get().paint);
return loadTexture(bitmap);
}
Draw code:
#Override
public void draw() {
//clearing any error to check if program has an error
GLES20.glGetError();
//get the compiled shader for textured shapes
int prgm = MyGLRenderer.getSTRD_TXTR_SHDR();
GLES20.glUseProgram(prgm);
//check for new errors and log to logcat (nothing)
MyGLRenderer.logError();
//setup projection view matrix
float[] scratch = new float[16];
Matrix.setIdentityM(scratch, 0);
Matrix.multiplyMM(scratch, 0, MyGLRenderer.getmMVPMatrix(), 0, scratch, 0);
//apply translations to matrix
Matrix.translateM(scratch, 0, xOffset, yOffset, zOffset);
Matrix.setRotateEulerM(scratch, 0, yaw, pitch, roll);
//get vPosition variable handle from chosen shader
mPosHandle = GLES20.glGetAttribLocation(prgm, "vPosition");
GLES20.glEnableVertexAttribArray(mPosHandle);
GLES20.glVertexAttribPointer(mPosHandle, COORDS_PER_VERTEX, GLES20.GL_FLOAT,
false, VERTEX_STRIDE, vertexBuffer);
////pass color data (set to white)
//mColorHandle = GLES20.glGetUniformLocation(prgm, "vColor");
//GLES20.glUniform4fv(mColorHandle, 1, color, 0);
//use texture0
GLES20.glActiveTexture(GLES20.GL_TEXTURE0);
//use texture from -> int textureID = MyGLRenderer.loadGLTexture("A");
GLES20.glBindTexture(GLES20.GL_TEXTURE_2D, textureID);
//get handel for "uniform sampler2D s_texture;" to set value
int txtureHandle = GLES20.glGetUniformLocation(prgm, "s_texture");
GLES20.glUniform1i(txtureHandle, 0); //set s_texture to use binded texture 0
//pass in texture coords (u,v / s,t)
int textureCoordHndl = GLES20.glGetAttribLocation(prgm, "a_texCoord");
GLES20.glVertexAttribPointer(textureCoordHndl, 2/*size, 2 points per vector*/,
GLES20.GL_FLOAT, false, 0, textureBuffer);
//pass in the model view projection matrix
mMVPMatrixHandle = GLES20.glGetUniformLocation(prgm, "uMVPMatrix");
GLES20.glUniformMatrix4fv(mMVPMatrixHandle, 1, false, scratch, 0);
GLES20.glDrawArrays(GLES20.GL_TRIANGLE_STRIP, 0, vertex_count);
GLES20.glDisableVertexAttribArray(mPosHandle);
MyGLRenderer.logError();
}
I tried using the same coordinate set as used in this example:
Vertices for square:
{ 0, 0, 0, //bottom left
0, height, 0, //topLeft
width, 0, 0, // bottom Right
width, height, 0)}; //topRight
Texture coords:
0.0f, 1.0f, // top left (V2)
0.0f, 0.0f, // bottom left (V1)
1.0f, 1.0f, // top right (V4)
1.0f, 0.0f // bottom right (V3)
Similar Issue
This does sound like there is an issue with texture coordinates. Since the whole thing is yellow I would suspect that the v_texCoord is always (0,0) in your fragment shader so the first texture pixel is being repeated.
The texture itself seems to be ok since the color is being drawn. Without the texture you would most likely see a black rectangle.
Anyway to handle such issues you need to be a bit inventive in debugging, testing. For testing the coordinates use gl_FragColor = vec4( v_texCoord.x, v_texCoord.y, .0, 1.0 );. This should output a gradient rectangle where top left is black, top right is red, bottom left is green. If you do not see this result then your texture coordinates are incorrect. In this case first check if the varying is correctly connected from the vertex shader. You may use v_texCoord = vec2(1.0, 0.0) in the vertex shader and the result should be a red rectangle (assuming you still have the previous test in the fragment shader). If the rectangle is red then the issue is most likely in your handles and not in the shaders (otherwise the varying is incorrectly set. Maybe a mismatch in naming). Check what is the value of the handle textureCoordHndl. If this is a negative value then the handle was not connected. This is most likely due to a mismatch in the naming.
From further inspection:
You are missing the enabling of the attribute for texture coordinates GLES20.glEnableVertexAttribArray(textureCoordHndl);. Remember that each of the attributes must be enabled before you use them.
I'm trying to display a simple textured trapezoid (a road in perspective). For this I'm using SpriteBatch.draw with vertexes array as a parameter. But the result is unexpected.
What I expected:
What I got:
What exactly gone wrong? Or maybe I'm using the wrong method?
Here is the code:
#Override
public void create () {
texture = new Texture("road.jpg");
spriteBatch = new SpriteBatch();
float color = Color.toFloatBits(255, 255, 255, 255);
verts = new float[]{
0, 0, color, 0, 0,
Gdx.graphics.getWidth()/2-100, 300, color, 0, 1,
Gdx.graphics.getWidth()/2+100, 300, color, 1, 1,
Gdx.graphics.getWidth(), 0, color, 1, 0,
};
shapeRenderer = new ShapeRenderer();
}
#Override
public void render () {
Gdx.gl.glClearColor(0, 0.5f, 1f, 1);
Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
shapeRenderer.begin(ShapeRenderer.ShapeType.Filled);
shapeRenderer.rect(0, 0, 640, 300);
shapeRenderer.end();
spriteBatch.begin();
spriteBatch.draw(texture, verts, 0, verts.length);
spriteBatch.end();
}
From documentation
draw(Texture texture, float[] spriteVertices, int offset, int count)
Draws a rectangle using the given vertices.
LibGDX draws these rectangles as two triangles, so it splits the texture. The problem is that these triangles in rectangle are the same size, but in trapezoid they are not, so they become distorted.
Solution would be to use projection or mesh.
I am new in with Java OpenGL (JOGL). I want to display a 3D cube in JOGL.
I have vertex array information with me.
double vertices[]= {
0 0 0,
0 0 1,
0 1 0,
0 1 1,
1 0 0,
1 0 1,
1 1 0,
1 1 1,
};
I want to use glDrawArrays() to display it. Since I have display a model having a huge amount of vertices.
The display method is given below.
public void display(GLAutoDrawable drawable) {
GL2 gl = drawable.getGL().getGL2();
gl.glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
gl.glLoadIdentity();
gl.glBegin(GL_TRIANGLE_STRIP);
gl.glEnd();
}
I need to use GL_TRIANGLES or GL_TRIANGLE_STRIP only and not GL_QUADS.
If anyone knows how to use glDrawArrays(); in JOGL please help me. I want JOGL syntax and not opengl.
If you want to use glDrawArrays(); then you have to create a VBO (Vertex Buffer Objects) or a VA (Vertex Arrays). If you're after speed, then choose VBO, though they require some extra lines of code to be made!
The best way I think I can explain how to create a VBO to you, is by giving you an example!
VBO Example
Here is a little example of a VBO storing Vertices and Colors for a Triangle and rendering it and also how to delete it!
Creating the VBO
This is the code where you create the actual Vertex and Color Buffer and bind them to the VBO.
int vertices = 3;
int vertex_size = 3; // X, Y, Z,
int color_size = 3; // R, G, B,
FloatBuffer vertex_data = BufferUtils.createFloatBuffer(vertices * vertex_size);
vertex_data.put(new float[] { -1f, -1f, 0f, });
vertex_data.put(new float[] { 1f, -1f, 0f, });
vertex_data.put(new float[] { 1f, 1f, 0f, });
vertex_data.flip();
FloatBuffer color_data = BufferUtils.createFloatBuffer(vertices * color_size);
color_data.put(new float[] { 1f, 0f, 0f, });
color_data.put(new float[] { 0f, 1f, 0f, });
color_data.put(new float[] { 0f, 0f, 1f, });
color_data.flip();
int vbo_vertex_handle = glGenBuffers();
glBindBuffer(GL_ARRAY_BUFFER, vbo_vertex_handle);
glBufferData(GL_ARRAY_BUFFER, vertex_data, GL_STATIC_DRAW);
glBindBuffer(GL_ARRAY_BUFFER, 0);
int vbo_color_handle = glGenBuffers();
glBindBuffer(GL_ARRAY_BUFFER, vbo_color_handle);
glBufferData(GL_ARRAY_BUFFER, color_data, GL_STATIC_DRAW);
glBindBuffer(GL_ARRAY_BUFFER, 0);
You can of course add more Vertices and Colors to the vertex_data and color_data if you want to! But always remember that the amount of vertex data, need to match with the amount of color data and vice versa!
Important: Only create the VBO(s) once, and only update them when necessary! Don't create them for each frame, since them you will end up with a frame-rate worse than when using immediate mode for rendering!
Rendering the VBO
This is the code you need to call, to render the VBO.
glBindBuffer(GL_ARRAY_BUFFER, vbo_vertex_handle);
glVertexPointer(vertex_size, GL_FLOAT, 0, 0l);
glBindBuffer(GL_ARRAY_BUFFER, vbo_color_handle);
glColorPointer(color_size, GL_FLOAT, 0, 0l);
glEnableClientState(GL_VERTEX_ARRAY);
glEnableClientState(GL_COLOR_ARRAY);
glDrawArrays(GL_TRIANGLES, 0, vertices);
glDisableClientState(GL_COLOR_ARRAY);
glDisableClientState(GL_VERTEX_ARRAY);
Deleting the VBO
Then when you're done with the VBO and you don't need it anymore, you can delete it by doing the following.
glDeleteBuffers(vbo_vertex_handle);
glDeleteBuffers(vbo_color_handle);
I can't run my app on my phone, and I'v located the error, yet lack the knowledge in programming and in english to repair it.
The app run's on emulator perfectly, without any errors in code neither in opengl. Yet on the phone everything runs fine without any errors, but show no opengl elements which i want to draw. I'v added glGetError almost everythere in my code, and found the error 1282 generated after glDrawElements which is GL_INVALID_OPERATION.
GL_INVALID_OPERATION is generated if a non-zero buffer object name is bound to an
enabled array or the element array and the buffer object's data store is currently mapped.
GL_INVALID_OPERATION is generated if glDrawElements is executed between
the execution of glBegin and the corresponding glEnd.
I have no glBegin or glEnd in my code, so i guess the problem is in my indexbuffer. Below i present you everthing i have with the indexbuffer.
private ShortBuffer _indexBuffer;
public void onDrawFrame(GL10 gl) {
FramesPerSecond.StartCounter();
gl.glClear(GL10.GL_COLOR_BUFFER_BIT | GL10.GL_DEPTH_BUFFER_BIT);
gl.glVertexPointer(3, GL10.GL_FLOAT, 0, _vertexBuffer);
gl.glBindTexture(GL10.GL_TEXTURE_2D, textures[0]);
gl.glEnableClientState(GL10.GL_TEXTURE_COORD_ARRAY);
gl.glTexCoordPointer(2, GL10.GL_FLOAT, 0, textureBuffer);
for (int i = 1; i <= 10; i++) {
gl.glLoadIdentity();
gl.glTranslatef(0.0f, -1f, -1.0f + -1.5f * i);
gl.glRotatef(-_xAngle, 1f, 0f, 0f);
gl.glRotatef(-_yAngle, 0f, 1f, 0f);
gl.glDrawElements(GL10.GL_TRIANGLES, _nrOfVertices, GL10.GL_UNSIGNED_SHORT, _indexBuffer);
Log.e("Warning", " error code " +gl.glGetError());
}
Code of buffer in my object initialization function:
short[] indeksai = new short[] {
0, 1, 3,
0, 2, 1,
0, 3, 2,
1, 2, 3,
};
ByteBuffer ibb = ByteBuffer.allocateDirect(indeksai.length * 2);
ibb.order(ByteOrder.nativeOrder());
_indexBuffer = ibb.asShortBuffer();
_indexBuffer.put(indeksai);
And that's basicaly everything i have done with this buffer.
On surfaceCreated function >>
public void onSurfaceCreated(GL10 gl, EGLConfig config) {
Log.i(LOG_TAG, "onSurfaceCreated()");
gl.glMatrixMode(GL10.GL_PROJECTION);
float ratio = _width / _height;
gl.glOrthof(-1, 1, -1 / ratio, 1 / ratio, 0.01f, 100.0f);
gl.glViewport(0, 0, (int) _width, (int) _height);
gl.glMatrixMode(GL10.GL_MODELVIEW);
gl.glEnable(GL10.GL_DEPTH_TEST);
gl.glClearColor(0f, 0f, 0f, 1.0f);
gl.glEnable(GL10.GL_CULL_FACE);
gl.glFrontFace(GL10.GL_CCW);
gl.glCullFace(GL10.GL_BACK);
gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
gl.glEnableClientState(GL10.GL_COLOR_ARRAY);
initTriangle(gl, context);
try {
loadGLTexture(gl);
} catch (IOException e) {
Log.w(LOG_TAG, "Texture fail");
}
gl.glEnable(GL10.GL_TEXTURE_2D);
gl.glShadeModel(GL10.GL_SMOOTH);
gl.glClearColor(0.0f, 0.0f, 0.0f, 0.5f);
gl.glClearDepthf(1.0f);
gl.glEnable(GL10.GL_DEPTH_TEST);
gl.glDepthFunc(GL10.GL_LEQUAL);
gl.glHint(GL10.GL_PERSPECTIVE_CORRECTION_HINT, GL10.GL_NICEST);
}
It's most likely because you're enabling GL_COLOR_ARRAY but never actually setting the glColorPointer. Try commenting out the gl.glEnableClientState(GL10.GL_COLOR_ARRAY); line.
I'm trying to have no size difference from sprites, if you increase the z to far away.
however i have no luck, it still gets smaller:
||EDIT||
I now have these methods
public void onSurfaceCreated(GL10 gl, EGLConfig config) {
float _width = 320f;
float _height = 480f;
gl.glDisable(GL10.GL_DEPTH_TEST);
gl.glMatrixMode(GL10.GL_PROJECTION);
gl.glLoadIdentity();
gl.glOrthof(0, _width, 0, _height, 1, 100);
gl.glMatrixMode(GL10.GL_MODELVIEW);
gl.glLoadIdentity();
// Load textures ,
gl.glEnable(GL10.GL_TEXTURE_2D);
for (int a = 0; a < squares.length; a++) {
squares[a].loadGLTexture(gl, context);
}
}
.
public void onDrawFrame(GL10 gl) {
//Clear Screen And Depth Buffer
gl.glClear(GL10.GL_COLOR_BUFFER_BIT | GL10.GL_DEPTH_BUFFER_BIT);
gl.glLoadIdentity(); //Reset The Current Modelview Matrix
gl.glTranslatef(.0f, 1.0f, locZ);
squares[0].draw(gl);
gl.glLoadIdentity();
gl.glTranslatef(0.5f, 0.f, locZ);
squares[1].draw(gl);
gl.glLoadIdentity();
gl.glTranslatef(-0.5f, -0.5f, locZ);
squares[2].draw(gl);
gl.glLoadIdentity();
gl.glTranslatef(-0.5f, -0.5f, locZ);
squares[3].draw(gl);
//change zvalues
if(locZ >= 4.0f){
speedZ *= -1.0f;
locZ = 3.9f;
}
else if(locZ <= -4.0){
speedZ *= -1.0f;
locZ = -3.9f;
}
locZ += speedZ;
}
I'm changing the z-values, and therefor the distance from the 'camera', and expecting that since I don't want to use perspective(orthographic mode), the sizes of the squares should stay constant. But they don't. Hope this helps some more.
You have bad glOrtho parameters:
gl.glOrthof(0, width, 0, height, 0.01f, 100.0f);
Or
gl.glOrthof(0, width, height, 0, 0.01f, 100.0f);
EDIT: forget to reset matrix - glLoadIdentity.
public void onDrawFrame(GL10 gl) {
gl.glClear(GL10.GL_COLOR_BUFFER_BIT | GL10.GL_DEPTH_BUFFER_BIT);
gl.glMatrixMode(GL10.GL_PROJECTION);
gl.glLoadIdentity();
/* SET NEW PROJECTION HERE: ortho or perspective */
gl.glOrthof(0, _width, 0, _height, 0.001f, 100);
gl.glMatrixMode(GL10.GL_MODELVIEW);
gl.glLoadIdentity();
/* SET NEW MODELVIEW MATRIX( space transformation ) HERE and DRAW YOUR STUFF */
//change zvalues
if(locZ >= 99.0f){
speedZ *= -1.0f;
locZ = 99.0f;
}
else if(locZ <= 1.0){
speedZ *= -1.0f;
locZ = 1.0f;
}
}
These steps have to be done before rendering 2D, resp. moving from 3D projection to 2D projection, not when creating texture or any object. Don't know much about public void onSurfaceCreated, but it doesn't seem to be part of rendering loop.
So the origin is in the middle of your GLSurfaceView, it's not a bad idea to do something like:
gl.glOrthof(-width/2, width/2, -height/2, height/2, 0.1f, 100.0f);
here you could have two methods; one to switch to orthoscopic view in which one openGLUnit = one screen pixel for drawing in 2d on screen. Then the next method switches it back to 3d drawing. Do your 2d drawing after rendering 3d and first call the switchToOrtho method and when your finished call the switchBackToFrustum method.
public void switchToOrtho() {
glDisable(GL_DEPTH_TEST);
glMatrixMode(GL_PROJECTION);
glPushMatrix();
glLoadIdentity();
glOrthof(0, self.view.bounds.size.width, 0, self.view.bounds.size.height, -5, 1); glMatrixMode(GL_MODELVIEW); glLoadIdentity();
}
public void switchBackToFrustum() {
glEnable(GL_DEPTH_TEST);
glMatrixMode(GL_PROJECTION);
glPopMatrix();
glMatrixMode(GL_MODELVIEW);
}