为什么CGPath和UIBezierPath在SpriteKit中以不同方式定义"顺时针"？

Question

在SpriteKit中,clockwise方向相反,UIBezierPath但不是CGPath.例如,如果我有

do {
    let path = CGPathCreateMutable()
    CGPathAddArc(path, nil, 0, 0, 10, 0, CGFloat(M_PI_2), true)
    let node = SKShapeNode(path: path)
    node.position = CGPoint(x: self.size.width/2, y: self.size.height/2)
    self.addChild(node)
}
do {
    let path = UIBezierPath()
    path.addArcWithCenter(CGPoint(x: 0, y: 0), radius: 10, startAngle: 0, endAngle: CGFloat(M_PI_2), clockwise: true)
    let node = SKShapeNode(path: path.CGPath)
    node.position = CGPoint(x: self.size.width/2, y: self.size.height/2 - 100)
    self.addChild(node)
}

在GameScene.didMoveToView(view: SKView),第一个节点绘制一个3/4弧形,右上角缺失,但第二个节点在右上角绘制四分之一弧.在这篇文章中UIBezierPath解释了相反的"顺时针"方向,但为什么CGPath表现不一样？不UIBezierPath只是一个包装CGPath？

注意:Objective-C和Swift都会发生这种情况(因此不是语言特定的).没试过Mac App NSBezierPath.

Answer 1

CGPath并UIBezierPath使用不同的坐标系.UIBezierPath它的原点位于绘图区域的左上角,而CGPath原点位于左下角.因此,90º是圆的最低点UIBezierPath,也是最高点CGPath.由于两个路径的0º位于圆的同一点(最右侧点),因此从0º到90º的顺时针弧形绘制方式不同.

原点位于左上角,90°(π/ 2)位于圆的最低点,因此,UIBezierPath绘制顺时针弧,如下图所示.由于SpriteKit的原点位于左下角,因此当用于创建时,此弧显示为翻转(垂直)SKShapeNode.

原点位于左下角,90°位于圆的顶部,顺时针方向的CGPath弧形如下图所示.由于SpriteKit的原点也位于左下角,因此形状节点弧以相同的方向显示.