Moving image on OpenGl using px? - android

I am using OpenGl to draw an image. Now when i try to move the image, it moves by too much. So if i say the following:
gl.glTranslatef(0, 1, -5.0f);
squirrel.draw(gl);
If i out one as a parameter, the image is now located half way of screen. How do i make it so i can say things like:
gl.glTranslatef(screen_width - image_width , 0);
Is there an alternative method for drawing images in OpenGl?
I previously used canvas to draw images, and i had no problem positioning images on the screen. However with openGl i'm experiencing issues.

All you need to remember is, the screen space in OpenGL ranges from -1,-1 (top left), and 1,1 (bottom right). So you need to provide normalized values to OpenGL. To move a point along x direction from one end of the screen (-1.0) to another (1.0), left to right, you will have to Translate by 2.0 by using glTranslatef(2.0, 0, 0). This point is on the border, so you will have to adjust depending on the actual size of your object and its location.

Related

Android Screen Ratios

I'm using OpenGL ES 2.0 on Android and I and I initialise my display like so:
float ratio = (float) width / height;
Matrix.orthoM(mProjMatrix, 0, -ratio, ratio, -1, 1, 3, 7); //Using Orthographic as developing 2d
What I'm having trouble understanding is this:
Let's say my app is a 'fixed screen' game (like Pac-Man ie, no scrolling, just the whole game visible on the screen).
Now at the moment, if I draw a quad at -1 to +1 on both x and y I get something like this:
Obviously, this is because I am setting -ratio, ratio as seen above. So this is correct.
But am I supposed to use this as my 'whole' screen? With rather massive letterboxing on the left and right?
I want a rectangular display that is the whole height of the physical display (and as much of the width as possible), but this would mean drawing at less that -1 and more than +1, is this a problem?
I realise the option may be to use clipping if this was a scrolling game, but for this particular scenario I want the whole 'game board' on the screen and to be static (And to use as much of the available screen real estate as possible without 'stretching' thus causing elongation of my sprites).
As I like to work with 0,0 as the top of the screen, basically what I do is pass my draw method something like so:
quad1.drawQuad (10,0);
When the drawQuad method get's this, it basically takes the range from left to right as expressed my openGL and divide the the screen width (so, in my case -1.7 through +1.7 so 3.4/2560 = 0.001328125). And say I specify 10 as my X (as above), it will say something like:
-1.7 + (10*0.001328125) = -1.68671875
It then plots the quad at -1.68671875.
Doing this I am able to work with normal co-ords (and I just subtract rather than add for y axis so I can have 0 at the top).
Is this a good way to do things?
Because with this method, at the moment, if I specify a 100,100 square, it isn't a square, it's rectangle. However, on the plus side, I can fill the whole physical screen by scaling the quad by width x height.
You are drawing a 1x1 quad, so that is why you see a 1x1 quad. Try translating the quad 0.25 to the right or left and you will see that you can draw in that space too.
In graphics, you create an object, like a quad, in your case you made it 1x1. Then you position it wherever you want. If you do not position it, then it will be at the origin, which is what you see.
If you draw a wider shape, you will also see you can draw outside this area on the screen.
By the way, with your ortho matrix function, you aren't just specifying the screen aspect ratio, you are also specifying the coordinate unit size you have to work with. This is why a 1x1 is filling the height the of the screen, because your upper and lower boundaries are set to 1 and -1. Your ratio is a little more than one, since your width is longer than your height, so your left and right boundaries are essentially something like -1.5 and 1.5 (whatever your ratio happens to be).
But you can also do something like this;
Matrix.orthoM(mProjMatrix, 0, -width/2, width/2, -height/2, height/2, 3, 7);
Here, your ratio is the same, but you are sending it to your ortho projection with screen coordinates. (Disclaimer: I don't use the same math library you do, but these appears to be a conventional ortho matrix function based on the arguments you are passing to it).
So lets say you have a 1000x500 pixel resolution. In OpenGL your origin of 0,0 is in the middle. So now your left edge is at (-500,y), right edge at (500,y) and your top is (x,250). So if you draw your 1x1 quad, it will be very tiny, but if you draw a 250x250 square, it will look like your 1x1 quad in your previous ortho projection.
So you can specify the coordinates you want, the ratio, the unit size, etc for how you want to work. Personally, I dont't like specifying coordinates as fractions between 0 and 1, I like to think about them in the same sense as the screen pixels.
But whether or not you choose to do this, hopefully you understand what you are actually passing to these matrix functions.
One of the best ways to learn is draw an object to the screen and just play around with different numbers you send to your modelview and projection matrices so you can see what it is they are actually doing.

Collision detection with rotated sprites, how to get correct bounding Rect?

I am currently creating an android game and implemented collision detection a while back. I am simply drawing a Rect around sprites using their position, width and height and seeing if they intersect other Rects. However, my sprites now rotate depending on their trajectory, but I cannot find how to rotate the Rect so the bound is correct. Any suggestions?
Thanks
Andy
Rect objects are usually axis-aligned, and so they only need 4 values: top, left, bottom, right.
If you want to rotate your rectangle, you'll need to convert it to eight values representing the co-ordinate of each vertex.
You can easily calculate the centre value by averaging all the x- and y-values.
Then it's just basic maths. Here's something from StackOverflow:
Rotating a point about another point (2D)
Your eight values, or four corners are (assuming counter-clockwise from the top right):
v0 : (right, top)
v1 : (left, top)
v2 : (left, bottom)
v3 : (right, bottom)
Create your own rectangle object to cope with this, and compute intersections etc.
Note that I've talked about how to rotate the rectangle's vertices. If you still want a bounding box, this is normally still considered to be axis-aligned, so you could take the max and min of the rotated vertices and construct a new (larger) rectangle. That might not be what you want though.

Android - Set focus on a circle that I have drawn in my onDraw method

Android Question.
I have made a custom ImageView class and inside it I have an onDraw method which will draw a circle on particular pixels (using canvas). When I use this custom imageview and open up my image I would like to set the focus on the circle that I have drawn (e.g like google maps do with your current location. The focus is set to your current point)
What the map server does on google is deliver a customized set of tiles so that the center is displayed properly, the newer version is of course vector based so they simply draw the view so it's centered where they want it.
Without knowing the details of your application you probably need
Create your own container class, probably FrameLayout
public class myMapFrameLayout extends FrameLayout {
The override either onDraw or onDispatchDraw so that you can layout your tile appropriately
Figure out where to draw your bitmap so that the x,y you need will be in the center of the screen, then draw the other tiles that you need to fill in the blank space at the coordinates required dependent on which way the tile was moved to get centered
Think of a virtual screen that is larger than the actual screen with tiles all around it that are the same size
1 2 3
4 X 5
6 7 8
Assuming that X is the size of the display and represents the current tile you need to figure out which way to move the tile, and which other tiles 1,2,3,4,5,6,7 or 8 you need to fill in the empty space caused by move
If you had to draw the tile +x from 0,0 you need some of tile 4, drawing +y from 0,0 means some of 2 and both mean 1,2,4 are all needed and so on, so figure out the combinations and load the tiles you need, and figure out the drawing positions of each. That would give you your new virtual tile with the center displayed.
That's about as efficient as you can get I think with a bitmap drawing method on the client side.
UPDATE
Since your comment indicates you have only one very large image this is going to be a bit of a problem if the x,y you need as anything closer to the edges than the size of the display
None the less you can still draw the image where you need it, just measure the screen and draw the bitmap with the target x,y in the center
So if the screen was 500x500 and your image was 5000x5000 and the center was at position x=1000 y=1000 then
drawBitmap(Bitmap bitmap, Rect src, RectF dst, Paint paint)
where source rectangle would be 1000-250,1000-250,500,500 and dst rectangle would be 0,0,500,500
The 250 is the center x and center y of the display, 1000 are the target x/y coordinates, and 500 is the size of display.
Again, with targets that are at the edges you are going to have a blank polygon in your screen since you dont have an infinite map tile
Alternatively you could oversize your framelayout using layoutparams and just translate the canvas in the x and y to get the canvas centered to the x,y you need using similar calcs which may be more performant, not really sure
Keep in mind you are going to be using a lot of memory if your image is really big

OpenGL coordinates to match screen coordinates?

Android opengl-es view question. So in openGL, the default position of the camera and view is at 0,0. How do you set the view and camera so that it acts basically the same as computer screen coordinates with 0,0 at the top. I've called gl.glOrthof(-screenWidth/2, ScreenWidth/2, -ScreenHeight/2, ScreenHeight/2). But I think this is wrong. I also need to set the camera to view the entire field. I'm not sure how to use gl.glFrustumf to accomplish this task.
To use your vertex coordinates as screen coordinates, just use glOrtho(0, width, height, 0, -1, 1) on the projection matrix and keep your modelview matrix identity (which is the default). Note that I flipped bottom and top, as in GL (0,0) is at the lower left and you want it at the top (but keep in mind that this also flips every object and therefore the triangle ordering). You also forgot to set the near and far planes (everything with a z out of this interval won't get displayed). But when you now draw all your objects with z=0 (which is the default, when drawing only 2d vertices), all should be fine.
glFrustum is just an alternative to glOrtho. Where glOrtho constrcuts an orthographic (parallel) view, glFrustum constructs a perspective view. So you don't need glFrustum.

Android screen coordinate system : how to set (0,0) at the bottom left side of android screen as first quadrent of xy plane

how to set the screen coordinate system of android screen as first Quadrant of the XY plane
,iwant the (0,0) position to be at bottom left , and i wanna know if i can use the trignometric equation on android screen as Android XY plane is not like the Xy plane
I don't think there's a way to do it that would affect the entire system, such as the XML layout files. But if you just want to draw with a Canvas, you can use translate() and scale().
First use translate() to slide the canvas down so 0,0 is at the bottom. Now the top of the screen would be a negative number, so call scale() to flip it around. Now 0,0 is still at the bottom, and the top of the screen is a positive number.
I'm working with information from this answer and its comments. Use something like:
canvas.save(); // need to restore after drawing
canvas.translate(0, canvas.getHeight()); // reset where 0,0 is located
canvas.scale(1, -1); // invert
... // draw to canvas here
canvas.restore(); // restore to normal
And yes, you can use normal 2D trigonometric functions with the XY coords. You can do it even if they're not translated, you just have to think it through more carefully.
I don't know that you're going to have much luck changing where (0,0) is located, but you could set a constant that accounts for such. myY = y minus screenHeight so (x, myY) adjusts y to the bottom of the screen and works from there +/-.
look up canvas.scale(xs,ys,xp,yp)
xp and yp are the new coordinates that you set for your (0,0) point.

Categories

Resources