修改 skew 之后,按钮触发范围 bug

我有两个 sprite button node

分别带有 sprite 和 button 组件如下

左边是未调整过 skew 的
右边是设定 skew x 为 20

可以看到右边 鼠标在未进入 sprite 时就触发了 hover 效果
这应是个 bug 吧

目前 hitTest 用的是 bounding box,后面如果支持像素级检测,这个问题就可以修复。

hitTest 目前是基于 bounding box 检测,无法做像素级检测,一是技术难度比较大,二是损耗太高,不适合集成在基础的 hitTest 中。

不过你可以自己定制一下,

node._hitTest = function (point, listener) {
    // check logic, return true for point in object, return false for point outside
}

这里声明一下,这个不是 bug,基础的 hitTest 设计就是这样,我们不可能把像素级检测作为最基础的 hitTest,引擎性能完全吃不消

1赞

我认为这是bug。
skew 变换时,bounding box 也同时进行变换。所以hitTest 应该可以获得正确的响应区域。

这里有实例:
//坐标变换:
https://github.com/shakiba/stage.js/blob/master/lib/matrix.js
//鼠标事件:
https://github.com/shakiba/stage.js/blob/master/lib/addon/mouse.js

你可以看一下我们的 hitTest 实现:

https://github.com/cocos-creator/engine/blob/master/cocos2d/core/CCNode.js#L1269

可以看到我们的确按照 transform(包含 skew 信息)来获取 boundingBox 了,但是在比较的过程中,是按照 left, right, bottom, top 有没有越界来去检测的,这样最高效