Clipping path issues - android

I have written my own poly-line class that essentially keeps a list of points that can be modified using a Matrix. The poly lines can be added to other poly lines and joined at common endpoints. The poly line will represent a polygon when the end point equals the starting point.
I then have a method to turn my polygon into a Path object by iterating the list of points with a series of lineTo() calls. This path is then applied to a canvas as a clip path in my View's onDraw method.
It works perfect for complex polygons and I can draw that path to verify it's accuracy.
So far so good, except that I'm noticing issues when I have a compound polygon with an irregular hole in the middle. I should probably stop calling it a polygon at this point since it is a polygon inside another polygon.
For example consider the diagram below where the outer box and "castle" looking shape in the middle are both parts of the same Path object that is used as a clip-path. The # represent painted area.
+---------+
|#########|
|#+-+#+-+#|
|#| |#| |#|
|#| +-+ |#|
|#| |#|
|#+-----+#|
|#########|
+---------+
I expect that everything outside of the outer box and inside the inner "castle" shape to be clipped. The issue I'm seeing is that the inside shape isn't being clipped, properly. Seems to be an issue with the ray-tracing algorithm.
Any ideas would be helpful.
EDIT: Also, I tried testing every Region.Op mode, and none of them solved the problem. I suspect I'll need to put measures in place to detect if there is a "hole" and do something creative.

After spending a couple of day's playing with this I've half-solved my problem.
I needed to set the Path.FillType with:
path.setFillType(Path.FillType.EVEN_ODD)
But then I had an instance where the opposite happened and only the center path was painted. A little more investigation and I was able to fix that with adding:
canvas.clipPath(path, Region.Op.DIFFERENCE);
But then polygons with a single path on the outside have their clip inverted. While I'm satisified that I've found the right nerd-knobs to get the right clipping behavior, I haven't found a way to determine which clipping methods are needed.
I'd be happy if someone has any ideas to share. I suspect it has something to do with the order in which lines are added to the path, such as if the inner is defined beore the outer, etc.

Related

convex path - how to?

Could someone explain me how convex path is calculated? I need to draw some cubic and additionally some lines but then path is shown as non convex. However when I leave only lines or just cubic it is then convex. The problem is that I need some non regular shaped background and need Convex path for shadow outline but can't get how I could connect drawing cubic with some lines to make convex path if it is even possible
A path is convex if it has a single contour, and only ever curves in a single direction.
Convex means it keeps bending / rotating in one direction, and one direction only. You really have to make sure that all your angles and curves add up. If your curve connects to a line it has to have the same angle or be "more convex", I hope the following 2 images will clear this up.
The picture below is not convex. That's also likely your problem. The line connects to a curve, but the curve has a different angle than the line and it will change the direction where it connects. See where the line goes down but instead of continuing the downwards-motion it suddenly goes up again. Instead of keeping one direction it will change for a moment where line and curve meet.
The above Image is exaggerated for clarity, but even small errors in the connection between the line and curve will trigger an error.
The next line connects to a curve with a steeper angle. This is convex and won't be a problem. See how the whole contour keeps a single motion in one direction, depending in which direction you follow it it keeps turning left/right.
I answered because I was facing a similar issue recently and I feel your pain. I recommend pen and paper to double and triple check the math and to use a small epsilon value to account for rounding errors etc... You really have to nail the math, because if your line and curve connection is just off by very little it will throw that exception.
Sorry for my bad paint skills

Draw nice curved path along points

How do I draw a path along some defined points in a way so that the path is nicely curved and not necessary exactly touching the defined points, except the end points where the line must be ending at the exact points? I have tried with quadTo, but that gives me jagged connections between the quadTo end/start in some situations.
To illustrate what I want I have attached this example image:
Thank you
Søren

Drawing and storing a user's touch path in libgdx

I'm struggling with something I would expect to be straight forward with libgdx.
In short this is a "finger paint" app where I want to draw a path of a certain width where the user touches the screen.
I've earlier done this by using a plain Android android.view.View. I had a android.graphics.Path in which I stored the coordinates of the user's current touch. In the onDraw() method of the view I drew the path to the android.graphics.Canvas. Whenever the user released a finger I drew the path to an offline canvas/android.graphics.Bitmap which also was drawn in the onDraw() method. Plain and simple.
How can that be done using libgdx?
I have tried using a com.badlogic.gdx.graphics.Pixmap that I can draw a line to whenever the user moves a finger. This works well except the fact that I'm unable to control the witdh of the line using Gdx.gl.glLineWidth(). I know I can draw a rectangle instead of a line to set the width, but Pixmap doesn't seem to have any means of rotating, so I don't see how this can be done.
I can use a com.badlogic.gdx.graphics.glutils.ShapeRenderer for drawing lines (or rectangles) in com.badlogic.gdx.Screen.render(). As far as I can see I then need to store every single touch point of the current touch, and then draw all lines on render. Whenever the user relases a finger I guess I can store the screen as-is with something like com.badlogic.gdx.utils.ScreenUtils.getFrameBufferPixmap(). Hopefully there is a easier way to achieve what I want.
I ended up drawing circles on a pixmap where the line should be:
One circle on touchDown
Several circles from last touch point to next touch point reported to touchDragged
I'm not very happy with this solution, but it kinda works.
Maybe you can calculate line dot coordinates manually and use triangles to draw them on pixmap? Like use 2 triangles to form (rotated) box?

Android MapView path.draw draws crazy polygon lines all over the place

I've been struggling for a couple of weeks now with google's android mapview.
I'm drawing a large amount of polygons with a large amount of points. on average 15 polygons and around 1000 points each.
The first issue I experienced was performance... No surprise. After doing some testing I realised the culprit is projection.ToPixel() which I successfully bypass when the users pans by simply moving all my points in the direction by x amount of pixels (the difference), however when zooming I have no choice but to make use of the toPixel method.
Is there possibly a more efficient way of modifying my points depending on the zoom level? after some research I've found examples on how to do this with circles and other shapes, but I have no clue where to begin with reshaping polygons, any ideas on this?
The second issue i'm having is that when I have the entire polygon in view all is grand, but when I pan over the map bounds (where the map is effectively starting again to the left and right) on any side the polygon lines seem to reach and stretch out across the map bounds causing crazy spaghetti lines all over the place! I take it what's happening is that the path.close() or path.LineTo() methods think the shortest path is flying halfway across the world to reach the next point which causes these lines. I have no idea how to address this. I simply can't ignore points that do not fall within the current lon/lat spans because that (obviously) causes the polygon to change shape al the time!
Has anyone experienced this issue and how can one go about solving it? I'm not even sure what I should be googling!?
UPDATE 1:
The problem can be easily solved by preventing the mapview from looping. Is there some way to prevent the mapview from looping the world!?!?

Creating a Region from a Path in Android

I'm a new Android developer that's developing a simple twist on the Tron game with GPS movement, but I'm having trouble implementing player's intersecting.
Right now, my player's trails are Paths that I move to co-ordinates and draw the co-ordinate difference as a line on the canvas.
The path class offers no such intersection method that I can find, so I resorted to using Regions which I've tested an intersection to work with 2 regular Rectangles, but I can't make a Region using Region.setPath for some reason. From my understanding, the path needs to be closed to form an area for it to create a Region, which isn't exactly what I need.
Is there a way to create a region off a path, and not the area the path creates? ie: If the path were a straight line of 10px thick, how do I make a region that is a line of 10px thick?
Here's a short code sample I'm doing:
Path p1path = new Path();
p1path.moveTo(startPos,startPos);
p1path.lineTo(newPos,newPos);
p1path.moveTo(newPos, newPos);
Region p1region = new Region();
p1region.setPath(p1path, new Region(0,0,480,800); // this is where the region isn't setting as I thought it would...
// do same for p2
if(p1.quickReject(p2)) // checks for intersection
Thanks :)
So I've solved this quite some time ago, but to help those who eventually stumble onto this and want some similar functionality:
This post is quite some time ago - so let me remember what happened.
Creating a Region around a path actually did work but for a very limited set of Paths. What I mean by "Creating a region around a Path" is that for a Path that goes from x1,y1 to x2,y2 create a rectangular Region that covers (for example) x1-50,y1-50 to x2+50,y2+50 where 50 is the pixel weight stroke of the Path.
If you can visualise it, it basically creates a rectangular region that covers the Path and it's 50px stroke so you can "fake" Path intersection using Regions. Wherever a Path is, a Region is and so when 2 Paths "intersect", you can check for Region intersection (which you can do but I've forgotten the method names).
This however proved to work only for a few Paths. Though I'd like to think my Math proficiency is adequate, I could not get it so that for whichever direction the Path went the Region would work. Different angles, different directions etc. caused the Region not properly drawing under the Path. My above example of using the 50 stroke width would only work for going a particular direction.
The solution my parter and I stumbled onto was creating a 2D integer array that mapped onto the screen. Wherever a Path went into a certain direction, we would fill every array cell the Path mapped onto with a specific value (1). We would do the same for the other Path, but with a different value (2). Each move you make you would check the 2D array against the Path co-ordinate to see if it has been occupied or not. There was an important mathematical formula that would extrapolate which cells were visited when you go from x1,y2 to x2,y2 that proved very helpful - I believe it was called something along Brasenheim's formula, or something.
It's not the most elegant solution, but it ended up faking Path intersection well. If anyone is interested in a better explanation, you can message me.
Good luck!

Categories

Resources