Sign in to follow this  
caymanbruce

Stage and DisplayObjects resize to fit the screen

Recommended Posts

How can I resize DisplayObjects on my screen when I resize the window? This is a very common requirement but I can't find tutorial bout this. For example, when I press F11 to make the window fullscreen, the stage and all displayObjects in the stage should adjust its size to fit the screen. When I drag the browser edge to resize the window the objects should also resize to fit the screen. How to achieve this?

I have this code now, but it doesn't work very well because the ratio doesn't seem quite right.

window.addEventListener('resize', resize);

function resize(event) {
    const w = window.innerWidth;
    const h = window.innerHeight;
    let ratio = Math.min( w / GAME_WIDTH, h / GAME_HEIGHT);
    stage.scale.x = stage.scale.y = ratio;
    renderer.resize(Math.ceil(GAME_WIDTH * ratio), Math.ceil(GAME_HEIGHT * ratio));
};

Share this post


Link to post
Share on other sites
6 minutes ago, themoonrat said:

 

I guess I am the unlucky one. This code doesn't work as I expected when I write

window.addEventListener('resize', resize);

function resize(event) {
    scaleScene(renderer, stage);
};

When I switch to full screen mode my stage doesn't expand to full screen, it only adds edges to top and bottom.

Share this post


Link to post
Share on other sites

How are you going 'full screen'? You may need to add a listener to force a resize on the window after it has gone full screen? I have also in the past added a small delay so that the resize of pixi happens, say, 50ms after the window has resized to give browsers time to return accurate measurements.

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.