I tried to create a function that when you pressed on one of my images it would change colors, it worked except that you were able to click the transparent part of the image and it still worked, is there any way to exclude all transparency from the image? If not, is there anyway to set the x and y of a widget, because all my objects are precisely placed and I cannot afford to move them all around again according to top and left.
Hi @dayaffe99,
So you’re using widgets (2.0) and these images are buttons (widget.newButton)? This could be a bit tricky, because on the surface, they’re not designed to accept masks (which would be one way to disallow tap response on the outlying transparent regions of the image file). You can try to build this into the widget source (since it has been open-sourced), but I’m not sure how advanced that would be.
Maybe a better way would be to define a custom “touch range” for each image. For example, if the image “canvas” is 100x100, but the touchable region should be a rectangle of 80x40, you could use those values to filter out if a touch is allowed or discarded, based on the touch position in relation to the image’s core x/y position. In other words, in the touch event handler, you look up where the touch occurred on content space, compare that with the custom defined touch range in content space, and then either process that touch as allowed, or discard it and return true.
Does that help somewhat?
Brent
if you are not using widgets but just a image with a touch event then you can add a mask to the image which is the same as the transparent bit and use the object.isHitTestMasked = true. This will then make it so only the visible parts are receiving touches.
tutorial about masks:
http://www.coronalabs.com/blog/2012/05/29/how-to-use-bitmap-masks/
Thank you borgb, that is what I am looking for, I will try it out!
Hi @dayaffe99,
So you’re using widgets (2.0) and these images are buttons (widget.newButton)? This could be a bit tricky, because on the surface, they’re not designed to accept masks (which would be one way to disallow tap response on the outlying transparent regions of the image file). You can try to build this into the widget source (since it has been open-sourced), but I’m not sure how advanced that would be.
Maybe a better way would be to define a custom “touch range” for each image. For example, if the image “canvas” is 100x100, but the touchable region should be a rectangle of 80x40, you could use those values to filter out if a touch is allowed or discarded, based on the touch position in relation to the image’s core x/y position. In other words, in the touch event handler, you look up where the touch occurred on content space, compare that with the custom defined touch range in content space, and then either process that touch as allowed, or discard it and return true.
Does that help somewhat?
Brent
if you are not using widgets but just a image with a touch event then you can add a mask to the image which is the same as the transparent bit and use the object.isHitTestMasked = true. This will then make it so only the visible parts are receiving touches.
tutorial about masks:
http://www.coronalabs.com/blog/2012/05/29/how-to-use-bitmap-masks/
Thank you borgb, that is what I am looking for, I will try it out!