Java - split image into jigsaw pieces - java

I need to create a jigsaw puzzle game. I've already done this in the past using AndEngine, however I've only cut texture into rectangles. Now I need to cut it into proper jigsaw pieces. How can I do that?

Cut the texture into rectangles but for every rectangle take extra space. So you would have a lot of rectangles which overlap each other.
Then you need to have some set of patterns for jigsaw edges (black and white images or you can call it a mask) and generate a mask for every rectangle using those patterns.
The algorithm would be:
create a mask with a size of rectangle and initialise it with white color.
Then choose edge pattens based on rectangle-neighbors if they are initialised or choose edges randomly if neighbors are not yet initialize.
After you chose the patterns, draw them on a mask for every side. So in the end you would have a mask with a shape of a jigsaw piece. white color = visible, black color - transparent.
Then apply the mask to the rectangle when you draw it.
And bare in mind that you don't stack these rectangles based on their actual size, but stack in a way that they would overlay each other...
P.S. I hope you understood what I was trying to say. Sorry, English is not my native language...

Related

Java and OpenCV color detection

I'm working on a project at school, which basically is: writing an application to make a drone fly autonomously, and through scanning QR-codes hung up on walls, be able to navigate through a room in order to complete a certain task.
What I am currently working on, is for the drone to detect cardboard boxes (working as obstacles). These boxes are white, and have a blue circle on them. How I'm planning to solve this, is by scanning the frame for colors and squares:
If the drone detects a square, check if it's white. If it's white, check if it contains a blue circle. If it does, I can say that it most likely is a cardboard box.
This is what the box looks like:
If anyone would be able to provide some pointers as to how I can start working on the color detection, I would be very happy!
PS: I haven't provided any code, since I don't really know what to provide. I would be more than happy to provide some if needed
UPDATE: for anyone stuck at the same problem as I, a fellow student provided an excellent link for my exact situation:
http://opencv-java-tutorials.readthedocs.io/en/latest/08-object-detection.html
I would go from a different angle to do this by detecting the blue circle first.
Detect base colors
see RGB value base color name
Select all blue pixels neighboring white or gray-ish ones
As your circlehas black border then you have to select all blue pixels near white,gray,black... just to be sure. This is the result (Green are selected pixels):
another (more robust) possibility is to select all black pixels neighboring white and blue at the same time.
do a connected components analysis
so merge all connected pixels into polylines
For each polyline decide if it is circle/ellipse/oval
that can be done by investigating angle between line segments. If has sharp spikes then sharp edges are present and it is not an oval. If the circumference is too far from circle/elipse/oval computed from its bounding box then it is not oval but some more complicated curvature.
For each oval decide if it is filled with blue
so just flood fill mask of the oval circumference and compare how many pixels are int the original image blue against those that are not. if the ratio is closer to 100% blue then it is filled blue oval shape....
As your marker has also some features inside you can compute the ratio of all base colors inside it to more accurately detect the marker.
Look at Algorithms: Ellipse matching for some additional ideas.
now you can similarly check if the background is white/gray-ish
There are a lot of other possible approaches like OCR and character similarity or based on FFT/DCT, Hough transform for circles... also you are not bound only to geometric properties comparation instead you can compare histograms...

Slick2d using anti-aliasing with Animations/Images

I'm using slick2d to render an Animation, but using anti-aliasing
Without AA, the movement is choppy, as one would expect for something without AA.
I turn on AA in my game's preRenderState with:
g.setAntiAlias(true);
This leads to:
Note the diagonal line in the center, presumably caused by the two triangles that render the rectangle not meeting precicely. How can I remove that while still using AA to smooth my movement? I found http://www.java-gaming.org/index.php?topic=27313.0 but the solution was "remove AA" which I am reluctant to do.
This looks suspiciously like artifacts due to GL_POLYGON_SMOOTH.
When you use that (deprecated) functionality, you are expected to draw all opaque geometry with blending enabled and the blend function: GL_SRC_ALPHA_SATURATE, GL_ONE. Failure to do so produces white outlines on most contours (aliased edges, basically).
Chapter 6 of the OpenGL Redbook states:
Now you need to blend overlapping edges appropriately. First, turn off the depth buffer so that you have control over how overlapping pixels are drawn. Then set the blending factors to GL_SRC_ALPHA_SATURATE (source) and GL_ONE (destination). With this specialized blending function, the final color is the sum of the destination color and the scaled source color; the scale factor is the smaller of either the incoming source alpha value or one minus the destination alpha value.
This means that for a pixel with a large alpha value, successive incoming pixels have little effect on the final color because one minus the destination alpha is almost zero. With this method, a pixel on the edge of a polygon might be blended eventually with the colors from another polygon that's drawn later. Finally, you need to sort all the polygons in your scene so that they're ordered from front to back before drawing them.
That is a lot of work that almost nobody does correctly when they try to enable GL_POLYGON_SMOOTH.
Every time you enable anti-aliasing in Slick2D, it should look like this.
g.setAntiAlias(true);
GL11.glBlendFunc(GL11.GL_SRC_ALPHA_SATURATE, GL11.GL_ONE);
Basically same as Andon's answer, but with code that should solve the problem.
Note that with this whatever you draw first will be on top, rather than what you draw last. So you may need to reverse rendering order.

Rendering a triangular face in 3d space

Let's say I have a triangular face in 3d space, and I have the 3d coordinates of each vertex of this triangle, and would also have other information about the triangle(angles, lengths of sides, etc.). In Java, if I have the viewing screen and its information, how can I draw that plane, without using libraries like LWJGL, to that image, assuming I can properly project, accounting for perspective, any 3d point to that 2d image.
Would the best course of action just be to run a loop that draws each point on the plain to a point on the image(i.e. setting the corresponding pixel), which will most likely set the same pixel multiple times? If I'd do this, what would be the best way to identify each point in an oblique triangle, or a triangle that doesn't line up nicely with the axes?
tl;dr: I have a triangular face in 3d space, a "camera" looking at the face, and an image in which I can set each pixel. Using no GL libraries, what's the best way to project and draw that face onto the image?
Projection :
won't detail as you seems to know it
Drawing a line
you can look at Bresenham algorithm if you wanna start with the basics
(hardwared in recent graphics card)
Filling
you can fill between left and right borders of the triangle while you use Bresenham on both (you could use a floodfill algorithm starting ... i don't know, maybe at the projection of the center of the triangle)
Your best bet is to check out the g.fillPolygon() function for Java. It allows you to draw polygons with as many sides as possible and theres also g.drawPolygon() if you don't want it solid. Then you can just do some simple maths for the points. Such as each point is basically it's x and y except if the polygon is further away the points move closer to the center of the polygon and if the polygon is closer they move further away from the center of the polygon.
A second idea could be using some sort of array to store pixels and then researching line drawing algorithms and drawing lines then putting all the line data in another array and using some sort of flood-fill. Then whilst it's in that array you could try and do some weird stuff to the pixels if you wanted textures or something.

libgdx: sprite break like a glass

I have a sprite which is ball. Let's say, it represents a glass ball.
I am rendering the graphics with SpriteBatch.
Is it possible in libgdx to have a breaking glass effect for the ball? Meaning, I want to split the sprite to different pieces with abnormal borders (not rectangular) and then draw them flying to different directions.
Use a PolygonSprite to represent the non-rectangular chunks of your sprite.
To generate the chunks, I suggest picking a random spot near the center of your sprite, and then creating several triangles from that point to the corners and 2 or 3 points on each side of the square sprite. You should be able to define a PolygonRegion for each shard, and use that to build PolygonSprite instances.
I haven't actually used the PolygonRegion API before (and it looks a bit obtuse), so you might want to check the examples.

Detecting (and locating) predefined shapes in image in Java

Given an image and a set of predefined unique shapes with a certain colour (e.g. red triangle, green circle, green triangle, yellow square, ...). The image contains some of these shapes at random locations. I have the predefined shapes available as an image-file for each shape if needed.
How can I detect/recognise all of these shapes and return their location in some way, in Java?
OpenCV seems to be a common solution for Python, but I can't find any helpful example/tutorial for Java. I really don't know where to start. Hints/examples much appreciated!

Categories