CocosCreator骨骼动画之龙骨DragonBones

CocosCreator版本2.3.4

龙骨动画

将龙骨动画放到cocos的assets下。我这里龙骨动画是Dragonbones导出的二进制动画。

直接拖拽龙骨动画(骨头图标)到舞台

设置骨骼动画的属性,DragonAltasAsset图片,Animation动作,PlayTime循环播放等

代码生成龙骨动画

龙骨资源路径是assets/resources/dragonbones,loadResDir只需要填dragonbones就行了。

//根据路径加载资源
cc.loader.loadResDir("dragonbones",cc.Asset,null,(err, resource)=>{
      console.log("资源:",resource);
      //生成骨骼动画
      let node:cc.Node = new cc.Node();
      let armatureDisplay:dragonBones.ArmatureDisplay = node.addComponent(dragonBones.ArmatureDisplay);
      armatureDisplay.dragonAsset = resource[0];
      armatureDisplay.dragonAtlasAsset = resource[3];
      armatureDisplay.armatureName = "role3";
      armatureDisplay.playAnimation("move",0);
      node.x = 100;
      node.y = 100;
      this.node.addChild(node);
});

替换皮肤

//加载资源
 cc.loader.loadResDir("dragonbones",cc.Asset,null,(err, resource)=>{
     console.log("资源:",resource);

    //生成动画1
    let node:cc.Node = new cc.Node();
    let armatureDisplay:dragonBones.ArmatureDisplay = node.addComponent(dragonBones.ArmatureDisplay);
    armatureDisplay.dragonAsset = resource[0];
    armatureDisplay.dragonAtlasAsset = resource[3];
    armatureDisplay.armatureName = "role3";
    armatureDisplay.playAnimation("move",0);
    node.x = 100;
    node.y = 100;
    this.node.addChild(node);

    //生成动画2
    let node2:cc.Node = new cc.Node();
    let armatureDisplay2:dragonBones.ArmatureDisplay = node2.addComponent(dragonBones.ArmatureDisplay);
    armatureDisplay2.dragonAsset = resource[4];
    armatureDisplay2.dragonAtlasAsset = resource[7];
    armatureDisplay2.armatureName = "role4";
    armatureDisplay2.playAnimation("move",0);
    node2.x = 150;
    node2.y = 150;
    this.node.addChild(node2);

    //动画2的皮肤应用到动画1上
    let factory = dragonBones.CCFactory.getInstance();
    factory.replaceSkin(armatureDisplay.armature(), (armatureDisplay2.armature() as dragonBones.Armature).armatureData.defaultSkin, true);
});

以上就是CocosCreator骨骼动画之龙骨DragonBones的详细内容,更多关于CocosCreator骨骼DragonBones的资料请关注我们其它相关文章!

(0)

相关推荐

  • 怎样在CocosCreator中使用物理引擎关节

    CocosCreator版本2.4.2 mousejoint鼠标关节 cocos文档定义: 鼠标关节用于使刚体上的一个点追踪一个指定的世界坐标系下的位置. 鼠标关节可以指定一个最大的里来施加一个柔和的约束. 鼠标关节会自动使用 mouse region 节点来注册鼠标事件,并且在触摸移动事件中移动选中的刚体. 注意:一般鼠标关节只在测试环境中使用 说明: 任意cc.Node上添加鼠标关节,设置mouseRegion为Canvas,弹力和阻尼都为1 Mouse Region:鼠标注册节点 Freq

  • Android下2d物理引擎Box2d用法简单实例

    本文实例讲述了Android下2d物理引擎Box2d用法.分享给大家供大家参考.具体如下: 程序运行的时候需要加载Jbox2d的库,可到以下地址下载(使用的是不带渲染部分的库jbox2d-2.0.1-library-only.jar): http://sourceforge.net/projects/jbox2d/ package com.test; import org.jbox2d.collision.AABB; import org.jbox2d.collision.CircleDef;

  • CocosCreator通用框架设计之资源管理

    如果你想使用Cocos Creator制作一些规模稍大的游戏,那么资源管理是必须解决的问题,随着游戏的进行,你可能会发现游戏的内存占用只升不降,哪怕你当前只用到了极少的资源,并且有使用cc.loader.release来释放之前加载的资源,但之前使用过的大部分资源都会留在内存中!为什么会这样呢? cocos creator 资源管理存在的问题 资源管理主要解决3个问题,资源加载,资源查找(使用),资源释放.这里要讨论的主要是资源释放的问题,这个问题看上去非常简单,在Cocos2d-x中确实也很简

  • Unity使用物理引擎实现多旋翼无人机的模拟飞行

    内容简介 最近在用Unity实现无人机的模拟飞行,但发现站里基本没有完整介绍如何实现该功能的博客,因时间紧迫,就自己简单做了一个仿真(不是完全按照现实物理情景来做,即通过各个螺旋桨旋转产生力带动机体飞行).下面我会简述完全按现实物理情景实现模拟飞行,并详细描述我自己做的模拟飞行(不完全仿真),给各位提供参考. 现实物理情景的实现--简述(以四旋翼无人机为例) 因为我没有实现1:1仿真,所以这里只介绍思路,希望能给到读者一点启发. 构建一个四旋翼无人机模型(可以网上下载.或用Maya等建一个) 将

  • 解读CocosCreator源码之引擎启动与主循环

    前言 预备 不知道你有没有想过,假如把游戏世界比作一辆汽车,那么这辆"汽车"是如何启动,又是如何持续运转的呢? 如题,本文的内容主要为 Cocos Creator 引擎的启动流程和主循环. 而在主循环的内容中还会涉及到:组件的生命周期和计时器.缓动系统.动画系统和物理系统等... 本文会在宏观上为大家解读主循环与各个模块之间的关系,对于各个模块也会简单介绍,但不会深入到模块的具体实现. 因为如果把每个模块都"摸"一遍,那这篇文章怕是写不完了. Go! 希望大家看完这

  • 详解CocosCreator MVC架构

    概述 这一篇将介绍在游戏客户端常用的架构MVC架构.一个游戏的MVC如下划分: M:1)单例全局的数据中心World,所有游戏模块的数据在World中有入口,2)各个模块自己的数据结构. V:1)通过creator预制体制作的UI界面.场景,2)各个界面显示逻辑的ViewCtrl C:1)全局的MainCtrl,2)各个模块的业务逻辑类ModuleCtrl 具体模块 先介绍M部分.由于一个模块的数据,在其他模块也有访问的需求,例如好友模块,在聊天的时候也需要访问,在排行榜里需要访问.数据应该有一

  • 如何在CocosCreator中做一个List

    CocosCreator版本:2.3.4 cocos没有List组件,所以要自己写.从cocos的example项目中找到assets/case/02_ui/05_listView的demo来改造. 自写一个虚拟列表,有垂直布局,水平布局,网格布局和Padding的List Demo地址:https://files-cdn.cnblogs.com/files/gamedaybyday/cocos2.3.4_ListViewDemo_Grid.7z cocos原来的LayOut做列表,有100个数

  • 如何在CocosCreator里画个炫酷的雷达图

    前言 雷达图(Radar Chart) 也称为网络图.星图或蜘蛛网图. 是以从同一点开始的轴上表示的三个或更多个定量变量的二维图表的形式显示多元数据的图形方法. 适用于显示三个或更多的维度的变量. 雷达图常用于

  • 详解CocosCreator制作射击游戏

    场景布置 游戏资源 炮塔旋转 机制与之前手柄实例的小车相同,使用touchmove监听触摸事件, 获取触摸位置 通过位置用signAngle方法将该位置与cc.v2(1,0)位置的角度差求出(记得要加负号,比较所得逆时针为负,赋值angle逆指针为正). 所求的的角度即为最终角度. onLoad(){ //初始化为90度 this.node.angle=90; this.node.on('touchstart',this.onTouchStart,this); this.node.on('tou

  • 剖析CocosCreator新资源管理系统

    1.资源与构建 1.1 creator资源文件基础 在了解引擎如何解析.加载资源之前,我们先来了解一下这些资源文件(图片.Prefab.动画等)的规则,在creator项目目录下有几个与资源相关的目录: assets 所有资源的总目录,对应creator编辑器的资源管理器 library 本地资源库,预览项目时使用的目录 build 构建后的项目默认目录 在assets目录下,creator会为每个资源文件和目录生成一个同名的.meta文件,meta文件是一个json文件,记录了资源的版本.uu

随机推荐