cocosjs 不规则图形的判断(获取透明度)

cc.Sprite.prototype._pixels = []

cc.Sprite.prototype.readPixels = function(x, y){

  var w = this.width

  var h = this.height

  if(!this._pixels || this._pixels.length == 0){

//cc.newElement = function (x) {

 //   return document.createElement(x);

//};

    var canvas = cc.newElement('canvas') // 创建一个新的元素节点

    canvas.width = w

    canvas.height = h

    var ctx = canvas.getContext('2d') // 获得一个2d的画布(通过它就可以这个画布上的像素信息,我们只在上面绘制一张图片)

    ctx.drawImage(this.getTexture().getHtmlElementObj(), 0, 0) // 因此获得的像素信息也就等于是这个图片的像素信息

    this._pixels = ctx.getImageData(0, 0, w, h).data // 获得像素信息

  }

  var idx = (h - y) * w * 4 + x * 4 // 根据触摸坐标得到像素上的索引

  return [this._pixels[idx], this._pixels[idx + 1], this._pixels[idx + 2], this._pixels[idx + 3]] // 返回这个点上的的像素信息

}


//使用

if (cc.rectContainsPoint(targetObj, pos)) {

            var touchPoint = touch.getLocation()

            var locationInNode = target.convertToNodeSpace(touchPoint)

            var x = locationInNode.x

            var y = locationInNode.y

            var pexels = target.readPixels(Math.round(x), Math.round(y))

            cc.log(Math.round(x), Math.round(y))

            cc.log(pexels)

          return true

        }

参考https://blog.csdn.net/nzb329/article/details/52054252

https://blog.csdn.net/xiaofeiaiai/article/details/44080115

可以写在sprite的extend里

getPixels: function(x, y){

    this._pixels = []

    var w = this.width

    var h = this.height

    if(!this._pixels || this._pixels.length == 0){

      var canvas = cc.newElement('canvas') // 创建一个新的元素节点

      canvas.width = w

      canvas.height = h

      var ctx = canvas.getContext('2d') // 获得一个2d的画布(通过它就可以这个画布上的像素信息,我们只在上面绘制一张图片)

      ctx.drawImage(this.getTexture().getHtmlElementObj(), 0, 0) // 因此获得的像素信息也就等于是这个图片的像素信息</span>

      this._pixels = ctx.getImageData(0, 0, w, h).data // 获得像素信息

    }

    var idx = (h - y) * w * 4 + x * 4 // 根据触摸坐标得到像素上的索引

    return [this._pixels[idx], this._pixels[idx + 1], this._pixels[idx + 2], this._pixels[idx + 3]] // 返回这个点上的的像素信息

  },

// cocos2d-js 源码中获取颜色的代码

readPixels:function(x,y,w,h) {

        if( 'opengl' in cc.sys.capabilities) {

            var size = 4 * w * h;

            var array = new Uint8Array(size);

            gl.readPixels(x, y, w, h, gl.RGBA, gl.UNSIGNED_BYTE, array);

            return array;

        } else {

            // implement a canvas-html5 readpixels

            return cc._renderContext.getImageData(x, winSize.height-y-h, w, h).data;

        }

    },

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容