Graphics and Interactivity

[Seby]

Hi,

 

I think i've found a new mini bug 

 

This code doesn't work :

 

	var graphics = new PIXI.Graphics();	 	graphics.beginFill(0xFFFF00);	 	// set the line style to have a width of 5 and set the color to red	graphics.lineStyle(5, 0xFF0000);	 	// draw a rectangle	graphics.drawRect(100, 150, 50, 50);			// make the button interactive..			graphics.setInteractive(true);			graphics.click = function(data){		console.log('hit rect');	}

 

But this... work correctly 

 

	var graphics = new PIXI.Sprite(textureButton);	 	graphics.position.x = 100;	graphics.position.y = 100;	// make the button interactive..			graphics.setInteractive(true);			graphics.click = function(data){		console.log('hit rect');	}

 

[enpu]

Yeah you have to define hitArea manually for PIXI.Graphics

 

graphics.hitArea = new PIXI.Rectangle(100, 150, 50, 50);

[Seby]

Oh yeah   Thanks Enpu 

[poshaughnessy]

Thanks for this! Just to add, in case it saves anyone a minute or two of confusion, nowadays you do:

graphics.interactive = true;

Instead of:

graphics.setInteractive(true);

[JDW]

Small but useful trick to set hitArea for rectangle graphics :

graphics.hitArea = graphics.getBounds();