laya的skeleton骨骼动画事件响应问题
创建skeleton节点并绑定MOUSE_DOWN事件后,却始终无法响应。经测试发现如下:
skeleton节点在load结束后,其bounds反映了总体的宽高,但是width与height却为0,而sprite(skeleton继承自sprite)却是以width与height来作为事件响应区域的。而单纯的sprite结点是没有这个问题的。因此将bounds.width与bounds.height重新赋值给skeleton节点,但是又出现了新的问题。
调用nodeSkeleton.graphics.drawRect(0, 0, bounds.width, bounds.height, "#ff00ee"),绘制显示区域可以看到,Rect的左上角位置为(bounds.width/2, bounds.height),即在人物脚下中心线的位置。打开dragonbones编辑器,载入对应的动画,发现人物的root节点正是在脚下中心线的位置。也就是说,skeleton节点的动画区域是按照动画编辑器来设定的,与其Laya中的响应区域有很大的偏移。
为了解决这个问题,创建了一个父节点proxy来响应事件:
var node = new Laya.Skeleton();
var proxy = new Laya.Sprite();
proxy.addChild(node);
node.load(SkeletonConfigs["NuTao"], Laya.Handler.create(this, function() {
var bound = node.getBounds(); // 加载完毕之后才能拿到有效的bounds
var W = bound.width, H = bound.height;
node.width = W; // 若不设置的话, node.width与node.height均为0
node.height = H;
node.pos(W/2, H); // 骨骼节点偏移(W/2,H),使动画区域的左上角与proxy节点的位置(左上角)重合 proxy.width = W;
proxy.height = H;
proxy.graphics.drawRect(0, 0, proxy.width, proxy.height, "#ff00ffee");
proxy.on(Laya.Event.MOUSE_DOWN, this, function() {
console.log("MouseDown Event");
});
}));
laya的skeleton骨骼动画事件响应问题的更多相关文章
- cocos creator 动画编辑器以及骨骼动画的使用
一.普通动画的设置 1.添加动画组件 a.添加空节点=>添加动画组件 b.新建Clip文件=>打开编辑模式添加动画编辑(并且把添加的clip文件拖动到右边面板的Default Clip 与 ...
- Android设备 cocos2dx 骨骼动画注册事件播放音效,退到后台再返回黑屏问题
最近遇到一个cocos2dx 骨骼动画注册事件播放音效,在骨骼动画播放的时候,按HOME键退到桌面,再次打开游戏的时候,会黑屏. 解决办法如下,可能不是太完美,至少解决了大部分问题. 1.在org.c ...
- Spine Skeleton Animation(2D骨骼动画)
骨骼动画 首先我们来看到底什么是骨骼动画: 在早期的机器上,渲染本身已经占用了很多CPU资源,因此,对于渲染,往往采取的是一种空间换时间的策略,以避免在模型的渲染中继续加重CPU的负担.帧动画模型在这 ...
- DragonBones龙骨骨骼中的自定义事件(另有声音、动画事件)
参考: DragonBones骨骼动画事件系统详解 一.在DragonBones中添加自定义事件帧 动画制作时 时间轴拉到最下面有一个事件层,添加一个事件帧 左边属性面板定义自定义事件 二.Egret ...
- Skeleton with Assimp 骨骼动画解析
Skeleton with Assimp 骨骼动画解析 骨骼动画是图形学中十分常见应用很广泛的一个技术,也是比较基础的内容,作为图形学的工程师需要将这一部分内容梳理清晰,主要关键在于几点:第一,分清楚 ...
- 基于babylon3D模型研究3D骨骼动画(1)
3D骨骼动画是实现较为复杂3D场景的重要技术,Babylon.js引擎内置了对骨骼动画的支持,但Babylon.js使用的骨骼动画的模型多是从3DsMax.Blender等3D建模工具转换而来,骨骼动 ...
- 基于Babylon.js编写简单的骨骼动画生成器
使用骨骼动画技术可以将网格的顶点分配给若干骨头,通过给骨头设定关键帧和父子关系,可以赋予网格高度动态并具有传递性的变形 效果.这里结合之前的相关研究在网页端使用JavaScript实现了一个简单的骨骼 ...
- spine骨骼动画组件使用详解
1. spine骨骼动画工具 骨骼动画: 把动画打散, 通过工具,调骨骼的运动等来形成动画spine是一个非常流行的2D骨骼动画制作工具spine 动画美术人员导出3个文件: (1) .png文 ...
- cocos2dx骨骼动画Armature源码分析(二)
flash中数据与xml中数据关系 上篇博文从总体上介绍了cocos2dx自带的骨骼动画,这篇介绍一下导出的配置数据各个字段的含义(也解释了DragonBone导出的xml数据每个字段的含义). sk ...
随机推荐
- msp430项目编程54
msp430综合项目---扩展项目四54 1.电路工作原理 2.代码(显示部分) 3.代码(功能实现) 4.项目总结
- pyquery操作
pyquery和我们之前用的jQuery有着异曲同工之处,使用起来更加方便,基本能满足大部分时候我们的需求. 先引入一个小事例展示pyquery的操作: html = ''' <div> ...
- 【转】UITableViewCell自适应高度 UILabel自适应高度和自动换行
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath { ...
- Laravel 之Artisan
简介: Artisan是Laravel中自带的命令行工具的名称: 由强大的Symfony Console组件驱动的: 提供了一些对应用开发有帮助的命令: 查看所有可用的Artisan的命令 php a ...
- 三国武将查询系统 //Java 访问 数据库
import java.awt.*; import javax.swing.*; import java.awt.event.ActionListener; import java.awt.event ...
- Java并发编程,深入理解ReentrantLock
ReentrantLock简介 ReentrantLock重入锁,是实现Lock接口的一个类,也是在实际编程中使用频率很高的一个锁, 支持重入性,表示能够对共享资源能够重复加锁,即当前线程获取该锁再次 ...
- android 获得屏幕状态
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools= ...
- 切换横屏幕 onCreate 多次执行问题
在AndroidManifest.xml 中activity 中添加 android:configChanges="orientation|screenSize|smallestScreen ...
- BUPT复试专题—哈夫曼编码(2009)
题目描述 哈夫曼编码中 平均码长=码长×码字出现的概率 如:ABCDE 五个字符的出现次数分别为50 20 5 10 15 那么,其哈夫曼编码为A:0 B:10 C:1110 D:111 ...
- 锤子Smartisan T1手机官方4.4.2系统内核版本号信息
从锤子smartisan T1手机官方系统EGL中获取内核版本号信息(由cofface提供): I/Adreno-EGL( 816): <qeglDrvAPI_eglInitialize:41 ...