Hello guys can someone tell me how to detect Mouse...
# webassembly
o
Hello guys can someone tell me how to detect Mouse Events from Notebook Touchpad like simple Taps or left and right clicks?
s
I'll assume you're talking about Compose/Wasm (as this question is in the #webassembly channel). If you just want to handle click/tap/touch events normally, you can use
clickable
and friends (or go lower-level with
pointerInput
). However, anything deeper than that is probably not possible, at least not from the browser. Deeper data on where a touch has physically happened on a touchpad or other input devices is not exposed by the browser, and thus can't be accomplished in Compose/Wasm, unless you build some sort of external installable program to communicate these things to the web app. However it is possible to do with Compose/Desktop through JNI. You'll have to write native code (in C/C++/Rust, for each target platform, different code for Linux/Windows/macOS) that talks to the device drivers in the kernel to get such data. I've done this in the past (on Linux) to get the touch position from the touchpad and send it over to a Compose Desktop app. Spoiler alert: it's a lot of work, and can be quite error prone. The same applies if you want to write some external utility to talk to a web app (whether it's Compose or Kotlin or just plain JS doesn't matter), you'll have to write some low-level code to make such utility work. In other words, there's no native solution, and that would be out of scope for Compose UI IMHO. In any case, what's the usecase you have in mind?
K 1
❤️ 1
thank you color 1
o
Thanks for your response. I want to allow the user to right-click and see the standard context menu (copy, paste, etc.) that is visible on all websites. With the default WASM/Compose project, this isn't possible. Additionally, when the user taps on the MacBook touchpad, the button click doesn't register. This makes it seem like the only way to interact with the website is by pressing down the left-click, rather than just tapping it. In short, I don't want anything fancy. I just want my website to behave like a standard HTML website where users can tap to click on buttons and use right-click to access the default context menu.
i
This better to address to the Compose Multiplatform team- @Oleksandr Karpovich [JB]
🙌 1
o
@Igor Yakovlev, am I using the wrong slack hashtag? Which one should I use the #multiplatform ?
o
To detect right mouse clicks you can use
Modifier.onClick
- https://github.com/JetBrains/compose-multiplatform/tree/master/tutorials/Mouse_Events#new-experimental-onclick-hand[…]-only-for-desktop-jvm-platform (the doc says it's desktop/jvm only, but actually this API is available for web too as I see) Compose for Web currently doesn't support the context menu. You can try to workaround it using
contextmenu
browser event: https://developer.mozilla.org/en-US/docs/Web/API/Element/contextmenu_event For compose-web questions you can use #compose-web
🙌 1
s
@Ojav Ah, that should be possible with the workaround @Oleksandr Karpovich [JB] mentioned. However you also said that your MacBook touchpad "taps" aren't recognized by Compose unless you "click" the touchpad, which is really weird... it should work just fine. I know OS-level tap and click events are different, but I assume the browser handles both as one same "click" event (just guessing), so this is confusing.
🙌 1
o
https://neva-home.com/ you can visit this website it has the official template installed. When I use my windows notebook the "tap" is recognized but on my macbook pro it isnt. Anyways thanks for your help guys ❤️ . I will try PointerInput and the Workaround
a
I am facing the same issue as well. I have “tap to click” enabled so that I don’t have to physically press down to click. This works every where else on the system - even on the Compose Desktop application. But it doesn’t work on the same compose application compiled to WASM and running in a browser. I have to physically press down the touchpad to click. I have tried different browser engines as well - Edge which uses chromium and also on Firefox and have the same problem. I don’t think this issue is related to the multi-platform since it works fine on the desktop. These guys apparently had the same issue and resolved it - https://github.com/unoplatform/uno/issues/16076 I don’t understand their solution but the problem is C# code compiled to WASM doesn’t register tap to click on MacOS. I thought this might help.
s
@Aru That's actually a very good resource. If it's the same oddity (
pointerdown
events happening but all mouse buttons set to off), then Compose/Wasm should change how it handles these
pointerdown
events (e.g. treat events with no mouse buttons on as a "left click" by default? but what if this also happens on right click?). @bashor any thoughts here? How is Flutter/Wasm handling this?
b
The most likely browsers fire an event type unprocessed yet in Compose Web, please file an issue
👍 1
You can try to look on events here https://codepen.io/phreaknation/pen/QmJjEa