Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

UIBezierPath and NSBezierPath producing different results when drawing arcs

I have two pieces of code, one of which works perfectly (the iOS version) and the other does not work correctly (the Mac version). I can't work out what the problem is with the Mac version, which uses NSBezierPath, rather than UIBezierPath.

iOS Version

I have a piece of code that works exactly as I'd like on iOS using UIBezierPath. Here's the code:

let center = CGPoint(x: size.width / 2.0, y: size.height / 2.0)
let radius = size.width / 2.0
let startAngle = angle
let endAngle = 180.0 - startAngle

let bezierPath = UIBezierPath()
bezierPath.addArcWithCenter(center, radius: radius, startAngle: startAngle.radians, endAngle: endAngle.radians, clockwise: true)
println(bezierPath)
return bezierPath

It produces the following output

<UIBezierPath: 0x7fe348f82910; <MoveTo {42.677669529663689, 42.677669529663689}>,
<CurveTo {7.3223304703363148, 42.677669529663689} {32.914562235881945, 52.440776823445439} {17.085437764118062, 52.440776823445432}>

and displays the following image

correct shape

Mac OS X Version

This does exactly what I want, except that it's for iOS. I'd like to translate this code to OS X/Cocoa. Here's what I've come up with

let center = CGPoint(x: size.width / 2.0, y: size.height / 2.0)
let radius = size.width / 2.0
let startAngle = angle
let endAngle = 180.0 - startAngle

let bezierPath = NSBezierPath()
bezierPath.appendBezierPathWithArcWithCenter(center, radius: radius, startAngle: startAngle.radians, endAngle: endAngle.radians, clockwise: true)
println(bezierPath)
return bezierPath

(it's almost identical to the iOS code).

The output here is

Path <0x600000122800>
Bounds: {{-4.9018102839097546e-05, -4.9018102839077596e-05}, {50.000098036205685, 50.000094758067902}}
Control point bounds: {{-0.18691031775632938, -0.18691031775632855}, {50.373820635512658, 50.37016203886877}}
49.997651 25.342684 moveto
50.186910 11.536862 39.148505 0.191608 25.342684 0.002349 curveto
11.536862 -0.186910 0.191608 10.851495 0.002349 24.657316 curveto
-0.186910 38.463138 10.851495 49.808392 24.657316 49.997651 curveto
38.196255 50.183252 49.422202 39.556558 49.978864 26.027794 curveto

with the following shape resulting

incorrect result

Both code segments were given the same inputs and use the same methods for computing radians, etc. As far as I can tell, everything is the same between the two, apart from the output. It is also worth noting that I am converting each of the paths into UIImages and NSImages after they are drawn. Please let me know if I should post the code that I'm using to do this.

I've also tried using moveToPoint to get both pieces of code to the correct starting position (unnecessary on iOS, didn't fix the issue on OS X).

Thanks very much for your help.

like image 950
matthewpalmer Avatar asked Jul 04 '15 09:07

matthewpalmer


1 Answers

Turns out that on iOS addArcWithCenter takes radians for startAngle and endAngle, and on OS X appendBezierPathWithArcWithCenter takes degrees.

Here's the link to the documentation for OS X.

like image 81
matthewpalmer Avatar answered Nov 14 '22 21:11

matthewpalmer