Im currently making a sidescroller game which uses randomly generated terrain that scrolls in the background. The terrain is basically an instance of the GeneralPath class. When the terrain generates, the corners (0, 0) and (width, 0) are included in the path since the height of the viewing canvas isnt known yet. To make the terrain appear right-side-up, i added the following lines of code:
g.translate(0, getHeight());
g.scale(0, -1);
This should flip the coordinate system into Cartesian format with the bottom left being 0, 0.
For some reason, the terrain isnt drawing. When i comment-out these lines, it works, but is upside-down. If i only comment out the scale command and change the amount translated by to a smaller number, it also draws successfully (upside-down and translated a small amount).
Thanks in advance!
As you noticed, you need to scale the x axis as well - g.scale(1, -1);
Related
So I am building a application to solve mazes one of the options is upload a picture and it will solve it. However upon solving the maze the output will look like this.
I would like to figure out how to make my program find the proper corridor size and have the solution look like this with the pathway completely full
My data is put into a array with 1's representing the walls and 0's the spaces like this. So far I have thought about trying to find the smallest distance between 1's but that runs into problems with circular mazes and writing on the maze. I have thought about filling the distance between the walls but that runs into problems at intersections.
I am drawing on the image using
image.setRGB(x, y, Color.RED.getRGB());
with the image being a BufferedImage.
I am truly all out of ideas and don't know how to come at this problem any help would be appreciated.
Each square in your grid has a certain size. Say wsq * hsq for "width of square times height of square".
Given your much more fine-grained (x, y), you can find in which square it is by dividing x by wsq and y by wsh:
int xsq = x / wsq;
int ysq = y / ysq;
The area to paint red would be from (xsq * wsq, ysq * hsq) and have width/height (wsq, hsq). and you could paint that red, but it would mean that you paint over the walls. So you have to adjust the area you're going to fill with red color by the size of the walls. If the walls are all two pixels thick, you need to add 1 to the x and the y coordinate of the square, and substract 2 from the widht and the height.
And you could fill it again (with a Graphics2D) for every time that you are now calling image.setRGB or you could remember which squares that you already filled.
Note: since you are working with regular-sized squares, you can also optimize your maze-solving algorithm to work in a grid of squares of size (wsq, hsq) rather than the individual pixels in the image.
im trying do develop a Zelda like game. So far i am using bitmaps and everything runs smooth. At this point the camera of the hero is fixed, meaning, that he can be anywhere on the screen.
The problem with that is scaling. Supporting every device and keeping every in perfect sized rects doesnt seem to be that easy :D
To prevent that i need a moving camera. Than i can scale everything to be equally sized on every device. The hero would than be in the middle of the screen for the first step.
The working solution for that is
xCam += hero.moveX;
yCam += hero.moveY;
canvas.translate(xCam,yCam);
drawRoom();
canvas.restore();
drawHero();
I do it like this, because i dont wand to rearrange every tile in the game. I guess that could be too much processing on some devices. As i said, this works just fine. the hero is in the middle of the screen, and the whole room is moving.
But the problem is collision detection.
Here a quick example:
wall.rect.intersects(hero.rect);
Assuming the wall was originally on (0/0) and the hero is on (screenWitdh/2 / screenHeight/2) they should collide on some point.
The problem is, that the x and y of the wall.rect never change. They are (0/0) at any point of the canvas translation, so they can never collide.
I know, that I can work with canvas.getClipBounds() and then use the coordinates of the returned rect to change every tile, but as I mentioned above, I am trying to avoid that plus, the returned rect only works with int values, and not float.
Do you guys know any solution for that problem, or has anyone ever fixed something like this?
Looking forward to your answers!
You can separate your model logic and view logic. Suppose your development dimension for the window is WxH. In this case if your sprite in the model is 100x100 and placed at 0,0, it will cover area from 0,0 to 100, 100. Let's add next sprite (same 100x100 dimension) at 105,0 (basically slightly to the right of the first one), which covers area from 105,0 to 205,100. It is obvious that in the model they are not colliding. Now, as for view if your target device happens to be WxH you just draw the model as it is. If your device has a screen with w = 2*W, h = 2*H, so twice as big in each direction. You just multiply the x and y by w / W and h / H respectively. Therefore we get 2x for x and y, which on screen becomes 1st object - from 0,0 to 200, 200, 2nd object - from 210,0 to 410, 200. As can be seen they are still not colliding. To sum up, separate your game logic from your drawing (rendering) logic.
I think you should have variables holding the player's position on the "map". So you can use this to determine the collision with the non changing wall. It should look something like (depensing on the rest of your code):
canvas.translate(-hero.rect.centerX(), -.rect.centerY());
drawRoom();
canvas.restore();
drawHero();
Generally you should do the calculations in map coordinates, not on screen. For rendering just use the (negative) player position for translation.
I have a quad drawn on the screen, positioned at the top of the screen and centred. As I resize the screen so it is not as high, the quad appears to move in the opposite direction from what it should, IE, up at the same rate it should be going down on my monitor.
It is constantly being set to be at the top of the screen and centred each loop, before rendering.
this.location[0] = (Display.getWidth()/2)-(this.size[0]/2);
this.location[1] = 0;
Then I render the quad and print out its Y location. this consistently returns 0, no matter what I resize the window to. By printing out the mouse coordinates I can confirm that the top of the screen is 0 when it is resized. Why is it then, that even though I am setting the quad to be at 0, then rendering it exactly after, it still isn't drawn at 0?
Is there some Opengl or LWJGL concept I don't understand?
Here's the Opengl Setup code.
GL11.glEnable(GL_TEXTURE_2D);
glMatrixMode(GL_PROJECTION);
glLoadIdentity();
glOrtho(0,Display.getWidth(),Display.getHeight(),0 ,1, -1);
glMatrixMode(GL_MODELVIEW);
Since nobody has answered this, and I have found a solution, inefficient as it may be, here's an answer.
I Changed the line
glOrtho(0,Display.getWidth(),Display.getHeight(), 0 ,1, -1);
to
glOrtho(0,Display.getWidth(), 0,Display.getHeight(),1, -1);
Which means instead of the top being the top, the top is now the bottom of the screen. I then had to create another variable inside my box class, called realY which is the actual y coordinate of the box/quad's left hand corner.
Then with some simple math (this.realY = (Display.getHeight() - this.location[1])-this.size[1];) I convert the input Y into the upside down version of itself, so 0 becomes the height of the screen, and vise versa
To me, this seems like a inefficient solution, and more of a workaround. If anyone has a better answer, please post it.
I'm trying to properly configure my Camera and Sprites in libGDX to show up in a 2D coordinate system properly with the origin at the bottom left hand corner.
I set up my Camera like this:
cameraWidth = Gdx.graphics.getWidth();
cameraHeight = Gdx.graphics.getHeight();
camera = new OrthographicCamera(1, cameraHeight/cameraWidth);
And I set up my Sprites like this:
sprite.setOrigin(sprite.getWidth()/2, sprite.getHeight()/2);
sprite.setScale(scale);
sprite.setPosition(startX,startY);
My problem is with sprite.setSize(x,y). If I set all the sprites to have a size of (1, texture aspect ratio), then everything draws with the right display ratio (not smushed or stretched), but nothing draws in the correct place. For example, if I draw something at (0,0), it will draw with its bottom left corner off the left side of the screen and up a number of pixels.
I've noticed by changing around the ratio I can get things to draw in different places - namely if I set it to (1, display aspect ratio) things look pretty close to drawing in the right place - they just draw from their center, not their bottom left corner, as LibGDX specifies. The only problem is that the images all appear as smushed or stretched, which is no good.
This seems like a simple problem and I just want to know how to set this up so I can have a sensible coordinate system that draws things in the right place and in the right aspect ratio. Thanks.
Once you change your viewport to match the screen's aspect ratio then (0, 0) will no longer be at the bottom left of the screen unless the screen is square. If the screen is wider than it is high then the visible portion of the x axis will still go from 0.0 to 1.0, but 0.0 on the y axis will now be somewhere off the bottom of the screen.
If you adjust the camera so that (0, 0) is at the bottom left of the screen, and remember that the visible y axis will only go up to grapicsHeight / graphicsWidth then that should solve your coordinate problem.
I would recommend setting the camera to point to the middle of the screen rather than the bottom left. There's an example here that does exactly that, drawing a 2:1 rectangle which is always in the centre of the screen, always with a 2:1 ratio no matter how much you resize it.
I've found a solution to this problem:
Set the camera to ortho (even though it's already an orthographic camera)
camera.setToOrtho(false,1,screen height / screen width);
Also, each sprite must have its position set to (x - sprite.getWidth()/2, y - sprite.getHeight()/2. I extended the Sprite class and overrode the setPosition method to account for this. Now, every time the position is set, the Sprites end up going where you "would think they'd go", with setPosition(0,0) putting it in the bottom left and setPosition(1,height/width) in the top left.
Oddly enough, this draws every sprite centered around the (x,y) point, which would make sense since width/2 and height/2 were subtracted from the position, except not subtracting the values does not make setPosition center the sprite via the bottom left corner - it's centered in a way I haven't figured out.
So I've got an assignment that takes two inputs, males and females, and outputs matingPairs, the product of the two.
In addition to that, the instructions ask to draw a shape using one of those variables.
I've decided to draw circles for each value.
I first draw matingPairs, followed by the smaller male and female circles on top of the original, larger matingPairs circle.
The problem I'm running in to is obviously representing the graphic in the applet. If the numbers go higher than say 100, the graphic becomes too large for the applet.
I'm looking for a way to basically have the matingPairs circle always fill the applet, then have males and females dynamically adjust so their size is scaled relative to the matingPairs circle size. I'm using JApplet.
Thank you very much for any guidance. I'm really looking for a solution, rather a push in the right direction.
May be you should provide more instruction about how are you drawing the circles in the Graphics object.
The idea is to manage two bi-dimensional spaces with different scales; the first one is the input data and the second one represents the available area to draw such data. The first one can have data on any location, such (5, 5), (0.2, 0.3)or (1200, 3400). The key is to map the original coordinates of the first space into the second, using the proper transformation: scale + translation.
This transformation must be calculated prior to start drawing and applies to any point drawn.
The idea is to map the rectangle where input data resides to the available area in the graphics. If the graphics area is 200x200 pixels and the data could be from (0, 0) to (400, 400), just divide by 2 the coordinates of the points to draw. If the original data is not centered in (0, 0), use a translation.
So, do you need to know how to get the size of the applets canvas or how to scale the male/female circles accordingly?
Edit:
Drawing a circle to fill the 600x600 area should be easy. Just keep in mind that you often specify the top left corner of the circle and the width and height (i.e. the diameter) when calling drawOval() / fillOval() or similar methods.
The next question is: what does represent the size of the input (males/females) and output (pairs), the area or the radius of the circles? Whatever it is, it should be easy to calculate the input/output ratio and then multiply the fixed size of the output circle with it in order to get the size of the input circle.