Interaction area controls Joystick sensitivity - problem on bigger displays / area

[dror-g]

The Interaction Area rectangle defines where a joystick will appear / move to on touch in Floating mode,
But it also controls how far the joystick can be dragged = how sensitive it is.

The bigger the area - the more the joystick can be dragged - smaller output numbers per cm.

This is a problem on bigger screens like tablets or phones with high resolution.
If you want the user to be able to touch anywhere on screen he needs to drag the joystick all the way from side to side to get full motion range.

Of course the output vec could be multiplied, but the ui is also affected, and if screen size is unknown and area rect is scaled using Percent - the output multiplier might not be suitable.

To Reproduce
Set joystick area to larger figures:
width: Val::Px(450.) or width: Val::Percent(100.)
Use joystick app on larger screen, longer drag required to max range.

Compare with more standard settings:
width: Val::Px(150.) or width: Val::Percent(30.)
shorter drag required to max range.

Expected behavior
Interaction Area should control where the joystick will appear on touch, not sensitivity.
Joystick range of motion should be fixed, controlled by another area parameter perhaps?

Desktop

• OS: Linux, native and wasm (using mouse)
• Browser Chrome and Firefox
• Version 2.1.0

Smartphone

• Device: Samsung A71
• OS: Android 12
• Browser Chrome
• Version 2.1.0

Additional context
PC resoulution 1280x720 , 800x600
Samsung A71 1920x1080

Thank you!!!!

[SergioRibera]

This is something I was afraid would happen, thank you very much for your report, I will be testing and will notify you as soon as I have a solution.
Anyway, thank you very much for using the library 😃

[clinuxrulz]

If I understand this problem, it is resolved unintentionally by this example:
https://github.com/clinuxrulz/virtual_joystick/blob/invisible-joystick-example/examples/invisible.rs

• When the joystick is not in use, the interaction area is set to the whole screen.
• When the joystick is in use, the interaction area is set to the bounding area/limits for the knob.

[dror-g]

What a great workaround! Thank you!

It should probably not be the "official" solution, but certainly solves it for me..

[clinuxrulz]

Yes, not really an official solution. Really need two different types of interactive areas. Maybe a new component called something like InitJoystickPos as a parent node with its own Style for sizing of the whole joystick setup that sets the position of the joystick on touch. The other interactive area left alone as simply the boundary area of the knob.

InitJoystickPos would only serve a purpose for Floating and Dynamic. For Fixed it would have no effect.

Just thinking out loud.