search

davidfig / pixi-viewport

A highly configurable viewport/2D camera designed to work with pixi.js
https://davidfig.github.io/pixi-viewport/
MIT License
1.04k stars 174 forks source link

Issue with resizing, dragging not registering #456

Open wighawag opened 1 year ago

wighawag commented 1 year ago

Repo that reproduce the issue : https://github.com/bug-reproduction/pixi-viewport-test

When resizing the window from small to big, dragging does not register in some places, see readme : https://github.com/bug-reproduction/pixi-viewport-test#readme

blnvdanil commented 1 year ago

I guess that you should call resize method on viewport after each resize of your canvas, you can use resize-observer for instance. Here you can see that viewport updates its hitArea, which depends on screenWidth

https://github.com/davidfig/pixi-viewport/blob/5bb2ee708eb41b7766076c1ebcceb8ad47c7ba2b/src/Viewport.ts#L303

wighawag commented 1 year ago

Hi @blnvdanil thanks for your comment. This is indeed how I currently get around the issue. I listen for resize event and call resize on the viewport.

But I expected this to be handled automatically. Is that the expected behavior @davidfig ?

blnvdanil commented 1 year ago

@wighawag I think it's not, because you may want to have several viewports on the screen, and in that case that is not possible to guess the way you would like to change the size of those viewports on resize of the page

At least some configuration options should be available, but there are no such options as far as I can say

blnvdanil commented 1 year ago

Well seems that I am wrong, and there is an option forceHitArea. But there is no any intention to resize viewport on resize of the canvas in the source code

Heilemann commented 1 year ago

@blnvdanil What is resize-observer? How might I use it? I'm running into some version of this, but on initialization.

blnvdanil commented 1 year ago

@Heilemann That is browser api, which lets you observe size changes of a HTML element

https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver