How To Create a Pulse Effect On an SKSpriteNode?

房东的猫 提交于 2019-12-10 14:56:36

问题


Hi would like to learn how to create a visual pulse effect as in the video below.

https://www.youtube.com/watch?v=uiHj-KZWjpU

I followed the link posted in the video; however, I have not been able to achieve the same effect. I am having trouble doing it with an SKSpriteNode.

Preferably I would like to be able to loop this effect to repeat every second or so.

Any help would be very much appreciated! Thanks!


回答1:


A real easy way of doing this would be to have your button image, and an outline image right below you button. then just run the pulse func on the button outline image and voila! It works with any shape and you can just adjust the actions as you see fit. These are added via the scene editor but it makes no difference how they are added as long as the outline images have a lower zPosition than the button.

class LevelMenu: SKScene {

    private var button1 = SKSpriteNode()
    private var button1Outline = SKSpriteNode()
    private var button2 = SKSpriteNode()
    private var button2Outline = SKSpriteNode()
    private var button3 = SKSpriteNode()
    private var button3Outline = SKSpriteNode()

    override func didMove(to view: SKView) {

        if let button1 = self.childNode(withName: "button1") as? SKSpriteNode {
            self.button1 = button1
        }

        if let button2 = self.childNode(withName: "button2") as? SKSpriteNode {
            self.button2 = button2
        }

        if let button3 = self.childNode(withName: "button3") as? SKSpriteNode {
            self.button3 = button3
        }

        if let button1Outline = self.childNode(withName: "button1Outline") as? SKSpriteNode {
            self.button1Outline = button1Outline
        }

        if let button2Outline = self.childNode(withName: "button2Outline") as? SKSpriteNode {
            self.button2Outline = button2Outline
        }

        if let button3Outline = self.childNode(withName: "button3Outline") as? SKSpriteNode {
            self.button3Outline = button3Outline
        }
    }

    func pulseAction(node: SKSpriteNode) {

        let copyNode = node.copy() as! SKSpriteNode
        copyNode.position = node.position
        addChild(copyNode)

        let scale = SKAction.scale(by: 1.75, duration: 0.4)
        scale.timingMode = .easeInEaseOut
        let wait = SKAction.wait(forDuration: 0.25)
        let fadeOut = SKAction.fadeOut(withDuration: 0.15)
        let fadeSeq = SKAction.sequence([wait, fadeOut])
        let pulseGroup = SKAction.group([scale, fadeSeq])

        copyNode.run(pulseGroup, completion: { copyNode.removeFromParent() })
    }

    override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {

        pulseAction(node: button1Outline)
        pulseAction(node: button2Outline)
        pulseAction(node: button3Outline)
    }
}



回答2:


Copy and paste this extension code to your project :

import SpriteKit

extension SKSpriteNode {

    private static let fillColor = UIColor(red: 0, green: 0.455, blue: 0.756, alpha: 0.45)

    func addPulseEffect(circleOfRadius: CGFloat, backgroundColor: UIColor = fillColor) {

        let circle = SKShapeNode(circleOfRadius: circleOfRadius)
        circle.fillColor = backgroundColor
        circle.lineWidth = 0.0
        circle.position = CGPoint(x: 0, y: 0)
        self.addChild(circle)
        let scale = SKAction.scale(to: 3.0, duration: 1.0)
        let fadeOut = SKAction.fadeOut(withDuration: 1.0)
        let pulseGroup = SKAction.sequence([scale, fadeOut])
        let repeatSequence = SKAction.repeatForever(pulseGroup)
        circle.run(repeatSequence)

    }

    func repeatPulseEffectForEver(circleOfRadius: CGFloat) {
        let _ = Timer.scheduledTimer(withTimeInterval: 0.8, repeats: true) { (timer) in
            self.addPulseEffect(circleOfRadius: circleOfRadius)
        }

    }

}

Then you can use it like this :

self.anySKSpriteNode.repeatPulseEffectForEver(circleOfRadius: 80)

For more information please check: Github repo



来源:https://stackoverflow.com/questions/43083360/how-to-create-a-pulse-effect-on-an-skspritenode

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!