Pixi.js: PIXI.Application need to been resizeable when window resize

[Cpin0312]

i have try to make Application been smaller when window size was change
Like
app.ticker.add(function() {
app.renderer.autoResize = true;
app.renderer.resize(window.innerWidth,window.innerHeight )
app.stage.scale.x = (window.innerWidth,* x);
app.stage.scale.y = (window.innerHeight * y);
}

example like this
http://pixijs.io/examples/#/basics/render-texture.js
when you resize a window, canvas is able to become smaller automatic.

Can i have some simple way to make a same effect?Either i need to ask in other places?

[bigtimebuddy]

Here are some examples for doing resize.
https://github.com/pixijs/pixi.js/wiki/v4-Tips,-Tricks,-and-Pitfalls#resizing-renderer

You need to handle the scale stuff in the resize handler for the window function not with ticker.

Hope that helps.

[Cpin0312]

@bigtimebuddy

Thanks!!!
i would close this Topic

[ghost]

to center view:

function resize() {
    if (window.innerWidth / window.innerHeight >= ratio) {
            ancho = ~~(window.innerHeight * ratio);
            alto= window.innerHeight;

            app.view.style.position = 'absolute';
            app.view.style.width = ancho + 'px';
            app.view.style.height = alto + 'px';
            //console.log("A");

            app.view.style.left = ~~((window.innerWidth-ancho)/2) + 'px';
            app.view.style.top = '0px';

    } else {

            ancho = window.innerWidth;
            alto = ~~(window.innerWidth / ratio);

            app.view.style.position = 'absolute';
            app.view.style.width = ancho + 'px';
            app.view.style.height = alto + 'px';
            //console.log("B");
            app.view.style.left = 0 + 'px';
            app.view.style.top = (window.innerWidth-(alto/2)) + 'px';

    }
    //console.log(ancho,alto);


}
window.onresize = function(event) {
    resize();
};

[replaysMike]

@gilberto389 while your suggestion works, text will scale badly because it is relying on canvas resizing.

[WatchaGames]

@ghost thanks for the example.
Typo:
app.view.style.top = (window.innerWidth-(alto/2)) + 'px';
should be:
app.view.style.top = (window.innerHeight-(alto/2)) + 'px';