不规则图片按钮的点击判断插件[纯js实现]

公司有一H5项目中包含一个娱乐城,其中下注区域是非规则的图片,例如扇形。
在native下可以使用C++中的API进行判断点击,但web上没有这个API。
那么就做一个咯:https://github.com/zhangkailin/ShapeTouch

API:
king.shape.touch(src,x,y,callback)
king.shape.touchPoint(src,point,callback)

返回值:
Object {touch: true, alpha: 255} Or Object {touch: false, alpha: 0}

使用
Cocos creator:将文件放入assets即可,不需require
this.node.on(‘touchend’, function (event) {
var touchPoint = event.getLocation();
var node = event.currentTarget;
var nodePoint = node.convertToNodeSpace(touchPoint);
var nodeSrc = node.getComponent(cc.Sprite).spriteFrame.getTexture().url;
king.shape.touchPoint(nodeSrc,nodePoint,function(result){
console.log(result);
});
}, this);

Cocos JS中只需要加载该JS文件即可

注意:该脚本只在web有效,打包成APP时请注意判断当前平台,在native下使用C++的API

4赞

感谢大神分享,已收藏,要用的时候再来看:watermelon:

请问android和ios平台适合吗?

我现在用起来好像不行, img.src = src;这里赋值能正常吗,图片资源不是已经打包、合图进项目了,给图片路径来赋值是拿不到的吧