Impossible to make closed PathComponent

[typoland]

Hi, maybe this is not a issue, but I don't know make closed PathComponent. I have var curves : [CubicCurve] array where last.endingPoint == first.startPoint. I expect to get closed PathComponent, form PathComponent(curves: curves) but I receive "curves are not contiguous." error.

[typoland]

This is listing of .startPoint and .endPoint of curves send to PathComponent(curves: ...)

(548.9743825215003, 325.0) (341.15500052978894, 24.26896272382021)
(341.15500052978894, 24.268962723820202) (133.33561853807763, 325.0)
(133.33561853807763, 325.0) (341.15500052978894, 625.7310372761798)
(341.15500052978894, 625.7310372761798) (548.9743825215003, 325.0)`

Strange.

[hfutrell]

@typoland If I'm understanding your data correctly it looks like your issue may be with minuscule differences in the y coordinate of the ending point of your first curve and starting point of your second. They need to be exactly equal, which I'd recommend forcing one way or the other or taking an average.

24.26896272382021

versus

24.268962723820202

[typoland]

Oh! In the world of CGFloats it could be difficult sometimes ;) . This time I assigned values from previous curve to the next and result is the same:

(548.9743825215003, 325.0) (341.15500052978894, 24.26896272382021)  
(341.15500052978894, 24.26896272382021) (133.33561853807763, 325.0)  
(133.33561853807763, 325.0) (341.15500052978894, 625.7310372761798)  
(341.15500052978894, 625.7310372761798) (548.9743825215003, 325.0)  

This listings made by:

componentCurves.curves.forEach({print (index, $0.startingPoint, $0.endingPoint)})

[typoland]

I suspect those lines in Init:

curves.forEach {
    assert($0.startingPoint == temp.last!, "curves are not contiguous.")
    temp += $0.points[1...]
}
...

[typoland]

(Sorry for spamming here, I have to learn how to use this "issues". And markdown).

[hfutrell]

it's definitely coming from this assert ... but strange you would hit this even when forcing the start and end points to be equal (I can't see how this would logically happen). Can you reproduce the issue with a code snippet I could run?

[typoland]

I will. Give me some time. (I'm curious, maybe it's on my side somehow)

[typoland]

OK. I rounded x and y of all points to third place after comma - no issue anymore.

BTW: Is it possible to automatically reverse inner PathComponent to maka a hole somehow?

[hfutrell]

BTW: Is it possible to automatically reverse inner PathComponent to maka a hole somehow?

One way you can accomplish this is not by modifying the path, but when you go to render the path you can use the .evenOdd rule instead of .winding.

But if you must modify the path itself so that it works with the .winding fill rule: BezierKit has a .reversed() method that applies to BezierCurve, Path, and PathComponent which you may have seen. There is no way to apply this automatically, however one approach you could use is to find a point that you expect not to be filled, such as the center of your "hole" and test Path.contains(_ point: CGPoint, using rule: PathFillRule = .winding). If the result of the contains method is wrong then you know that your hole needs to be reversed.

[typoland]

Super! I will try, thank you!

BTW: good job!

[typoland]

After almost a year I still don't know how to close a path. This is a small app showing a problem: https://github.com/typoland/HowToCloseCurveInBezierKit

[hfutrell]

After almost a year I still don't know how to close a path. This is a small app showing a problem: https://github.com/typoland/HowToCloseCurveInBezierKit

It looks like you're creating 1 component for each curve. What this means is that when you stroke the path each curve will be stroked individually. This can make discontinuities because the stroking happens on a per-component basis and does not try to make different components continuous with each other. I think that might be the source of the things you've circled as "bad".

What you probably want is one component for the inner loop of the O and one component for the outer loop of the O. I haven't tested this, but something like this:

edit: this comment was wrong. I should have run the actual app

[typoland]

But curvesOfO: [[ BezierCurve ]] = [[...<Outer curve curves>...], [...<Inner curve curves>...]] and I add them in a loop

    for curve in curvesOfO {
        components.append(PathComponent(curves: curve))
    }

Should be OK, but it isn't :(

[hfutrell]

this looks like it should work, what goes wrong in this case?

[typoland]

Paths are not closed. First point is not connected with a last one. It’s why I made this small app. I must close those shapes and I don’t know how.