Sign in to follow this  
royibernthal

renderer.autoResize doesn't seem to work

Recommended Posts

I'd like the canvas to always be the same width and height as the viewport.

renderer.resize() works, but renderer.autoResize doesn't seem to do anything.

 

The code is taken from here:

https://github.com/kittykatattack/learningPixi#renderer

 

As you can see I'm using PIXI.Application instead of manually initializing the stage and renderer, in case that matters.

var app = new PIXI.Application(800, 600, { antialias: true });

app.renderer.view.style.position = 'absolute';
app.renderer.view.style.display = 'block';
app.renderer.autoResize = true;
app.renderer.resize(window.innerWidth, window.innerHeight);

Share this post


Link to post
Share on other sites

So it only changes when calling resize()...

Listening to window resize and calling renderer.resize() solves it. Out of curiosity, is there a built in way to do it?

 

On a slightly different subject, do the width and height I pass to PIXI.Application constructor matter if I resize the renderer afterwards or are they entirely overridden?

 

EDIT: What I wrote actually doesn't solve what I'm trying to do, I'd like the stage to be resized along with the canvas, not the canvas to display a part of the stage at canvas size.

It seems that I get the result when the canvas width and height remains the same and I change only the width and height in its style attribute, but I'm not sure it's the correct way to approach it.

 

Original

original.thumb.png.c1e25f621ca55050116c37caaec74ffe.png

 

Canvas element width and height different than style width and height (desired result)

different.thumb.png.9b7a41c4f0e7c0b94f250c2b44af3738.png

 

Canvas element width and height same as style width and height

same.thumb.png.939650fbfe6dc69b30578b2f5acaffe6.png

Share this post


Link to post
Share on other sites
59 minutes ago, royibernthal said:

So it only changes when calling resize()...

Listening to window resize and calling renderer.resize() solves it. Out of curiosity, is there a built in way to do it?

 

On a slightly different subject, do the width and height I pass to PIXI.Application constructor matter if I resize the renderer afterwards or are they entirely overridden?

 

EDIT: What I wrote actually doesn't solve what I'm trying to do, I'd like the stage to be resized along with the canvas, not the canvas to display a part of the stage at canvas size.

It seems that I get the result when the canvas width and height remains the same and I change only the width and height in its style attribute, but I'm not sure it's the correct way to approach it.

 

Original

 

Canvas element width and height different than style width and height (desired result)

 

 

Canvas element width and height same as style width and height

 

If your objects are in a container you could resize the container after resizing the renderer?

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.