How to flip an Image in OpenGL? - android

I hate to ask such a dumb question but I just can't firgure out how to flip an image using Android OpenGL.
I try using gl.glScalef(-1,y,z) android gl.glRotatef(180,0,1,0) but when I do this the image flip but it also change the positions which I do not want. I'm sure there a easy way to do this I'm just not getting.
Here is my draw code:
public void draw(GL10 gl){
gl.glLoadIdentity();
gl.glTranslatef(position.x, position.y, 0);
gl.glRotatef(angle, rotX, rotY, rotZ);
gl.glScalef(scaleX, scaleY, scaleZ);
gl.glBindTexture(GL10.GL_TEXTURE_2D, textureId[0]);
gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
gl.glEnableClientState(GL10.GL_TEXTURE_COORD_ARRAY);
gl.glEnable(GL10.GL_BLEND);
gl.glVertexPointer(2, GL10.GL_FLOAT, 0, vertexsBuffer);
gl.glTexCoordPointer(2, GL10.GL_FLOAT, 0, textureBuffer);
gl.glDrawElements(GL10.GL_TRIANGLES, indices.length, GL10.GL_UNSIGNED_SHORT, indexBuffer);
gl.glDisableClientState(GL10.GL_VERTEX_ARRAY);
gl.glDisableClientState(GL10.GL_TEXTURE_COORD_ARRAY);
gl.glDisable(GL10.GL_BLEND);
if(animation == true){
PlayAnimations();
}
}

center the object (remember the translation)
perform the flipping by scaling to -1 with respect to the desired axis.
then "reverse translate" the object.
For more information, please grab yourself a copy of Computer Graphics by James D. Foley.
http://www.amazon.com/Computer-Graphics-Principles-Practice-2nd/dp/0201848406

You could use a different set of texture coordinates or use a texture matrix.

Related

Android OpenGL Texture Coloring

I'm trying to change color of my textures, I have 2 render methods inside my sprite, one without color params and one with, It works fine if there is just 1 object being rendered, but If i render for example 1 colored texture and 1 normal texture, both will be colored
I'm guessing I somehow have to reset the glTextEnvf state but I got no idea how.
Here is my source code
public void Render(GL10 gl)
{
gl.glBindTexture(GL10.GL_TEXTURE_2D,textures[0]);
gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
gl.glEnableClientState(GL10.GL_TEXTURE_COORD_ARRAY);
gl.glVertexPointer(2, GL10.GL_FLOAT,0, verticesBuffer);
gl.glTexCoordPointer(2, GL10.GL_FLOAT, 0, textureBuffer);
gl.glDrawArrays(GL10.GL_TRIANGLE_STRIP,0, vertices.length/2);
//RESTORE
gl.glDisableClientState(GL10.GL_VERTEX_ARRAY);
gl.glDisableClientState(GL10.GL_TEXTURE_COORD_ARRAY);
}
public void Render(GL10 gl,float r,float g,float b)
{
gl.glBindTexture(GL10.GL_TEXTURE_2D,textures[0]);
gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
gl.glEnableClientState(GL10.GL_TEXTURE_COORD_ARRAY);
gl.glColor4f(r,g,b,1.0f);
gl.glTexEnvf(GL10.GL_TEXTURE_ENV, GL10.GL_TEXTURE_ENV_MODE, GL10.GL_MODULATE);
gl.glVertexPointer(2, GL10.GL_FLOAT, 0, verticesBuffer);
gl.glTexCoordPointer(2, GL10.GL_FLOAT, 0, textureBuffer);
gl.glDrawArrays(GL10.GL_TRIANGLE_STRIP, 0, vertices.length / 2);
//RESTORE
gl.glDisableClientState(GL10.GL_VERTEX_ARRAY);
gl.glDisableClientState(GL10.GL_TEXTURE_COORD_ARRAY);
}
After you've called glDrawArrays in the sprite you want to be colored, set the color back to 1:
gl.glColor4f(1, 1, 1, 1);
Hope this helps

Drawing 2D on a GLSurfaceView

I am attempting to draw a 2D square on a GLSurfaceView in 2D mode. I can draw the object in 3D mode and have tested that the square is out in 3D space. I then try to configure the matrix for 2d drawing and when I attempt to draw my object nothing appears.
My GLSurfaceView instance implements GLSurfaceView.Renderer.
I've broken the setup into two functions:
private void prepare3Ddrawing(GL10 gl)
{
gl.glLoadIdentity();
gl.glViewport(0, 0, getWidth(), getHeight());
gl.glDisable(GL10.GL_DITHER);
gl.glEnable(GL10.GL_DEPTH_TEST);
gl.glEnable(GL10.GL_CULL_FACE);
gl.glMatrixMode(GL10.GL_PROJECTION);
gl.glLoadIdentity();
GLU.gluPerspective(gl, 45.0f, (float)getWidth()/(float)getHeight(),0.1f,100.0f);
}
private void prepare2Ddrawing(GL10 gl)
{
gl.glDisable(GL10.GL_CULL_FACE);
gl.glDisable(GL10.GL_DEPTH_TEST);
gl.glMatrixMode(GL10.GL_PROJECTION);
gl.glLoadIdentity();
GLU.gluOrtho2D(gl,0,getWidth(), 0, getHeight());
gl.glScalef(1, -1, 1);
gl.glTranslatef(0, -getHeight(), 0);
gl.glMatrixMode(GL10.GL_MODELVIEW);
}
And here is my draw method...
public void onDrawFrame(GL10 gl)
{
gl.glClear(GL10.GL_DEPTH_BUFFER_BIT|GL10.GL_COLOR_BUFFER_BIT);
prepare3Ddrawing(gl);
camera.draw(gl);
go2d.draw(gl);
prepare2Ddrawing(gl);
go2d.draw(gl);
}
and finally, my go2d object is an instance of an object I created called GameObject2d. It's draw method looks like this...
#Override
public void draw(GL10 gl)
{
super.draw(gl);
gl.glEnable(GL10.GL_TEXTURE_2D);
gl.glEnable(GL10.GL_ALPHA_TEST);
gl.glAlphaFunc(GL10.GL_GREATER, 0.0f);
gl.glEnableClientState(GL10.GL_TEXTURE_COORD_ARRAY);
gl.glTexCoordPointer(2,GL10.GL_FLOAT,0,textureBuffer);
gl.glBindTexture(GL10.GL_TEXTURE_2D, textureID);
gl.glBlendFunc(GL10.GL_SRC_ALPHA, GL10.GL_ONE_MINUS_SRC_ALPHA);
gl.glEnable(GL10.GL_BLEND);
gl.glFrontFace(GL10.GL_CW);
//gl.glEnable(GL10.GL_CULL_FACE);
gl.glCullFace(GL10.GL_BACK);
gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
gl.glVertexPointer(3, GL10.GL_FLOAT, 0, vertexBuffer);
gl.glDrawElements(GL10.GL_TRIANGLES, 6, GL10.GL_UNSIGNED_SHORT, indexBuffer);
gl.glDisableClientState(GL10.GL_VERTEX_ARRAY);
gl.glDisableClientState(GL10.GL_TEXTURE_COORD_ARRAY);
gl.glDisable(GL10.GL_CULL_FACE);
gl.glDisable(GL10.GL_ALPHA_TEST);
gl.glDisable(GL10.GL_TEXTURE_2D);
}
Does anyone have any ideas? Again, I am still able to see the 3D rendered version of the go2D object, but I do not see the 2D version.
Thanks.
As you don't include any data, I can only propose two methods to debug the issue.
Step 1: try to force your 2d - perspective matrix and modelview matrix to be Identity Matrices. Then if you force your Square data vertices inside the clip space (e.g.
x,y = +-1 or x,y= +-0.75, z=0, you should see a square appearing in the screen.
Step 2: now that the data model is correct, check what your model view and perspective matrices do: multiply each of your square vertices (x,y,z, w=1) with ModelView Matrix * CameraMatrix * PerspectiveMatrix. What do you get? Are the x,y,z much outside |w| ?

How to set on texture on top of another texture in android using OPEN GL

I have been searching for this for the pass two days .I am developing an android game using Open GL in which there is a situation where i have to display two images at the same time, one should be the background image and second one is displayed depending on a condition.
I have displayed the background imgae using Open GL Texture property.But when i tried to display the second image by using texture first one is not displaying.Since i am dealing with multiple texture i have used a GLTexture class to manipulate the texture (http://tkcodesharing.blogspot.in/2008/05/working-with-textures-in-androids.html).Even then i am not able to display two images at the same time.
Here is some code :
public void onSurfaceCreated(GL10 gl, EGLConfig config) {
glTextures= new GLTextures(gl,this.context);//class to manipulate textures
//adding image resources
this.glTextures.add(R.drawable.back);
this.glTextures.add(R.drawable.hand);
//loading texture
this.glTextures.loadTextures();
gl.glEnable(GL10.GL_TEXTURE_2D);
...
}
In onDrawFrame
gl.glClear(GL10.GL_COLOR_BUFFER_BIT|GL10.GL_DEPTH_BUFFER_BIT);
gl.glLoadIdentity();
gl.glTranslatef(0.0f, 0.0f, -3.5f);
glTextures.setTexture(R.drawable.back);//it will bind this particular texture for drawing
draw(gl);
if(condition == 1){
gl.glLoadIdentity();
gl.glTranslatef(0.0f, 1.0f, -7.0f);
glTextures.setTexture(R.drawable.hand);
drawSecond(gl);
}
////////////////////////////////////////////////////////
In draw code
public void draw(GL10 gl){
gl.glActiveTexture(GL10.GL_TEXTURE0);
gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
gl.glEnableClientState(GL10.GL_TEXTURE_COORD_ARRAY);
gl.glFrontFace(GL10.GL_CW);
gl.glVertexPointer(3, GL10.GL_FLOAT, 0, vertexBuffer);
gl.glTexCoordPointer(2, GL10.GL_FLOAT, 0, textureBuffer);
gl.glDrawArrays(GL10.GL_TRIANGLE_STRIP, 0, vertices.length/3);
gl.glDisableClientState(GL10.GL_TEXTURE_COORD_ARRAY);
gl.glDisableClientState(GL10.GL_VERTEX_ARRAY);
}
public void drawSecond(GL10 gl){
gl.glActiveTexture(GL10.GL_TEXTURE1);
gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
gl.glEnableClientState(GL10.GL_TEXTURE_COORD_ARRAY);
//GLES20.glUniform1i(isShaked, 1);
gl.glFrontFace(GL10.GL_CW);
gl.glVertexPointer(3, GL10.GL_FLOAT, 0, vertexBuffer);
gl.glTexCoordPointer(2, GL10.GL_FLOAT, 0, textureBuffer);
gl.glDrawArrays(GL10.GL_TRIANGLE_STRIP, 0, vertices.length/3);
gl.glDisableClientState(GL10.GL_TEXTURE_COORD_ARRAY);
gl.glDisableClientState(GL10.GL_VERTEX_ARRAY);
}
remove "gl.glActiveTexture(GL10.GL_TEXTURE0);" and gl.glActiveTexture(GL10.GL_TEXTURE1);
lines from the rendering code.
you use multiple texture units only if you need multi-texturing,
which is using multiple textures in one draw call.
just bind the first texture to the active texture unit (default to GL_TEXTURE0) and draw the first triangle strip, than bind the second texture (without changing the active texture unit GL_TEXTURE0) and draw the second triangle strip.

How to efficiently draw 2d with openGl es?

Originally I was using the canvas to draw my bitmaps in a 2d real time action type game, but for some reason my frame rate was terrible. I suspected it was the canvas so I switched to opengl. From surfing on the internet I learned to create a rectangle from 2 triangles and set a texture on it. I used glOrthof to set it up the 2d perspective and used the gltranslatef method to move my textures. I know the problem isn't the physics or anything because I tested moving a single texture at a constant velocity, (The x value moving at about 7 units per 33 milliseconds). It was still choppy. I set the fps to 30. This is my game loop:
public void onDrawFrame(GL10 gl) {
startTime = System.nanoTime();
gl.glClearColor(0f, .0f, .8f, 0.5f);
gl.glClear(GL10.GL_COLOR_BUFFER_BIT | GL10.GL_DEPTH_BUFFER_BIT);
g.updatePhysics();
onDraw(gl);
sleepTime = (int) (TICKS_INTERVAL - (System.nanoTime() - startTime)/1000000);
if(sleepTime > 0){
try{
Thread.sleep(sleepTime);
}catch(Exception e){}
}
}
and this is how they're being drawn:
public void onDraw(GL10 gl){
gl.glLoadIdentity();
if(g.state == g.STATE_GAME){
gl.glTranslatef(x, y, z);
rectangle.draw(gl);
gl.glLoadIdentity();
gl.glTranslatef(x, y, z);
rectangle2.draw()gl;
}
}
And this is the draw method within the rectangle:
public void draw(GL10 gl){
gl.glBindTexture(GL10.GL_TEXTURE_2D, textures[0]);
gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
gl.glEnableClientState(GL10.GL_TEXTURE_COORD_ARRAY);
gl.glFrontFace(GL10.GL_CW);
gl.glEnable(GL10.GL_BLEND);
gl.glBlendFunc(GL10.GL_ONE, GL10.GL_ONE_MINUS_SRC_ALPHA);
gl.glVertexPointer(3, GL10.GL_FLOAT, 0, vertBuff);
gl.glTexCoordPointer(2, GL10.GL_FLOAT, 0, textureBuff);
gl.glDrawElements(GL10.GL_TRIANGLES, pIndex.length, GL10.GL_UNSIGNED_SHORT, pBuff);// Draw the vertices as triangle strip
//gl.glDrawArrays(GL10.GL_TRIANGLE_STRIP, 0, vertices.length / 3);
gl.glDisableClientState(GL10.GL_VERTEX_ARRAY);
gl.glDisableClientState(GL10.GL_TEXTURE_COORD_ARRAY);
}
Even when I set the frame rate to 60 there's still some stuttering, and it's frustrating because for the past month I've been just trying to get the frame rate smooth. I'm testing on a galaxy s2 so I know it isn't the hardware. If all this code is right, do you think maybe it could be something else in the activity? My GLSurfaceView is actually a custom view. Even getting a single texture to move smoothly at a constant velocity would be nice.

I need help adding a second texture to glSurfaceView

I used harism's page curl ( Harism, thanx a lot for this excelent library!) for android to develop a commercial application - an electronic magazine.
I wrapped everything that should have been around the app, that is xml - rpc fetching of the magazine pages, caching, loaders, my own bitmap provider, custom gesture event handlers etc...
But, i have a very big problem that no matter how i tried i cannot solve myself.
I need to implement a real book functionality, meaning that when the page is oriented in a landscape mode, i need pairs of pages ( initial screen - left blank, right cover. First flip = left page 1, right page 2. Second flip = left page 3, right page 4... )
I read the info Harism gave to people that asked the same thing on github on the issue they opened concerning this, but that is simply not enough with my limited knowledge of openGL es.
I understand i need to implement a backside texture, but can anyone please be a bit more detailed on this issue? I hit a dead end trying to do it myself and i'm in dire need of help.
If there is ANY need for additional code posting - let me know, i will be more willing to post any / all of the code.
Thanks!
EDIT re- reading it i realized i should have been more detailed. The page that is curling has a texture that is the bitmap of the actual page. At the current setting, the bitmap front and back are rendered separately, but it is the same texture. I need the back one to be the different one.
Some code that does the actual rendering:
/**
* Draws our mesh.
*/
public synchronized void draw(GL10 gl) {
// First allocate texture if there is not one yet.
if (DRAW_TEXTURE && mTextureIds == null) {
// Generate texture.
mTextureIds = new int[1];
gl.glGenTextures(1, mTextureIds, 0);
// Set texture attributes.
gl.glBindTexture(GL10.GL_TEXTURE_2D, mTextureIds[0]);
gl.glTexParameterf(GL10.GL_TEXTURE_2D, GL10.GL_TEXTURE_MIN_FILTER,
GL10.GL_LINEAR);
gl.glTexParameterf(GL10.GL_TEXTURE_2D, GL10.GL_TEXTURE_MAG_FILTER,
GL10.GL_LINEAR);
gl.glTexParameterf(GL10.GL_TEXTURE_2D, GL10.GL_TEXTURE_WRAP_S,
GL10.GL_CLAMP_TO_EDGE);
gl.glTexParameterf(GL10.GL_TEXTURE_2D, GL10.GL_TEXTURE_WRAP_T,
GL10.GL_CLAMP_TO_EDGE);
}
// If mBitmap != null we have a new texture.
if (DRAW_TEXTURE && mBitmap != null) {
gl.glBindTexture(GL10.GL_TEXTURE_2D, mTextureIds[0]);
GLUtils.texImage2D(GL10.GL_TEXTURE_2D, 0, mBitmap, 0);
mBitmap = null;
}
if (DRAW_TEXTURE) {
gl.glBindTexture(GL10.GL_TEXTURE_2D, mTextureIds[0]);
}
// Some 'global' settings.
gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
// TODO: Drop shadow drawing is done temporarily here to hide some
// problems with its calculation.
if (DRAW_SHADOW) {
gl.glEnable(GL10.GL_BLEND);
gl.glBlendFunc(GL10.GL_SRC_ALPHA, GL10.GL_ONE_MINUS_SRC_ALPHA);
gl.glEnableClientState(GL10.GL_COLOR_ARRAY);
gl.glColorPointer(4, GL10.GL_FLOAT, 0, mShadowColors);
gl.glVertexPointer(3, GL10.GL_FLOAT, 0, mShadowVertices);
gl.glDrawArrays(GL10.GL_TRIANGLE_STRIP, 0, mDropShadowCount);
gl.glDisableClientState(GL10.GL_COLOR_ARRAY);
gl.glDisable(GL10.GL_BLEND);
}
// Enable texture coordinates.
if (DRAW_TEXTURE) {
gl.glEnableClientState(GL10.GL_TEXTURE_COORD_ARRAY);
gl.glTexCoordPointer(2, GL10.GL_FLOAT, 0, mTexCoords);
}
gl.glVertexPointer(3, GL10.GL_FLOAT, 0, mVertices);
// Enable color array.
gl.glEnableClientState(GL10.GL_COLOR_ARRAY);
gl.glColorPointer(4, GL10.GL_FLOAT, 0, mColors);
// Draw blank / 'white' front facing vertices.
gl.glDisable(GL10.GL_TEXTURE_2D);
gl.glDrawArrays(GL10.GL_TRIANGLE_STRIP, 0, mVerticesCountFront);
// Draw front facing texture.
// TODO: Decide whether it's really needed to have alpha blending for
// front facing texture. If not, GL_BLEND isn't needed, possibly
// increasing performance. The heck, is it needed at all?
if (DRAW_TEXTURE) {
gl.glEnable(GL10.GL_BLEND);
gl.glEnable(GL10.GL_TEXTURE_2D);
gl.glBlendFunc(GL10.GL_SRC_ALPHA, GL10.GL_ONE_MINUS_SRC_ALPHA);
gl.glDrawArrays(GL10.GL_TRIANGLE_STRIP, 0, mVerticesCountFront);
gl.glDisable(GL10.GL_TEXTURE_2D);
gl.glDisable(GL10.GL_BLEND);
}
int backStartIdx = Math.max(0, mVerticesCountFront - 2);
int backCount = mVerticesCountFront + mVerticesCountBack - backStartIdx;
// Draw blank / 'white' back facing vertices.
gl.glDrawArrays(GL10.GL_TRIANGLE_STRIP, backStartIdx, backCount);
// Draw back facing texture.
if (DRAW_TEXTURE) {
gl.glEnable(GL10.GL_BLEND);
gl.glEnable(GL10.GL_TEXTURE_2D);
gl.glBlendFunc(GL10.GL_SRC_ALPHA, GL10.GL_ONE_MINUS_SRC_ALPHA);
gl.glDrawArrays(GL10.GL_TRIANGLE_STRIP, backStartIdx, backCount);
gl.glDisable(GL10.GL_TEXTURE_2D);
gl.glDisable(GL10.GL_BLEND);
}
// Disable textures and color array.
gl.glDisableClientState(GL10.GL_TEXTURE_COORD_ARRAY);
gl.glDisableClientState(GL10.GL_COLOR_ARRAY);
if (DRAW_POLYGON_OUTLINES) {
gl.glEnable(GL10.GL_BLEND);
gl.glBlendFunc(GL10.GL_SRC_ALPHA, GL10.GL_ONE_MINUS_SRC_ALPHA);
gl.glLineWidth(1.0f);
gl.glColor4f(0.5f, 0.5f, 1.0f, 1.0f);
gl.glVertexPointer(3, GL10.GL_FLOAT, 0, mVertices);
gl.glDrawArrays(GL10.GL_LINE_STRIP, 0, mVerticesCountFront);
gl.glDisable(GL10.GL_BLEND);
}
if (DRAW_CURL_POSITION) {
gl.glEnable(GL10.GL_BLEND);
gl.glBlendFunc(GL10.GL_SRC_ALPHA, GL10.GL_ONE_MINUS_SRC_ALPHA);
gl.glLineWidth(1.0f);
gl.glColor4f(1.0f, 0.5f, 0.5f, 1.0f);
gl.glVertexPointer(2, GL10.GL_FLOAT, 0, mCurlPositionLines);
gl.glDrawArrays(GL10.GL_LINES, 0, mCurlPositionLinesCount * 2);
gl.glDisable(GL10.GL_BLEND);
}
if (DRAW_SHADOW) {
gl.glEnable(GL10.GL_BLEND);
gl.glBlendFunc(GL10.GL_SRC_ALPHA, GL10.GL_ONE_MINUS_SRC_ALPHA);
gl.glEnableClientState(GL10.GL_COLOR_ARRAY);
gl.glColorPointer(4, GL10.GL_FLOAT, 0, mShadowColors);
gl.glVertexPointer(3, GL10.GL_FLOAT, 0, mShadowVertices);
gl.glDrawArrays(GL10.GL_TRIANGLE_STRIP, mDropShadowCount,
mSelfShadowCount);
gl.glDisableClientState(GL10.GL_COLOR_ARRAY);
gl.glDisable(GL10.GL_BLEND);
}
gl.glDisableClientState(GL10.GL_VERTEX_ARRAY);
}
I suppose i should tamper with :
// Draw back facing texture.
if (DRAW_TEXTURE) {
gl.glEnable(GL10.GL_BLEND);
gl.glEnable(GL10.GL_TEXTURE_2D);
gl.glBlendFunc(GL10.GL_SRC_ALPHA, GL10.GL_ONE_MINUS_SRC_ALPHA);
gl.glDrawArrays(GL10.GL_TRIANGLE_STRIP, backStartIdx, backCount);
gl.glDisable(GL10.GL_TEXTURE_2D);
gl.glDisable(GL10.GL_BLEND);
}
And provide it with a sepparate bitmap, but i don't know how to do this.
Thanks again
EDIT: I started a mega- bounty, i really need this answered... :)
My openGL knowledge is also limited but I had a similar issue in the past.
To have two textures you will need, at least, to modify this line:
gl.glGenTextures(2, mTextureIds, 0);
Here you have an example of how to use more than one texture.

Categories

Resources