ios - Swift 使用 SKSpriteNode 创建健康进度条

Question

这是我当前的进度条代码。 在 GameScene 中，我设置了 var xProgress = 1。空图像不应该显示为值现在应该 = 0 吗？

我正在尝试测试 SKNode，然后再使它的值随着时间的推移而降低，因此它会缓慢降低。

class IMProgressBar : SKNode{

var emptySprite : SKSpriteNode? = nil
var progressBar : SKCropNode
init(emptyImageName: String!,filledImageName : String)
{
    progressBar = SKCropNode()
    super.init()
    let filledImage  = SKSpriteNode(imageNamed: filledImageName)
    progressBar.addChild(filledImage)
    progressBar.maskNode = SKSpriteNode(color: UIColor.white,
                                        size: CGSize(width: filledImage.size.width * 2, height: filledImage.size.height * 2))

    progressBar.maskNode?.position = CGPoint(x: -filledImage.size.width / 2,y: -filledImage.size.height / 2)
    progressBar.zPosition = 0.1
    self.addChild(progressBar)

    if emptyImageName != nil{
        emptySprite = SKSpriteNode.init(imageNamed: emptyImageName)
        self.addChild(emptySprite!)
    }
}
func setXProgress(xProgress : CGFloat){
    var value = xProgress
    if xProgress < 0.1{
        value = 0
    }
    if xProgress > 0.1 {
        value = 0
    }
    progressBar.maskNode?.xScale = value
}

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

在我的 GameScene 中我还有:

let progressBar = IMProgressBar(emptyImageName: nil,filledImageName: "health")
    progressBar.position = CGPoint(x: self.frame.midX, y: self.frame.height / 3)
    self.addChild(progressBar)

Answer 1

您可以使用两个 Sprite 节点实现一个进度条，其中一个节点是进度条，另一个是背景。

首先，创建大小相同的条形节点和背景节点:

background = SKSpriteNode(color:SKColor.white, size:size)
bar = SKSpriteNode(color:color, size:size)

接下来，将条形图的 zPosition 设置为高于背景的值，这样条形图就会出现在背景之上。通过将 anchorPoint 设置为 (0, 0.5) 来左对齐栏，并设置栏的位置，使其位于背景的左边缘。

bar.zPosition = 1.0
bar.anchorPoint = CGPoint(x:0.0,y:0.5)
bar.position = CGPoint(x:-size.width/2,y:0)

最后，通过在x方向缩放条来设置进度量

bar.xScale = value

其中 value 是介于 0 和 1 之间的值，包括 0 和 1。

下面是作为 SKNode 子类的完整实现:​​

class ProgressBar:SKNode {
    var background:SKSpriteNode?
    var bar:SKSpriteNode?
    var _progress:CGFloat = 0
    var progress:CGFloat {
        get {
            return _progress
        }
        set {
            let value = max(min(newValue,1.0),0.0)
            if let bar = bar {
                bar.xScale = value
                _progress = value
            }
        }
    }

    convenience init(color:SKColor, size:CGSize) {
        self.init()
        background = SKSpriteNode(color:SKColor.white,size:size)
        bar = SKSpriteNode(color:color,size:size)
        if let bar = bar, let background = background {
            bar.xScale = 0.0
            bar.zPosition = 1.0
            bar.position = CGPoint(x:-size.width/2,y:0)
            bar.anchorPoint = CGPoint(x:0.0,y:0.5)
            addChild(background)
            addChild(bar)
        }
    }
}

用法:

let progressBar = ProgressBar(SKColor.blue, size:CGSize(width:100, height:10))

addChild(progressBar)

progressBar.progress = 0.5