swift - Spritekit中扩展圆形抠图转场效果

Question

我正在尝试在 sprite kit 中获得类似于任天堂 super 马里奥运行游戏中的过渡效果

我只想要一个圆形切口来扩展以显示下一个场景或仅显示当前场景。这不是标准的 iOS Sprite 工具包过渡之一。

我用一个覆盖整个场景的全黑图层完成了此操作，并使用 SKCropNode 为一个不断扩大的圆圈制作动画以显示场景。

以下是didMove(to view: SKView)

中的代码

let fullScreen = SKSpriteNode(color: .black, size: self.size)
let mask = SKSpriteNode(color: .black, size: self.size)
let circle = SKShapeNode(circleOfRadius: self.size.height / 2)
circle.fillColor = .white
circle.blendMode = .subtract
circle.setScale(0.001)
circle.isHidden = true
circle.name = "circleShape"
mask.addChild(circle)

let crop = SKCropNode()
crop.position = CGPoint(x: self.size.width / 2, y: self.size.height / 2)
crop.maskNode = mask
crop.name = "cropNode"
crop.addChild(fullScreen)
crop.zPosition = 100

self.addChild(crop)

let waitAction = SKAction.wait(forDuration: 2.0)
let callAction = SKAction.run({
    let cropNode = self.childNode(withName: "cropNode") as! SKCropNode
    let maskNode = cropNode.maskNode as! SKSpriteNode
    let circleNode = maskNode.childNode(withName: "circleShape") as! SKShapeNode
    circleNode.isHidden = false
    let scaleAction = SKAction.scale(to: 2.0, duration: 2.0)
    scaleAction.timingFunction = scaleAction.easeInQuartic
    circleNode.run(scaleAction, completion: {
        cropNode.removeFromParent()
    })
})
let seqAction = SKAction.sequence([waitAction,callAction])
self.run(seqAction)

这在模拟器中有效，但在设备(配备最新 iOS 10 的 iPad pro 2016)上运行时无效。在设备上，缩放 Action 完成后，没有出现扩大的圆圈，黑色覆盖层消失。

我的问题:

1) 为什么这不能在设备上运行而只能在模拟器上运行？

2) 是否有更好更有效的方法来实现 sprite kit 中的这种转换？

提前致谢。

Answer 1

可能有 100 种不同的方法可以实现这一目标。我的方法比你的好吗？可能不是，但这对我在模拟器和 iPad 上都适用。

只需以 0.0 的持续时间过渡到您的场景，然后从 didMove(to view:) 运行这个乐趣

你需要一个单独的圆圈图像的原因是它在放大时保持它漂亮的清晰边缘

bgOverlay 只是从全黑屏幕开始，然后应用伪过渡

func circleTransition() {

    let bgMask = SKSpriteNode(texture: SKTexture(imageNamed: "bg_mask"), color: .clear, size: CGSize(width: self.size.width, height: self.size.height))
    bgMask.position = CGPoint(x: self.size.width / 2, y: self.size.height / 2)
    bgMask.zPosition = 5000
    self.addChild(bgMask)

    let transitionCircle = SKSpriteNode(texture: SKTexture(imageNamed: "transition_circle"), color: .clear, size: CGSize(width: 13, height: 13))
    transitionCircle.position = CGPoint.zero
    transitionCircle.zPosition = 1
    bgMask.addChild(transitionCircle)

    let bgOverlay = SKSpriteNode(texture: SKTexture(imageNamed: "bg_overlay"), color: .clear, size: CGSize(width: self.size.width, height: self.size.height))
    bgOverlay.position = CGPoint(x: self.size.width / 2, y: self.size.height / 2)
    bgOverlay.zPosition = 5001
    self.addChild(bgOverlay)

    bgMask.run(SKAction.sequence([SKAction.scale(to: 100.0, duration: 2.0), SKAction.removeFromParent()]))
    bgOverlay.run(SKAction.sequence([SKAction.fadeOut(withDuration: 0.1), SKAction.removeFromParent()]))
}