pixi-viewport

pixi-viewport copied to clipboard

I am trying to get the pixi-viewport to resize automatically following a window resize event.

The problem is that after resizing, the user needs to drag on the page for the viewport to get updated. I would like this to happen automatically instead.

// Listen for window resize events
window.addEventListener('resize', this.onResize);

// Resize handler
onResize = () => {

    // Resize the pixi app's renderer
    this.pixiApp.renderer.resize(
        window.innerWidth,
        window.innerHeight
    );

    // Resize the pixi viewport
    this.pixiViewport.resize(
        window.innerWidth,
        window.innerHeight,
        this.pixiViewport.worldWidth,
        this.pixiViewport.worldHeight,
    );

    // Update the pixi viewport
    this.pixiViewport.update();
}

You shouldn't need the viewport.update() command. The viewport.resize() command should resize and on the next draw everything should be correct. Seeing as you're using pixi.application that should happen on every frame. Check that the resize is being called properly after an event.