Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Mobile scroll and event listener #236

Open
infinity-atom42 opened this issue Mar 4, 2024 · 1 comment
Open

Mobile scroll and event listener #236

infinity-atom42 opened this issue Mar 4, 2024 · 1 comment

Comments

@infinity-atom42
Copy link

This is the same problem as #229

When you make a Rive component that is interactive it disables the ability to scroll
This is definitely because of a touch event listener combined with a preventDefault that stops it from scrolling

Ideal solution would be:
Instead of preventDefault when you touch the screen, maybe you can check if it is necesarry.
When touching an area in the canvas that has no triggers, just don't disable scroll.
And for the cases where this would be ideal, just add a stopScrollOnTouch: as prop

For now, I just disabled the event listeners and added my own events until this problem is fixed

@infinity-atom42
Copy link
Author

Steps to solve the bug cause canvas_advanced_single.mjs is not public and i really hope it gets solved:

  1. There is StateMachineInstance class in canvas_advanced_single.mjs. You need to either change pointerDown() to return an object or create a functions that confirms touching something intractable. (check_interactive()for example)
  2. On line 149 where it checks if "mousedown"/"touchstart", add the new function and if it is interactive, set event.preventDefault()
  3. Remove event.preventDefault() from registerTouchInteractions.ts line 32

Done!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant