Swift, sprite kit game: 圆圈顺时针消失了吗？在定时器上？

Question

好的，所以我不知道它的名字，但我有一个 sprite 套件游戏（跑酷游戏），当游戏结束时，会有一个 "save me" 按钮和一个计时器相应地用完了。当计时器用完时，您将无法再单击按钮来保存角色。

不过，我不想在文本中显示此计时器 - 我想要一个 "unwinds itself," 的圆圈，并以计时器用完的速度消失。 IE。当计时器到达 0 时，圆圈已完全消失。根据计时器，圆圈以顺时针运动的方式逐渐消失。

这里有一些图片来解释我在说什么。

我该怎么做？

Answer 1

通过以固定间隔更改 SKShapeNode 的 path 属性，您可以创建逐帧动画序列。要创建动画，请将 path 属性设置为一系列以圆圈开始但什么都没有结束的形状。您可以使用 UIBezierPath（CGPath 的包装器）通过以下步骤为动画创建形状：

将路径的"pen"移动到圆心
从startAngle到endAngle

addArcWithCenter

从圆上对应终止角的点到圆心的路径上加一条线
将 endAngle 更改为固定金额
重复步骤 1-4

下面是上述步骤的实现：

override func didMove(to:SKView) {

    let circle = SKShapeNode(circleOfRadius: 50)
    circle.fillColor = SKColor.blue
    circle.strokeColor = SKColor.clear
    circle.zRotation = CGFloat.pi / 2
    addChild(circle)

    countdown(circle: circle, steps: 20, duration: 5) {
        print("done")
    }
}

// Creates an animated countdown timer
func countdown(circle:SKShapeNode, steps:Int, duration:TimeInterval, completion:@escaping ()->Void) {
    guard let path = circle.path else {
        return
    }
    let radius = path.boundingBox.width/2
    let timeInterval = duration/TimeInterval(steps)
    let incr = 1 / CGFloat(steps)
    var percent = CGFloat(1.0)

    let animate = SKAction.run {
        percent -= incr
        circle.path = self.circle(radius: radius, percent:percent)
    }
    let wait = SKAction.wait(forDuration:timeInterval)
    let action = SKAction.sequence([wait, animate])

    run(SKAction.repeat(action,count:steps-1)) {
        self.run(SKAction.wait(forDuration:timeInterval)) {
            circle.path = nil
            completion()
        }
    }
}

// Creates a CGPath in the shape of a pie with slices missing
func circle(radius:CGFloat, percent:CGFloat) -> CGPath {
    let start:CGFloat = 0
    let end = CGFloat.pi * 2 * percent
    let center = CGPoint.zero
    let bezierPath = UIBezierPath()
    bezierPath.move(to:center)
    bezierPath.addArc(withCenter:center, radius: radius, startAngle: start, endAngle: end, clockwise: true)
    bezierPath.addLine(to:center)
    return bezierPath.cgPath
}

和一个视频片段：

Swift, sprite kit game: 圆圈顺时针消失了吗？在定时器上？

Swift, sprite kit game: Have circle disappear in clockwise manner? On timer?

timer

sprite-kit

swift

xcode6