博客动态

Hi！欢迎来到Jerry Coding！2024年 CSDN资源免积分下载网页版上线，让你轻松GET想要的资源！

扫一扫关注我

More

关于

New

RSS

标签云

微信助手 MySQL ckeditor C#自动升级器 cocos git pyqt Virtualenv Linux 12306余票瞎扯扯 Nginx sqlite 在线工具 C# 爬虫 ESP32 网站建设 OCR图像识别 winform django-allauth cdn加速 CSDN免积分下载 rest-framework bootstrap3 课程设计 ESP8266 pycharm tkinter 物联网 django

网站友链

Cocos Creator基础：插入控制龙骨动画

2019年3月27日 Jerry 10908 2019年6月24日

博主想搞个小游戏玩玩，由于美工没有，游戏动画成为一大难题！帧图片动画需要大量的图片资源，相对来说比较麻烦。龙骨动画正好弥补其中不足~如何在cocos中插入并控制龙骨动画呢？往下看！关于什么是龙骨动画，怎么玩的这个就不说了，大家可以搜索去他的官网研究下。

一、插入龙骨

首先，一个龙骨文件应该有如下3个文件：

我们在场景中新建一个空节点，并为其添加一个DragonBones组件：

将资源文件如下图拖入到新加的龙骨组件中，如果龙骨文件时正确的，我们可以看到动画主角已经有了：

二、播放动画

龙骨中的动画名称是制作龙骨时就指定好的，我们在龙骨的属性中也可以看到，这里只有一个名字叫 run的动画：

我们给游戏场景添加一个按钮，并新建一个脚本添加给英雄，实现点击一下按钮就执行跑的动作。js脚本demo代码如下：

cc.Class({
    extends: cc.Component,

    properties: {

        mButton: {
            default: null,
            type: cc.Node
        },
    },

    onLoad () {

        //获取 ArmatureDisplay
        this._armatureDisPlay = this.getComponent(dragonBones.ArmatureDisplay)

        //添加动画监听
        //动画播放开始
        this._armatureDisPlay.addEventListener(dragonBones.EventObject.START, this.animationEventHandler, this)
        //动画播放结束
        this._armatureDisPlay.addEventListener(dragonBones.EventObject.COMPLETE, this.animationEventHandler, this)

        //增加按钮事件
        if (this.mButton) {
            this.mButton.on(cc.Node.EventType.TOUCH_START, function (event) {
                cc.log("click");
                //播放动画
                this._armatureDisPlay.playAnimation('Run', 1);
            }, this);
        }
    },

    //动画监听事件
    animationEventHandler: function animationEventHandler(event) {
        if (event.type == dragonBones.EventObject.START) {
            cc.log(event.animationState.name + "  start!");
        } else if (event.type == dragonBones.EventObject.COMPLETE) {
            cc.log(event.animationState.name + "  complete!");
        }
    },
    //start () {

    //},

    // update (dt) {},
});

注释很清楚，关于龙骨的具体其他API可以参考这里。最终实现的效果如下：