随笔--帧动画的几种简单实现方式

课堂随笔

1、帧动画

ž 使用纹理创建帧动画

ž 使用Plist纹理图集创建帧动画

ž 使用动画编辑器创建帧动画

2、使用Animation创建帧动画

ž 1.创建SpriteFrame

ž 2.使用集合(C++)/表（lua）来保存

ž 3.根据集合创建Animation

ž 4.基于Animation创建Animate

ž 通过Action的组合判断动画播放完成

ž 通过AnimationCatch完成动画切换

原来的代码实现帧动画播放完成，是可以定义Animation的序列，而在cocostudio是有一个事件的处理函数的

代码方式实现-----帧动画，示例及源码如下：

 

require "Cocos2d"

local AniScene=class("AniScene",function ()

    return cc.Scene:create()

end)

 

function AniScene:create()

    local as=AniScene.new()

    as:addChild(as:init())

    return as

 

end

function AniScene:ctor()

 

    self.winsize=cc.Director:getInstance():getWinSize()

 

 

end

function AniScene:init()

    local layer=cc.Layer:create()

 

    --创建4组的动画

    for n=1,4do

       --创建动画的每一帧

       local allf={}

       for i=1,4do

           allf[i]=cc.SpriteFrame:create("npc1.png",cc.rect((i-1)*32,(n-1)*48,32,48))

 

       end

       --根据帧的集合创建动画对象

       local animation=cc.Animation:createWithSpriteFrames(allf,0.1)

       --将动画的对象保存到动画的缓存

       if n==1 then

           cc.AnimationCache:getInstance():addAnimation(animation,"playerdown")

 

       elseifn==2 then

           cc.AnimationCache:getInstance():addAnimation(animation,"playerleft")

 

       elseifn==3 then

           cc.AnimationCache:getInstance():addAnimation(animation,"playerright")

       elseifn==4 then

           cc.AnimationCache:getInstance():addAnimation(animation,"playerup")

 

       end

    end

 

    --首先向下走

    local animateDown=cc.Animate:create(cc.AnimationCache:getInstance():getAnimation("playerdown"))

    --创建精灵动画

    local sp=cc.Sprite:create()

    sp:setPosition(100,200)

    sp:runAction(cc.RepeatForever:create(animateDown))

    layer:addChild(sp)

 

    --增加屏幕触摸的处理

    local function onTouchBegan(t,e)

 

       local my=math.abs(t:getLocation().y-sp:getPositionY())

       local mx=math.abs(t:getLocation().x-sp:getPositionX())

       local far=math.sqrt(my*my+mx*mx)

       --修改对象

       local ani=""

       if my>mx then --上下

           ift:getLocation().y>sp:getPositionY()then

                ani="playerup"

       else

           ani="playerdown"

       end

 

       else          --左右

           ift:getLocation().x>sp:getPositionX()then

                ani="playerright"

       else

           ani="playerleft"

       end

       end

 

       sp:stopAllActions()

       --改变动画

       sp:runAction(cc.RepeatForever:create(

           cc.Animate:create(cc.AnimationCache:getInstance():getAnimation(ani))

       ))

       --改变坐标

       sp:runAction(cc.MoveTo:create(far/300,t:getLocation()))

 

    end

    local listener=cc.EventListenerTouchOneByOne:create()

    listener:registerScriptHandler(onTouchBegan,cc.Handler.EVENT_TOUCH_BEGAN)

    cc.Director:getInstance():getEventDispatcher():addEventListenerWithSceneGraphPriority(listener,layer)

    return layer

end

return AniScene

动画编辑器编辑动画：----帧动画:

4、添加CocosTudio帧动画 C++

ž ArmatureDataManager::getInstance()->addArmatureFileInfoAsync(

ž "armature/weapon.png",

ž "armature/weapon.plist",

ž "armature/weapon.xml", this,schedule_selector(TestAsynchronousLoading::dataLoaded));

ž  Armature *armature =Armature::create("bear");  

ž  armature->getAnimation()->playWithIndex(0);

ž //播放第一个动画

 

5、添加CocosTudio帧动画 Lua

ž ccs.ArmatureDataManager:getInstance():

ž addArmatureFileInfoAsync(

ž "armature/export.json”)

ž  localarmature = ccs.Armature:create("bear")

ž  armature:getAnimation():playWithIndex(0)

ž     armature:setPosition(cc.p(VisibleRect:center()))

ž    self:addChild(armature)

 

6、使用cocostudio编辑好动画;lua中这样写

添加编辑好的帧动画init（）中

--加载动画到内存中

  ccs.ArmatureDataManager:getInstance():addArmatureFileInfo(

  "pkplayer2/player.png","pkplayer2/player.plist","pkplayer2/pkplayer2.ExportJson")

  --从内存中取出动画

    local armature=ccs.Armature:create("pkplayer2")

    --播放第一个动画

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

    --把动画添加到屏幕

    layer:addChild(armature)

    armature:setPosition(self.winsize.width/2,self.winsize.height/2)

cocostudio中实现切换帧动画：需要在构造函数中定义记录一下

self.nowani=true

在执行run动画的时候记录self.nowani=true

--点击屏幕就切换动画

    local function onTouchBegan(t,e)

 

       if self.nowani==true then

           armature:getAnimation():play("jump")

       else

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

 

       end

       self.nowani=notself.nowani  --打返

    end

--注册

    local listener=cc.EventListenerTouchOneByOne:create()

    listener:registerScriptHandler(onTouchBegan,cc.Handler.EVENT_TOUCH_BEGAN)

cc.Director:getInstance():getEventDispatcher():addEventListenerWithSceneGraphPriority(listener,layer)

 

cocostudio实现动画播放完成之后检测到这个事件------ lua

--处理帧动画事件

      local functionanimationEvent(armatureBack,movementType,movementID)

       local id = movementID

        if movementType == ccs.MovementEventType.loopComplete then

           print("id="..id.."播放完成")

           if id=="jump" then

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

           end

        end

      end

   armature:getAnimation():setMovementEventCallFunc(animationEvent)