How i can check hit test to shape?

Questions
1

I get that massage:
hitTestBounds():
please setBounds() on both objects

2

yourObj.setBounds(0, 0 , 250 , 250);

3

[ZIM NOTE]
Ferudun, all this can be done quite easy in ZIM - like new Rectangle(w,h) instead of all that raw shape drawing. A container can be given bounds with new Container(w,h). If it needs a hitArea new Container(w,h).expand(0) will apply a CreateJS hitArea to the size of the container.
[END ZIM NOTE]

You can use this function for trial purposes. I found it somewhere too.

setCollision(yourObject, 0, 30 , 80 , 60)

var debugCollision= true;	

function setCollision(_container , _x , _y , _w , _h){		
	if (debugCollision){
	var g = new createjs.Graphics().beginFill("#66FF00").drawRect(_x, _y , _w , _h);
	var shape= new createjs.Shape(g)
		shape.alpha=.2
	_container.addChild(shape);
	}
	_container.setBounds(_x , _y , _w , _h);
	shape.alpha=.2
}
4

If you set setBounds to the desired position after testing, you will not run the trial function.

5

Thanks!
I need that for free shape and need check the hit test for that shape.
not rectangle or circle only.
if I set bounds that check the hitTest for the rect
or only for the draw area?

6

As far as I know, this example is only valid for rectangular shape. I don't know if createjs and zimjs have a hitTest feature for very complex shapes.

You need to consult @abstract. Maybe there is a method for complex shapes.

Also, if you use zim.Shape(), there may be no need to set setBounds. I am not sure.

7

I did a complex shape hitting a simple shape. Here was a sample I made for Karel back in the day. The key was to test the complex shape against the simple shape. If I remember correctly it had issues the other way around.

Don't forget about obj.hitTestPath(other, num, showPoints, returnPoints). This came out after my example, I think.

8

BACKGROUND
ZIM Shape() and CreateJS Shape() do not have bounds set - unless you pass in width and height for the Shape(w,h) in ZIM. CreateJS gives us one hitTest() - that is the same as hitTestPoint() in ZIM except the CreateJS hitTest() does not care about bounds and that is BAD!

BOUNDS
All of the ZIM hitTests check to see if the bounds are hitting before it tries any complex hitTests. This is much faster for many objects.

POINTS
The ZIM hitTestPoint() - the same as the CreateJS hitTest() - tests a point against any shape - in other words, the pixels of a shape or bitmap that are not alpha 0. So we can check if a point is hitting the pixels of weird shaped object - but this is a slower process than a mathematical equation like a bounds check. hitTestReg() is like hitTestPoint() but the point is the registration of the first object.

SHAPES
Hit tests on two weird shapes is not available. The closest would be hitTestPath() where you can recreate one of the weird shapes with a ZIM Blob and overlay it on your weird shape. This will test the points along the blob to see if one is hitting the pixels of the OTHER weird shape. It does a bounds test first.

OTHER POINT HIT TESTS
The hitTestRect() and hitTestCircle() also put points around their shapes and see if one is hitting the pixels of the OTHER weird shape. They do a bounds test first too. These two are slightly slower than the hitTests listed below:

FAST HIT TESTS
These are all equations so are the fastest:
hitTestBounds() - for two rectangular shapes
hitTestCircles() - for two circular shapes (based on an oval in the bounds)
hitTestCircleRect() - for a circle and rect shape
hitTestGrid() - check a grid for a hit - like pixel drawing

DIFFERENCE
There is a technique to turn the two weird shapes into a single color - the same color for both. Then take a difference and see if black shows up. If it does then there is an overlap. I used that technique back in Flash a few times - have not tried it in ZIM.

3 Likes
9

Thanks!

I add the shape to bitmap and then use hitTest of createjs and that work only on the shows Only on the painted pixels.
That can work with Zim hitTest?

10

Yes. hitTestPoint() is the same as hitTest() but it is recommended that you add the bounds to the Shape() so the hitTest is faster. You do that by specifying the width and height new Shape(w, h). Or you can turn the bounds test off in the hitTestPoints parameter hitTestPoint(x,y,false)

image