我创建了一个带有UIBezierPath的大圆圈并使用它将其转换为精灵,
let path = UIBezierPath(arcCenter: CGPoint(x: 0, y: 0), radius: CGFloat(226), startAngle: 0.0, endAngle: CGFloat(M_PI * 2), clockwise: false)
// create a shape from the path and customize it
let shape = SKShapeNode(path: path.cgPath)
shape.lineWidth = 20
shape.position = center
shape.strokeColor = UIColor(red:0.98, green:0.99, blue:0.99, alpha:1.00)
let trackViewTexture = self.view!.texture(from: shape, crop: outerPath.bounds)
let trackViewSprite = SKSpriteNode(texture: trackViewTexture)
trackViewSprite.physicsBody = SKPhysicsBody(edgeChainFrom: innerPath.cgPath)
self.addChild(trackViewSprite)
工作正常。它完美地创造了圆圈。但我需要使用
调整大小SKAction.resize(byWidth: -43, height: -43, duration: 0.3)
这将使它变得更小。但是,当它调整20行宽时,由于纵横填充,我现在设置的非常小。所以当我眨眼它看起来像这样:
但我需要它像这样缩小 - 保持20行宽:
我该怎么做?
不知道这是否会影响任何事情,但精灵正在与SKAction永远一起旋转
- 编辑 - 现在,我如何使用此方法缩放到特定大小?喜欢将226x226转为183x183
答案 0 :(得分:4)
由于通过按比例缩小圆圈,不仅其半径会缩放,而且线条的宽度也会缩放,因此您需要设置与比例成比例的新线宽。例如,将圆圈缩小2时,您需要将lineWidth加倍。
这可以通过两种方式完成:
在run(SKAction, completion: @escaping () -> Void)
方法的完成块中设置lineWidth。但是,这会导致在动画运行时看到线条缩小,然后在动画结束后跳转到新的宽度。如果您的动画很短,可能不容易观察到这一点。
与缩放动画一起运行并行动画,不断调整lineWidth。为此,您可以使用SKAction的customAction
方法。
以下是您的案例示例:
let scale = CGFloat(0.5)
let finalLineWidth = initialLineWidth / scale
let animationDuration = 1.0
let scaleAction = SKAction.scale(by: scale, duration: animationDuration)
let lineWidthAction = SKAction.customAction(withDuration: animationDuration) { (shapeNode, time) in
if let shape = shapeNode as? SKShapeNode {
let progress = time / CGFloat(animationDuration)
shape.lineWidth = initialLineWidth + progress * (finalLineWidth - initialLineWidth)
}
}
let group = SKAction.group([scaleAction, lineWidthAction])
shape.run(group)
在此示例中,您的形状将缩放0.5,因此,如果初始线宽为10,则最终宽度为20.首先,我们创建具有指定持续时间的scaleAction,然后创建将更新的自定义操作每次调用actionBlock
时线条的宽度,通过使用动画的进度使线条的宽度看起来没有变化。最后,我们将这两个操作分组,以便在您拨打run
时将它们并行运行。
作为提示,您不需要使用Bezier路径来创建圈子,SKShapeNode有一个init(circleOfRadius: CGFloat)
初始化程序,可以为您创建一个圆圈。