SpriteKit塔防游戏动态改变防御塔价格标签的颜色

大熊猫猪·侯佩原创或翻译作品.欢迎转载,转载请注明出处.
如果觉得写的不好请多提意见,如果觉得不错请多多支持点赞.谢谢! hopy ;)

---

本篇blog在DinoDefense塔防游戏基础之上做一处小的修改,如果不知道该游戏是啥,请自行度娘或谷哥补脑…

该游戏在用户点击防御塔基座时会弹出购买菜单:

游戏HUD界面上方有用户剩余金币数量,每个防御塔有其自己的价格,如果用户持有的金币数量小于塔的价格,应该阻止用户购买并且在这之前用明显的视觉提示用户:钱不够了!

上图中显示的是我对游戏代码做了修改之后的效果,所以你可以看到如果钱不够,塔的价格会显示为红色.

DinoDefense是一个非常吸引人的塔防游戏,不过在这一点上把修改的机会留给了我们.下面就简单谈谈如何做这样一处小的修改,也非常简单,希望大家可以坚持看完,希望可以帮助大家一点点 ;]

首先想到的一种做法是在显示防御塔购买菜单的时候比较塔的价格和剩余金币的数量,不过这样做有2个问题:

1. TowerSelectorNode类中没有引入GameScene类的实例,意味着你无法读取到剩余的金币数量,你只有添加GameScreen实例作为其属性,因此你要修改你的初始化方法,比较繁琐…差评!
2. 当你弹出防御塔购买菜单后,价格标签的颜色也就不会改变了,如果此时剩余金币数量发生了变化,价格标签无法做对应的改变,这显然是很差的用户体验…还是差评!

那么如果既做到较少修改原有代码又有完美的用户体验呢?我们可以用通知!

思考之后的解决办法如下:首先TowerSelectNode注册一个GoldChangedNotification通知,当在GameScene中用户剩余金币发生变化时则向其发出通知消息,然后TowerSelectNode做出对应处理…完美!

首先在GameScene.swift中添加通知消息名称:

let goldChangedNotification = "kGoldChangedNotification"

然后给GaneScene添加实例方法:

func goldDidChanged(){
        NSNotificationCenter.defaultCenter().postNotificationName(goldChangedNotification, object: nil, userInfo: ["gold":gold])
    }

然后在金币发生变化之后立即调用该方法:

gold -= towerType.cost
        goldDidChanged()
        updateHUD()

然后打开TowerSelectorNode.swift,在init初始化器中添加如下代码:

NSNotificationCenter.defaultCenter().addObserver(self, selector: #selector(goldChanged), name: goldChangedNotification, object: nil)

同样需要在析构方法中调用解除监听:

deinit{
        NSNotificationCenter.defaultCenter().removeObserver(self)
    }

最后添加以下2个方法:

func changeTextColorByLeftGold(goldLeft:Int){
        let towerCost = Int(costLabel.text!)

        if towerCost > goldLeft{
            costLabel.fontColor = SKColor.redColor()
        }else{
            costLabel.fontColor = SKColor.whiteColor()
        }
    }

    func goldChanged(notification:NSNotification){
        let goldLeft = notification.userInfo!["gold"] as! Int
        changeTextColorByLeftGold(goldLeft)
    }

再次运行游戏,发现第一次弹出防御塔购买菜单时,标签颜色是错误的,但剩余金币发生变化后标签的颜色都是正确.

原因很简单,因为你在防御塔购买菜单初始化的时候没有考虑到剩余金币数量的问题!为了修改这一bug,首先我们在GameSceneHelper.swift(GameSceneHelper是GameScene的超类,gold定义在其中)中添加一个全局变量:

let InitGold = 75
//并且修改gold为该值
var gold:Int = InitGold

然后回到TowerSelectorNode.swift的setTower方法中添加如下一行:

changeTextColorByLeftGold(InitGold)

这时防御塔购买弹出菜单在任何时候的状态都是正确的了:

注意看,当剩余金币大于50时,木塔的价格标签颜色实时变为白色表示此时可以再次购买了,而且购买弹出菜单初始的颜色也是正确的,因为开始石塔是红色的!

如果哪位童鞋由于学习需要源代码的可以找我,也可以自行在网上搜索,最后感谢观赏,See you next time ;]