Spine深入学习 —— 换装

Spine深入学习————换装

数据对象和实例对象的关系与区别

数据对象是无状态的,可在任意数量的骨架实例间共用。有对应实例数据的数据对象类名称以“Data”结尾,没有对应实例数据的数据对象则没有后缀,如附件、皮肤及动画。

实例对象有许多属性与数据对象相同。数据对象中的属性代表装配姿势,通常不会改动。实例对象中的相同属性表示播放动画时该实例的当前姿势。每个实例对象保有一个其数据对象参考,用于将实例对象重置回装配姿势。

例如,SkeletonData是数据对象,而Skeleton是实例对象。同样的,Bone实例对象会有对应的BoneData,Slot实例对象会有对应的SlotData等。

整体渲染流程

在这里插入图片描述
在这里插入图片描述

思路

参考:https://segmentfault.com/a/1190000040116516?utm_source=sf-similar-article

每次插槽渲染的时候,都会根据当前slot的attachmentName,去当前skin中获取到对应的附件。

skin是附件查询的映射表,因此只需要到当前的skin中,,去更新对应的附件,即可以实现换装功能

下图来自厘米秀的思路

在这里插入图片描述

slot1来源于slotData1,初始化的时候会读取slotData1中的attachmentName,去skin.attachments中查找对应的附件实例,这里每一项的index都是一一对应的,skin.attachments数组中的第一项对应slotData1,检索到对应的附件实例后赋值给对应的slot实例,等待被渲染层渲染。

需要更新的是slot中的对应附件,而附件检索来自于skin,因此我们实际上需要更新的是skin上对应的附件查询表,将对应层级的附件实例更新为新的装扮生成的实例

如何生成对应的消费素材资源,生成对应的附件实例,skeletonJson是spine核心库定义的用于解析JSON的解析器,生成对应的skeletonData,这一过程中就包括构造skin。

那么思路就可以是定义loader加载素材资源,处理成对应的资源格式,经过textureAtlas的处理,构造出AtlasAttachmentLoader给skeletonJson调用,有了loader,提供json,这时候skeletonJson便可以解析后构造出对应的附件。

那么流程如下:

  1. 自定义loader加载素材资源,处理成对应的资源格式给下层消费;
  2. 构造AtlasAttachmentLoader给skeletonJson调用;
  3. 扩展skeletonJson底层原型链方法,生成附件实例,将新的附件实例更新到当前skin对应的层级位置上。

局部换装

局部换装——附件换装

spine附件换装则是指在spine工程内针对某一部位插槽SlotA创建皮肤(记为SkinPart)并记录皮肤占位符,运行时通过查询局部皮肤SkinPart中的附件(记为attachmentPart),使用局部皮肤对应位置的附件attachmentPart替换全身皮肤中SlotA下的附件(attachmentFull)

/*** @param skinName 要替换的部件皮肤名称* @param slotName 要替换的部件的插槽名称* @param targetAttaName  Spine中皮肤占位符的名字*/
changeSlot(skinName: string, slotName: string, targetAttaName: string) {//查找局部皮肤let skeletonData = this.role.skeletonData.getRuntimeData();let targetSkin: sp.spine.Skin = skeletonData.findSkin(skinName);//查找局部皮肤下的插槽与附件let targetSkinSlotIndex = skeletonData.findSlotIndex(slotName);let atta = targetSkin.getAttachment(targetSkinSlotIndex, targetAttaName);//查找全身皮肤下的插槽let curSlot = this.role.findSlot(slotName);//替换全身皮肤插槽的附件curSlot && curSlot.setAttachment(atta);
}
局部换装——外部贴图

局部换装——外部贴图,顾名思义,就是不使用spine导出图集中贴图,而是使用cocos creator的texture资源进行局部换装。当前一个部位使用的图片和将要换上去的图片都没有蒙皮变形,或者两张图片可以使用同一个蒙皮,就可以直接使用外部图片进行换装。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/232072.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

大数据Hadoop-HDFS_元数据持久化

大数据Hadoop-HDFS_元数据持久化 (1)在HDFS第一次格式化后,NameNode(即图中的主NameNode)就会生成fsimage和editslog两个文件; (2)备用NameNode(即图中的备NameNode&…

什么是供应链攻击?

随着企业越来越依赖技术、连接性和第三方,供应链攻击变得越来越普遍。这些攻击旨在通过供应商和业务合作伙伴损害公司。 供应链攻击可能对企业和组织构成重大威胁,损害其安全以及向客户提供的产品和服务的安全。 在本文中,我们将探讨供应链…

java学习part23异常try catch

124-异常处理-异常的概述与常见异常的举例_哔哩哔哩_bilibili 1.异常 2.try catch 3.finally 类似golang的defer 一定执行的语句

数据结构 -- 图论之最小生成树

目录 1.最小生成树算法 1.Kruskal算法 2.Prim算法 1.最小生成树算法 定义:最小生成树算法:连通图有n个顶点组成,那么此时的图的每一个点都能相互连接并且边的个数为n-1条,那么此时该图就是最小生成树. 下面量算法有几个共同的特点: 1.只能使用图中权值最小的边来构造生成树 …

Javaweb之Vue组件库Element案例的详细解析

4.4 案例 4.4.1 案例需求 参考 资料/页面原型/tlias智能学习辅助系统/首页.html 文件,浏览器打开,点击页面中的左侧栏的员工管理,如下所示: 需求说明: 制作类似格式的页面 即上面是标题,左侧栏是导航&…

单片机----串行通信

目录 串行通信的两种方式 串行通信的传输模式 串行通信的错误校验 1.奇偶校验 2.代码和校验 3.循环冗余码校验 串行口结构 串行口控制寄存器SCON 特殊功能寄存器PCON 串行口的4种工作方式 方式0: (1)方式0的发送过程 &#xff0…

【Flutter】graphic图表实现tooltip一段时间后自动隐藏

概述 graphic图表中提供了自定义tooltip的事件,可通过selections中on和clear配置手势选项和可识别设备,默认情况下tooltip需要双击隐藏,但这并不符合我们的需求。通过调研发现,若想实现tooltip隔几秒后隐藏,可通过Str…

【刷题】树的遍历

层序遍历 层序遍历需要用到广度有限搜索,也就是需要队列 1.将根节点加入队列、 2.如果队列不为空,就得到队列的长度,对队列中现有的元素进行访问并从队列中删除,并将其子节点加入到队列中 102. 二叉树的层序遍历 给你二叉树的根…

算法基础之字符串哈希

字符串哈希 核心思想&#xff1a;用p(131或者13331)进制数储存字符串每一位数的hash值 L—R的哈希值 h[R]-h[L-1]*PR-L1 哈希值很大—>modQ(264)变小 用unsigned long long 存 (出界) #include<iostream>using namespace std;typedef unsigned long long ULL;co…

iOS--UIPickerView学习

UIPickerView 使用场景和功能UIPickerView遵循代理协议和数据源协议创建对象&#xff0c;添加代理必须实现的代理方法非必要实现的方法demo用到的其他函数提示 效果展示 使用场景和功能 UIPickerView 最常见的用途是作为选项选择器&#xff0c;允许用户从多个选项中选择一个。…

安全技术与防火墙

目录 安全技术 防火墙 按保护范围划分: 按实现方式划分: 按网络协议划分. 数据包 四表五链 规则链 默认包括5种规则链 规则表 默认包括4个规则表 四表 查询 格式&#xff1a; 规则 面试题 NFS常见故障解决方法 安全技术 入侵检测系统 (Intrusion Detection Sy…

【古月居《ros入门21讲》学习笔记】17_launch启动文件的使用方法

目录 说明&#xff1a; 1. launch文件作用 2. launch文件语法 根元素 参数设置 重映射、嵌套 3. 示例 创建功能包 1_simple.launch 编译 运行 2_turtlesim_parameter_config.launch 启动运行 启动运行显示说明 3_start_tf_demo_c.launch 启动运行 4_start_tf_d…