I'm beginning to develop games for android and I have what I believe a pretty simple question. I'm trying to replicate the game 'The Impossible Game' which is shown below for some practice. I'm having trouble with the white line the player uses as the "ground". When I want to create it, should I create is as its own texture and draw it like that on a texture atlas map and then put it into my game level picture and use collision detection, or should I just create that line in the background image and say if players position y = number, then stop falling? And then scroll the camera upwards when the player goes higher so the line doesn't always stay at that part of the screen. Which is an easier approach? hanks guys. I'm just not sure what's easier.
You can use the ShapeRenderer to draw a line like this:
//x,y your first point, x2,y2 your second point
shapeRenderer.line(x, y, x2, y2);
If you want to have the same effect like in the image you posted (with the limits of the line fading), you can divide it in 3 lines, one small going from full transparency color to white, one all white being the longest of them, and one going from full white to full transparency in the other end.
Something like this:
white = new Color(1,1,1,1);
transp = new Color(1,1,1,0);
shapeRenderer.line(x, y, x2, y2, transp, white); //Transp. to white
shapeRenderer.line(x2, y2, x3, y3, white, white); //all White
shapeRenderer.line(x3, y3, x4, y4, white, transp); //White to transp
Just set the correct points. (And do not create new Colors every frame!)
Of course you can also make a TextureRegion inside your atlas all white (even a 1x1 will do the trick). And just render that at the size and position you want.
batch.draw(whiteregion, x, y, width, height);
Related
I am trying to draw a cushion like rectangle in processing like the pic shown. Is there any tricky way to use "light" to realize this? Does anyone have any idea about it? Thanks!
Pic reference: http://philogb.github.io/blog/2009/02/05/cushion-treemaps/
What you're talking about is called a radial gradient.
There are a number of ways to do it. One way would be to simply draw a bunch of circles. Here is a small example:
size(200, 200);
for(float diameter = 255; diameter > 0; diameter--){
noStroke();
fill(0, 255-diameter, 0);
ellipse(width/2, height/2, diameter, diameter);
}
You'll also have to limit your drawings to a rectangle shape. You might do that using the createGraphics() function to create a buffer, then draw the gradient to the buffer, then draw the buffer to the screen.
You should really break your problem down into smaller steps and take those steps on one at a time. First create a sketch that shows a simple gradient. Then create a sketch that uses a buffer. Get those both working by themselves before you combine them into one sketch. Good luck.
Another common method for implementing a collection of radial gradients of the type shown (a treemap) is:
create or acquire a single fairly high resolution image asset with a (jpeg/png) -- https://www.google.com/search?q=radial+gradient+box&tbm=isch
load the image
as you draw your boxes
optionally use tint() to tint the image green, red, etc. This works best with a grayscale source image.
scale your source image to the correct size for each box using the 5-argument image(img, x1, y1, x2, y2)
I'm developing a simple game in which I need to detect collision between objects, I already know how to detect collision between 2 sprites, but now I need to detect collision between a sprite an a line drawn using the ShapeRenderer technique. Let's say I have a sprite defined like this:
Texture texture = new Texture(myPath);
TextureRegion textureRegion = new TextureRegion(texture, w, h);
and a line like this:
shapeRenderer.begin(ShapeType.Line);
shapeRenderer.line(x1, y1, x2, y2);
shapeRenderer.end();
Is there a way to detect when those 2 two objects collide?
Without knowing how you're detecting your sprite collisions, I'd suggest a couple of different options that may work.
If you're using box2d for your current collision detection, and you don't have many lines to render with the shapeRenderer, you could consider creating a body/fixture to represent the line, make it a sensor and use the contact listener like you do for other bodies.
Or perhaps a more simplistic approach may be to use libgdx's Intersector class and poke around there for methods that may help you. For instance,
public static boolean intersectLinePolygon(Vector2 p1, Vector2 p2, Polygon polygon)
may work for you, where p1 is your (x1,y1), p2 is your (x2, y2) and polygon maps to your textureRegion.
I have a rectangular group that holds a bunch of sprites. Sprites are moving (say up). As they reach the top, they collide with the boundary. I have set up logic that kills the sprites as they exit the group. However, the way it is now, I can see the sprite leaving the group. I want to make it so that as the sprite is crossing the boundary, it's gradually disappearing until it's out (and dead).
Here's a crude mockup of what I want to achieve.
I was playing around with cameras thinking I have to modify the viewport, but it's not working. What's the proper way of achieving this effect?
Thanks!
EDIT:
My camera was set up like this:
camera = new OrthographicCamera(width, height);
camera.setToOrtho(false, width, height);
camera.position.set(width/2, height/2, 0);
Right now it's operating from the group's parent level (layer). Width and height are Gdx.graphics.getWidth(), etc.
My update():
camera.position.x = (width / 2) - resolver.getxPixelOffset()*parallax;
camera.update();
batch.setProjectionMatrix(camera.combined);
batch.begin();
g.drawGroup(batch);
batch.end();
I moved my camera controls to my group class. I then changed the width and height to groupWidth and groupHeight. Since the group is not the entire screen, I figured it has to be smaller. This made the group massive. I don't want to change the size (or zoom?) of the group :(
I haven't tested this myself, but I believe the proper way of doing this would be using scissors. Basically, the scissors allow you to clip a region out of your picture, and only allow things in that region to be drawn, so you would probably do something like similar to what they do in the demo here:
Rectangle scissors = new Rectangle();
Rectangle clipBounds = new Rectangle(x,y,w,h);
ScissorStack.calculateScissors(camera, spriteBatch.getTransformMatrix(), clipBounds, scissors);
ScissorStack.pushScissors(scissors);
spriteBatch.draw(...);
spriteBatch.flush();
ScissorStack.popScissors();
You may need to draw and flush your background image (if you have one) before you draw with the scissors.
I need to make it so that when sprites that I have created collide with each (I have already figured out the collision) other they teleport to the last x and y position they were on before they collided so that they don't go through each other. I have tried to use this code.
double x, y, x2, y2;
if(!r1.intersects(r2)){
x = z.getX();
y = z.getY();
x2 = z2.getX();
y2 = z2.getY();
}
if(r1.intersects(r2)){
z.setX(x);
z.setY(y);
z2.setX(x2);
z2.setY(y2);
}
But it doesn't work because all the sprites is inside each other. I have also tried to use this.
if(r1.intersects(r2)){
z.setX(z.getX() - 1);
z.setY(z.getY() - 1);
z2.setX(z2.getX() + 1);
z2.setY(z2.getY() + 1);
}
That code makes it so that the sprites can't go through each other but it will make it so that the first sprites that spawn becomes alot faster than the later ones because in the beginning it's more sprites that collide with each other.
I assume these sprites are more complex than simple circles? I am also assuming that you have implemented some "bounding box" collision detection.
If that's the case then I would calculate a vector after the collision is detected. The vector would be a magnitude of how much each sprite has intersected each other by, relative to their center points. You can then move each sprite in opposite directions along the vector, scaling by how far they have intersected. This would position each sprite so they are just touching.
This is a nice solution because if each sprite is moving at more than 1 pixel per frame, the last positions of each sprite could be a 10's of pixels away. It would never look like they actually collided.
..This would work for both complex sprites and simple circles.
I am attempting to draw a triangular portion of a bitmap. I already know how to draw a filled triangle using path, and I already know that the answer may involve something called BitmapShader, but I can not find any clear documentation or examples to put it all together.
EDIT: After much flailing and experimentation, I am now nearly there. My code looks like this:
Paint paint;
Path path = new Path();
BitmapShader bms = new BitmapShader(shrub_bitmap,TileMode.REPEAT ,TileMode.REPEAT );
paint.setStyle(Style.FILL);
paint.setShader(bms);
path.reset();
path.setFillType(Path.FillType.EVEN_ODD);
path.moveTo(x1,y1);
path.lineTo(x2,y2);
path.lineTo(x3,y3);
path.close();
canvas.drawPath(path, paint);
paint.setShader(null);
The only remaining problem is that the bitmap from which the triangle is drawn is rooted to the screen coordinates. This means that when the triangle is being animated (i.e. being drawn at various points around the screen), it has the appearance of being a window allowing us to see a static image underneath. What I actually want is for the bitmap to be tied to the triangle so that the triangle looks like a solid object moving around. Any idea how to fix that?
for your second question:
try using canvas.translate(x1, y1) and moveTo(0, 0), lineTo(x2 - x1, y2 - y1) ...