Scale and InteractionManager

Recommended Posts

Hey guys, is there any know weirdness with 'scale' property of a DisplayObject, and InteractionmManager?


I'm targeting canvas renderer only - no WebGL rendering here.


My resize handler does the following:


- scales the stage based on the new width and height (thought this seems to have no effect on any child DisplayObjects!?):

var sx:number = w / this.config.stageW ;
var sy:number = h / this.config.stageH ;
stage.scale.x = sx;
stage.scale.y = sy;

- resizes the renderer: 


renderer.resize( w, h ) ;


- because stage scale seems not to function as I'd expect, I try propagating the scale into my current view object


this.scale.x = sx ;
this.scale.y = sy;
- This latter step correctly sizes the view, but my interactive objects are now screwed because the hitTest no longer appears to work (functional hit area is no longer coupled to where the scaled object appears to be)...
Am I missing something obvious?



Share this post

Link to post
Share on other sites

Hi there!


The stage cannot be scaled as its the root object. The best thing to do is to add all of your content into a displayObjectContainer then you can then scale that. Something like this:

var gameContainer = new PIXI.DisplayObjectContainer();//add content to game container..stage.addChild(gameContainer)onResize = function(){   gameContainer.scale.x = newXScale;   gameContainer.scale.y = newYScale;} 

Hope that helps!

Share this post

Link to post
Share on other sites

I'm now using a root container object, which is a simple solution to to stage scalability (I was misled by 'stage' inheriting from DisplayObjectContainer, which obviously exposes a 'scale' property which does nowt!). Interaction still seems borked though for scaled objects though - mayhaps this is a bug?

Share this post

Link to post
Share on other sites

Yeah, my bad on that. I think I will set the scale properties of stage so that it will let the users know that scale will not be applied. With regards to the interactionManager, it should work out of the box with scaled objects. Would you mind sharing you code so I can take a peek at what might be going wrong?



Share this post

Link to post
Share on other sites

It looks like it does indeed work out of the box - it's my own implementation that is causing issues: I'm working on it now, but it would appear that my having nested interactibles may be the cause...


I have a 'scene view' object, which is interactive [setInteractive(true)], and manages some functionality on touchstart, touchmove and touchend (it's a drawing application). This scene view contains a number of buttons, which are also interactive [setInteractive(true)] - the location of the hitareas on these buttons is way off. If I don't make the scene view interactive, my buttons are fine.


I have a workaround (yet to implement it), which is to simply create a DisplayObject 'touch zone' to handle my drawing events, rather than utilising the container view.

Share this post

Link to post
Share on other sites

Yeah that 'workaround' totally owned it. I'm now simply using a relevant background image (Sprite) as the touch recipient.


Lesson learned: don't use an abstract container as a touch recipient - make a dedicated view instead!


I'm truly surfing with PIXI now, thanks kindly Mat, and keep up the ace work :D

Share this post

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    No registered users viewing this page.