quick cocos2dx 播放序列帧动画的实现

本帖基于quick cocos2dx2.2.6版本。

序列帧动画:顾名思义就是在一定的时间内播放多张图片。

基本原理非常简单,在一个固定的位置1秒时间内轮询播放有限数量的不同图片。比如1秒中播放24张图(FPS=24)

在quick引擎中可以通过framwork中的transition.lua文件中得transition.playAnimationForever(target, animation, delay)接口来实现动画的播放,其源码如下:

function transition.playAnimationForever(target, animation, delay)
    local animate = CCAnimate:create(animation)
    local action
    if type(delay) == "number" and delay > 0 then
        target:setVisible(false)
        local sequence = transition.sequence({
            CCDelayTime:create(delay),
            CCShow:create(),
            animate,
        })
        action = CCRepeatForever:create(sequence)
    else
        action = CCRepeatForever:create(animate)
    end
    target:runAction(action)
    return action
end

在需要显示动画的界面里加入如下代码:

local node = display.newSprite()
        :pos(display.cx,display.cy)
        :addTo(self)
    transition.playAnimationForever(node, GameResouce.createEffect("filename","ui"), 1)

注意这里的node一定要是一个sprite实例。

GameResouce是对动画资源的一个简单封装类型,大概实现写资源缓冲及创建动画的功能。功能代码如下:

GemeResource = GemeResource or {}
local sharedSpriteFrameCache = CCSpriteFrameCache:sharedSpriteFrameCache()--创建缓存
function GemeResource.createCacha()
    assert(GemeResource.cacha == nil)
    GemeResource.cacha = {}
end
--清理缓存
function GemeResource.releaseCacha()
    assert(GemeResource.cacha)
    for k,v in pairs(GemeResource.cacha) do
        sharedSpriteFrameCache:removeSpriteFramesFromFile(k..".plist")
        CCTextureCache:sharedTextureCache():removeTextureForKey(k..".png")
    end
    GameResource.cacha = nil
end

function GameResource.createEffect(name, dir, zoom)
    zoom = zoom or 1

    -- 加载plist
    local path = "anim/" .. dir .. "/" .. name--默认将动画资源放入res/anim目录下
    sharedSpriteFrameCache:addSpriteFramesWithFile(path..".plist", path..".png")
    if GameResource.cacha then
        GameResource.cacha[path] = true
    end

    local frame_name = string.split(name, "_")[1]--plist中图片的名称命名规则为xxx_001.png,所以此处将图片名称中得xxx字符串取出

    local frames = {}
    local count = 1
    local name = ""
    while true do
        local frame = GameResource.loadFrame(frame_name, count)
        if not frame then
            break
        end
        table.insert(frames, frame)
        count = count + 1
    end

    if #(frames) <= 0 then
        echoError("error ", dir.." name:"..name)
        return nil
    end

    local fps = 1/24 --设置默认fps为24
    local animation = display.newAnimation(frames, fps)--创建动画实例
    animation:setDelayPerUnit(animation:getDelayPerUnit()*zoom)--zoom的作用:可以在不改变fps的情况下加速或放慢动画的播放频率

    return animation
end
function GameRes.loadFrame(_name, _id)
    return sharedSpriteFrameCache:spriteFrameByName(string.format("%s_%03d.png",_name,_id))
end
return GemeResource

完整的测试代码如下:

local AnimationTest = class("AnimationTest",function()
    return display.newScene("AnimationTest")
end)

function AnimationTest:ctor()
    GameResource.createCacha()
    local node = display.newSprite()
        :pos(display.cx,display.cy)
        :addTo(self)
    transition.playAnimationForever(node, GameResource.createEffect("ani","ui"), 0)--ui为res下的目录 ani为动画文件的名称(ani.plist,ani.png 两个文件通过TP工具导出)
end

function AnimationTest:onEnter()

end

return AnimatiionTest
时间: 2024-08-25 13:44:58

quick cocos2dx 播放序列帧动画的实现的相关文章

Unity3D中播放序列帧动画

[狗刨学习网] class FrameAnimation { private float fps = 10.0f; private Rect drawPos; private float time = 0; private int currentIndex = 0; public void DrawFrameAnimation(Texture[] frameTex) { int length = frameTex.Length; GUI.DrawTexture(drawPos, frameTex

Unity Shader播放序列帧动画

1 Shader "LordShader/AnimateSprite" { 2 Properties { 3 _MainTint ("Diffuse Color", Color) = (1,1,1,1) //颜色属性,可以在u3d inspector面板控制该变量 4 _MainTex("Base (RGB)",2D) = "white" {} //贴图 5 _TexWidth("Sheet Width",

Cocos2d-x入门: 序列帧动画实现

cocos2d-x 2.x   CCArray* splashFrames = CCArray::createWithCapacity(16); for (int i=1; i<=23; i++) { const char* str = CCString::createWithFormat("Splash_%04d.png",i)->getCString(); CCSpriteFrame* frame = cache->spriteFrameByName(str);

[Cocos2d-x v3.x]序列帧动画

简介 Cocos2d-x中,动画的具体内容是依靠精灵显示出来的,为了显示动态图片,我们需要不停切换精灵显示的内容,通过把静态的精灵变为动画播放器从而实现动画效果.动画由帧组成,每一帧都是一个纹理,我们可以使用一个纹理序列来创建动画. 我们使用Animation类描述一个动画,而精灵显示动画的动作则是一个Animate对象.动画动作Animate是精灵显示动画的动作,它由一个动画对象创建,并由精灵执行. 创建方法 - 手动添加序列帧到Animation类 - 使用文件初始化Animation类 手

cocos2d-x学习笔记(二)序列帧动画实现的几种方法

一.cocos2d-x帮助文档中关于动画帧动画的实现有两种方法: 手动添加序列帧到Animation类 使用文件初始化Animation类 这里我就不列出来,大家可以看下官方文档 http://www.cocos.com/doc/article/index?type=cocos2d-x&url=/doc/cocos-docs-master/manual/framework/native/v3/frame-animation/zh.md 二.有些时候我们需要从plist取出指定的几个图片(而不是全

序列帧动画

简介 Cocos2d-x中,动画的具体内容是依靠精灵显示出来的,为了显示动态图片,我们需要不停切换精灵显示的内容,通过把静态的精灵变为动画播放器从而实现动画效果.动画由帧组成,每一帧都是一个纹理,我们可以使用一个纹理序列来创建动画. 我们使用Animation类描述一个动画,而精灵显示动画的动作则是一个Animate对象.动画动作Animate是精灵显示动画的动作,它由一个动画对象创建,并由精灵执行. 创建方法 手动添加序列帧到Animation类 使用文件初始化Animation类 手动添加

Quick cocos2dx-Lua(V3.3R1)学习笔记(六)----让精灵动起来吧,使用序列帧动画

光有精灵太死板了,游戏里面肯定有不同的动画,难道人物走动,一张静态图就能打发对游戏质量要求越来越高的玩家么?所以我们要让精灵动起来 quick里面提供了使用序列帧动画的函数,我们直接使用就行了 现将大图载入缓存中,然后提取出来用即可 主要就是display,newFrames参数,这个有点string.format的味道 @function [parent=#display] newFrames -- @param string pattern 模式字符串 -- @param integer b

Cocos2dx学习笔记10:cocos2dx序列帧动画(1)

在cocos2dx里是不支持gif动画的,所以我们无法给精灵设置gif格式的图片.但是如果我们想实现动画效果呢?那么我们就要自己通过大量的静态图来组成播放成动画. 在cocos2dx里提供了序列帧动画的概念来实现这个功能,动画由帧组成,每一帧都是一个纹理,我们可以使用一个纹理序列来创建动画. 首先找一张动图的gif图,这里QQ群里最近动图的逗逼图太多,我就随便找了一张,把图片另存到桌面,打开ps软件,把图片拖进去,这样gif图会被拆分许多的图层.我们把图层一个一个图层的保存成png的静态图,命名

Qt Quick播放Gif动画

Qt Quick提供了一个类 AnimatedImage ,可以播放 Gif 动画,使用简单,这里是一个示例. 这里是用到的 Gif 图片: AnimatedImage AnimatedImage 提供了五个属性: currentFrame,指示当前正在播放的帧序号 frameCount,指示图片的总帧数 paused,表示是否暂停,设置它也可以暂停或继续播放 playing,指示动画是否在播放,默认为 true ,意思是 AnimatedImage 对象创建后立即开始播放 source,类型为