【quick-cocos2d-x】动画和粒子

帧动画

帧动画需要一组的图片序列，用于创建精灵帧，一般是先将图片加载到精灵帧缓冲区，然后创建动画的时候再从缓冲区取

local SpriteFrameCache = cc.SpriteFrameCache:getInstance()
SpriteFrameCache:addSpriteFrames("char/wj24.plist")

这是使用合图的情况，也可以不使用合图，手动根据碎图创建精灵帧再添加到缓冲区，也可以不添加到缓冲区，创建动画时再创建精灵帧

帧动画使用 Animation 来组织，创建一个 Animation 之后要设置每一帧的间隔，动画循环次数以及添加精灵帧

animation = cc.Animation:create()
animation:setDelayPerUnit(0.1)
animation:setLoops(-1)
frame = SpriteFrameCache:getSpriteFrame(key)
animation:addSpriteFrame(frame)

最后创建一个动作 Animate，再使用 Sprite:runAction(Animate) 来播放

animate = cc.Animate:create(animation)
char:runAction(animate)

一个完整的示例

function CharLayer:createAnimation()
    SpriteFrameCache:addSpriteFrames("char/wj24.plist")

    self.char = display.newSprite():addTo(self):pos(display.cx, display.cy)
    self.animation = cc.Animation:create()
    self.animation:setDelayPerUnit(0.1)
    self.animation:setLoops(-1)

    local key = "wj24_attack_10000.png"
    local frame = SpriteFrameCache:getSpriteFrame(key)
    self.char:setSpriteFrame(frame)
    self.animation:addSpriteFrame(frame)

    local i = 1
    while true do
        key = string.format("wj24_attack_1%04d.png", i)
        frame = SpriteFrameCache:getSpriteFrame(key)
        if frame == nil then
            break
        end
        i = i + 1
        self.animation:addSpriteFrame(frame)
    end

    self.animate = cc.Animate:create(self.animation)
    self.animate:retain()
end

function CharLayer:playAnimation()
    if tolua.isnull(self.animate) then
        print("animation is null")
        return
    end

    self.char:stopAllActions()
    self.char:runAction(self.animate)
end

骨骼动画

骨骼动画使用 ArmatureDataManager 来管理数据，使用 Armature 来创建动画结点；Armature 结点是一个包含动画的显示对象，可直接添加到场景中，而帧动画 Animation 只是一个动画数据，Animate 则是一个动作，必须使用 Sprite 来执行。这两个类在 ccs 包下面

首先，使用 ArmatureDataManager 加载动画数据，数据有两种格式，xml 和 ExportJson(其实就是 json 文件)；无论哪种格式的数据都需要一张合图和一个 plist 文件

使用 xml 格式的数据

ccs.ArmatureDataManager:getInstance():addArmatureFileInfo("char/Dragon.png", "char/Dragon.plist", "char/Dragon.xml")

使用 json 格式的数据

ccs.ArmatureDataManager:getInstance():addArmatureFileInfo("char/Cowboy.ExportJson")

这个不需要指定 png 和 plist 文件，因为 json 文件中已经包含这个信息了

接下来就是创建一个 Armature，创建的时候只需要传入一个名称即可，这个名称必须是前面已经加载的数据

armature = ccs.Armature:create("Cowboy")
self:addChild(armature)
armature:setPosition(cc.p(display.cx - 100, display.cy - 100))
armature:setScale(0.3)

播放和停止动画需要先获取到 Animation，播放动画有两种方式，一种是使用下标，一种是使用名称

armature:getAnimation():play("run")
armature:getAnimation():playWithIndex(0)

停止动画

self.armature:getAnimation():stop()

根据骨骼名称可以获取骨骼，获取骨骼之后使用 getDisplayManager 可以获取到皮肤管理器，通过骨骼和皮肤管理器可以操作皮肤，包括添加皮肤（一块骨骼上可以添加多个皮肤）、移除皮肤、获取当前使用的皮肤下标、切换当前使用的皮肤

-- 获取骨骼
local bone = self.armature:getBone("Layer130")
-- 获取骨骼皮肤下标
local index = bone:getDisplayManager():getCurrentDisplayIndex()
print("skin index for this bone: ", index)
-- 创建新皮肤
local skin = ccs.Skin:createWithSpriteFrameName("robotFolder-bady-a2.png")
-- 添加皮肤
bone:addDisplay(skin, 1)
-- 移除皮肤
bone:removeDisplay(0)
-- 替换显示的皮肤
bone:changeDisplayWithIndex(0, true)
-- 再次获取骨骼皮肤下标
local index = bone:getDisplayManager():getCurrentDisplayIndex()
print("skin index for this bone: ", index)

要注意的是移除一个皮肤之后，后面的皮肤会自动往前移

一个播放骨骼动画的示例

function CharLayer:createArmature()
    ccs.ArmatureDataManager:getInstance():addArmatureFileInfo("char/Cowboy.ExportJson")
    self.armature = ccs.Armature:create("Cowboy")
    self:addChild(self.armature)
    self.armature:setPosition(cc.p(display.cx - 100, display.cy - 100))
    self.armature:setScale(0.3)
    self.armatureIndex = 0
end

function CharLayer:playArmature()
    self.armature:getAnimation():playWithIndex(self.armatureIndex)
    if self.armatureIndex == self.armature:getAnimation():getAnimationData():getMovementCount() -1 then
        self.armatureIndex = 0
    else
        self.armatureIndex = self.armatureIndex + 1
    end
end

粒子系统

cocos2d-x 使用 ParticleSystem 来创建粒子系统，ParticleSystemQuad 继承自 ParticleSystem，是 ParticleSystem 的升级版。创建粒子系统很简单，先使用粒子编辑器软件（比如 ParticleEditor）编辑好一个粒子，导出 plist 文件，然后根据 plist 文件创建一个粒子添加到场景就可以自动播放了。当然也可以不使用 plist 文件（还有一张小贴图），而是直接在代码中设置粒子的各个属性，但这个方式不仅麻烦而且低效，基本不会有人这么做的。

self.particle = cc.ParticleSystemQuad:create("effect/snow.plist")
self:addChild(self.particle)
self.particle:setPosition(display.cx, display.height)