Cocos2d-x层动画实现

实现原理

    平时当我们添加一个CCLayer到场景中时，如果直接addChild把CCLayer添加到场景会显得有些不自然，对于场景的切换cocos2d-x官方已经有封装好切换动画了，但层的切换却没有，但是我们可以通过runAction方法来实现动画效果。

    实现CCLayer的进场动画

    1. 层动画的定义（比如从0放大到1倍）

    2. 重写CCLayer的onNodeEnter方法，在方法实现的调用自定义层动画

    

    实现CCLayer退场动画

    1. 层动画的定义

    2. 在层的关闭按钮的回调中调用自定义层动画，并在动画结束后从场景中移除

示例代码

lua代码：层动画的定义

-- 进场动画
function enterAnimation(self)
    -- self.node_是当前的CCLayer    
    -- 设置CCLayer缩放比为0
    self.node_:setScale(0)
    
    -- 设置CCLayer的位置
    local size = self.node_:getParent():getContentSize()
    self.node_:setAnchorPoint(ccp(0.5,0.5))
    self.node_:setPosition(size.width/2, size.height/2)

    -- 动画效果：1.从0倍缩放到1.1倍（0.5秒） -> 2.从1.1倍缩放到1倍（0.1秒）
    local array = CCArray:create()
    array:addObject(CCScaleTo:create(0.5,1.1,1.1))
    array:addObject(CCScaleTo:create(0.1,1,1))
    local action = CCSequence:create(array)
    self.node_:runAction(action)
end

-- 退场动画
function exitAnimation(self)
    -- 设置CCLayer的缩放比为1
    self.node_:setScale(1)
    -- 设置CCLayer的位置
    local size = self.node_:getParent():getContentSize()
    self.node_:setAnchorPoint(ccp(0.5,0.5))
    self.node_:setPosition(size.width/2, size.height/2)

    -- 动画效果：1.从1倍缩放到1.1倍（0.1秒） -> 2.从1.1倍缩放到0.2倍（0.1秒） -> 3.从场景中移除
    local array = CCArray:create()
    array:addObject(CCScaleTo:create(0.1,1.1,1.1))
    array:addObject(CCScaleTo:create(0.5,0.2,0.2))
    local function cleanupCallback()
        self.node_:removeFromParentAndCleanup(true)
    end
    array:addObject(CCCallFunc:create(cleanupCallback))
    local action = CCSequence:create(array)
    self.node_:runAction(action)
end

Lua代码：在Layer添加到场景时调用入场动画

function onNodeEnter(self)
    self:enterAnimation()
end

Lua代码：在点击Layer的关闭按钮时调用退场动画：

function backCallback(self)
    self:exitAnimation()
end