SKSpriteNode 框架偏离

Question

我正在尝试从 UIBezierPath 创建一个开放的圆圈，并将其转换为 SKShapeNode，稍后将其转换为 SKSpriteNode。

我遇到了一个问题，我不知道如何缩小 Sprite，而它的线宽没有按比例缩小。您可以在此处查看解决方案： Resize sprite without shrinking contents

我最终修复了一些问题并创建了一个新类来实现具有此功能的自定义 SKShapeNode：

class ShrinkableShape: SKShapeNode {

let level: Int
let bezierPath: UIBezierPath
let scale: CGFloat
let finalLineWidth: CGFloat
let from: SKSpriteNode

let initialLineWidth = CGFloat(20)
let duration = 0.3

// level would be from 1 to 5 (it is in a for loop)
init(level: Int, from: SKSpriteNode) {
    self.level = level
    self.from = from

    // create the open circle  which is (43 * level) + 140
    bezierPath = UIBezierPath(arcCenter: CGPoint(x: 0, y: 0), radius: CGFloat(((43 * level) + 140)), startAngle: CGFloat(GLKMathDegreesToRadians(-50)), endAngle: CGFloat(M_PI * 2), clockwise: false)

    // calls static function in this class so it is more readable 
    scale = ShrinkableShape.scaleFrom(level: level) / ShrinkableShape.scaleFrom(level: level + 1)
    finalLineWidth = (initialLineWidth / scale)

    // inits shape and then sets it up to specific values
    super.init()
    setup()
}

required init?(coder aDecoder: NSCoder) {
    fatalError("init(coder:) has not been implemented")
}

func setup() {
    // set sprite to path, set color, set line width and rotate it 
    self.path = bezierPath.cgPath
    self.strokeColor = UIColor(red:0.98, green:0.99, blue:0.99, alpha:1.00)
    self.lineWidth = 20
    self.position = from.position

    // FOR DEBUG: you will see what this makes in the screenshot
    let color = SKShapeNode(rect: self.frame)
    color.fillColor = UIColor.red
    color.alpha = 0.2
    color.position = self.position
    self.addChild(color)
}

// Makes the radius from the value given (only 1...5) 183, 226, 269, etc
static func scaleFrom(level: Int) -> CGFloat {
    return (CGFloat((level * 43) + 140) * 2.0)
}

}

如果您查看屏幕截图，您会注意到与应该对齐的位置相比，白色圆圈有点偏离（灰色条和白色圆圈路径应该相互对齐）。这只发生在我调用解决方案中显示的缩放函数时（上面链接）。

我认为这是因为框架都搞砸了。如果您看到，框架非常偏离（同样的问题是过去在转换为纹理时出现问题的原因，因为框架并不像应有的那样精确）

为什么会这样？我如何解决它？有没有办法让我手动为 SKShapeNode 设置正确的框架？关于如何做到这一点的任何其他想法？

--编辑-- 我忘了提。图中红色部分是调试查看SKShapeNode的框架。您可以在 setup() 函数中看到它是如何创建的。但我把它包括在内是为了显示框架有多远。

Answer 1

我认为您的问题的一部分是您的线条位置与位图边缘位置之间的差异，这是由于您“围绕”这些线条的笔划/轮廓宽度。

也许最好在视觉上描述，其中红色是系统认为的精灵大小，而黄色可能是您正在考虑的。我大大夸大了线宽以显示我正在考虑的效果/问题。