Android: how to combine the paths of two shapes and remove overlap?

Question

I want to create a speech balloon type shape, where there is a rectangle or ellipse with a triangular shape jutting out of it.

How I'm attempting to do this is to create a Path object that combines the triangle with the other shape (round rect).

I'm doing it as follows:

Path path = new Path();
// Create triangular segment

Point drawOffset = getAttributes().getDrawOffset();
int leaderGap = getAttributes().getLeaderGapWidth();

// Recall that we have a coordinate system where (0,0) is the
// bottom midpoint of the annotation rectangle.

// the point to left of gap
int x1 = -leaderGap/2;
int y1 = 0;

// the point to right of gap
int x2 = leaderGap/2;
int y2 = 0;

// The point where we're drawing to; the end of the pointy segment of triangle
int x3 = -drawOffset.x;
int y3 = drawOffset.y;

path.moveTo(x2, y2);
path.lineTo(x3, y3);
path.lineTo(x1, y1);
// path.close();


// Add the rectangular portion to the path
path.addRoundRect(backgroundShape, 5, 5, Path.Direction.CW);

The problem is that the roundRect is a closed path, so its edge shows through underneath the triangular section.

A picture's worth a thousand words, so here you go:

What I want is for the line segment between those two endpoints of the triangle to disappear, so that it looks like one seamless path.

If all I were doing were a straight rectangle, I could create the whole path myself from scratch. But I'd like to do the rounded corners, and it'd be a bit of a paint to do that with the Path (yes I know you can do quad to and arcTo but it's still not as clean a solution as I'd like).

So in general, is it possible to combine two paths and create a single union object that traces the perimeter of both?

Answer 1

Yes this is possible as of API 19. You can perform logical operations between 2 paths. As in your case, you can create a UNION of the two paths, using Path.op(). For a complete list of the operations that can be performed refer here.