Advice on how to draw a line like this one

142 views
Skip to first unread message

Peter Nelson

unread,
Apr 15, 2024, 3:35:12 AM4/15/24
to skia-discuss
Hello everyone. I'd like some advice/direction on how to draw a tapered, randomly curving like this:Screenshot 2024-04-15 002227.png
I am writing an app to draw maps similar to Wonderdraft, and I'd like to emulate Wonderdraft's river drawing function (which is where this screenshot came from). Drawing a randomly curving, rounded line with Skia isn't difficult by combining the CreateDiscrete and CreateCorner path effects, but I have not been able to figure out how to draw a line that tapers like this one. I've tried using a polygon (a long, skinny triangle), but painting that with the CreateDiscrete effect causes the sides to overlap, and it ends up looking nothing like the picture. I'm hoping that some of you might be able to give me some ideas on how to draw a line like this. Thanks very much!

mattl...@live.com

unread,
Apr 16, 2024, 5:35:07 AM4/16/24
to skia-discuss
You may need to make this a "hollow" path. So, you get your line and then calculate a thickness along it and end up with double the points as a SkPath instead of just a series of points...  Not sure if that makes sense.

Peter Nelson

unread,
Apr 16, 2024, 1:37:48 PM4/16/24
to skia-discuss
Thanks for the reply. I'll think about that. I wouldn't think that making a tapered line is that difficult, but I haven't been able to figure it out. It looks to me like there are two identical lines drawn next to each other from the same starting point, but the angle of them is offset a little to give the tapered effect. I've tried doing that using DrawLine , and it looks pretty close, but then I wanted to add the lines to a path. So, I just used the path MoveTo/LineTo methods to do that, and then rendered the path, but the result looks nothing like when using DrawLine. So, I'm stuck trying to figure out how to do this. I might have to do something like adding overlapping circles to the path following the random line that increase in size from beginning to end. I don't know yet. My "river" doesn't have to look exactly the same as the picture, as long as it looks good, but I'd like to get as close as I can.

Anyway, thanks again for the reply! Appreciated.

Reply all
Reply to author
Forward
0 new messages