davidfig / pixi-scrollbox

a scrollbox built for pixi.js using a masked box that scrolls vertically and/or horizontally with optional scrollbars
https://www.npmjs.com/package/pixi-scrollbox
MIT License
171 stars 33 forks source link

Avoiding pointer events already used for scrolling #7

Closed drpepper closed 5 years ago

drpepper commented 5 years ago

Hello, this seems like a great library! So far it's been very straightforward to integrate into my game.

I do have a problem, though, with interactive objects within the scrollbox. In my case, these are text boxes for which I subscribe to the pointertap event. I don't want the pointertap event to fire, though, in the case that the ScrollBox has already handled it.

Can you think of a way where I could filter out those pointertap events that have been used to scroll? Or perhaps there is some other way to achieve this?

Thanks a lot

davidfig commented 5 years ago

The easiest way to fix this is to use the pointerdown/pointerup events instead of pointertap. By default the scrollbox (which uses pixi-viewport) calls event.stopPropagation on pointerup/pointerdown events that are used by the viewport (e.g., to stop the viewport from scrolling during the decelerate() plugin). Hope that helps!

drpepper commented 5 years ago

Thanks for your quick answer @davidfig.

I eventually figured it out- in fact stopPropogation is implemented for dragging the scrollbar, but not for dragging within the window (the dragScroll() function perhaps?).

Also, and this is probably unrelated, I notice that when I scroll using the mousewheel (my laptop trackpad), the contents of the ScrollBox get moved to the right (perhaps being centered?). Would you have any idea on that one?

Thanks again !

drpepper commented 5 years ago

Hi @davidfig . I found the issue with the events propagating. In fact, since my text boxes are inside the scrollbox, it's only normal that those boxes get the events first, before the scrollbox does. To get around this problem, I keep track of the drag-start and drag-end events, and ignore pointerup events during dragging.

With regards to the mouse wheel issues, I debugged them and offered a solution in a PR. Let me know what you think! #8