Jump to content

Get dimension of masked content


andreas_d
 Share

Recommended Posts

Hi guys,

// image is 500x500var bg = new PIXI.Sprite.fromImage(image) container.addChild(bg);// mask is 200x200bg.mask = container.addChild(new PIXI.Graphics().beginFill().drawRect(0,0,200,200).endFill()) container.width // is 500container.height // is 500

Is there a built in way to get the width and height of container taking the mask into account?

 

Does anyone know of a good practice in this situation?

 

 

Link to comment
Share on other sites

The mask isn't technically drawn in the container, since it is a mask; so it isn't included in the size.

 

I would avoid adding masks to the scene as they will not do what you expect. Also, the mask doesn't change the object's size it just hides some pixels. The size we report is still based on the object, not the finally drawn image.

Link to comment
Share on other sites

Hi xerver ... again

 

I've had weird results with that actually.  Taking the above example, if I don't add the mask as a child, it doesn't scale if the parent container has it's dimensions changed.

 

for example: 

// image is 500x500var bg = new PIXI.Sprite.fromImage(image) container.addChild(bg);// mask is 200x200var mask = new PIXI.Graphics().beginFill().drawRect(0,0,200,200).endFill()) // after scaling mask is 100x100//bg.mask = container.addChild(mask)// after scaling mask remains 200x200  bg.mask = mask container.scale = new PIXI.Point(0.5, 0.5);

Also on a another note using container.width=200 in the above example causes an error in which the image gets distorted (width doesn't change and image becomes ver stretched on the x axis)

 

Thanks for your help ... once again

 

Andreas

Link to comment
Share on other sites

Taking the above example, if I don't add the mask as a child, it doesn't scale if the parent container has it's dimensions changed.

 

Yeah that is true :P we actually have an open bug for it: https://github.com/pixijs/pixi.js/issues/1978

 

Also on a another note using container.width=200 in the above example causes an error in which the image gets distorted (width doesn't change and image becomes ver stretched on the x axis)

 

Setting the width/height of an object directly modifies the scale of the object to force it to those dimensions.

Link to comment
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.

Guest
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.

Loading...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...