Knobs, Mouse Clicks, and Zone Widening Question

[TheGreyGoose]

Hi gang, I'm rebuilding some knobs and it occurred to me that I would like to make the mouse click interaction area on each side wider by ~50 pixel so that you can more easily touch what would be the outside area next to the knob and not just right on the knob itself, mainly to facilitate much easier use of a touchscreen with your finger so that you don't have to be as precise as what you normally do with a mouse cursor on a knob.

For example, a 100 x 100 knob would become 200 wide x 100 area for interaction but the knob is still drawn in the middle at 100x100 (see attached image).

So I guess what I'm asking is, if I'm going to enlargen the mouse click / touch zones do I also have to widen the knob art as well, meaning create more of a rectangle and not a square? Or are the mouse clicks in any way independent of the defined XY grid and able to work outside of the defined art X Y coordinates?

And if not, then that also begs the question do I need to just make a bigger square and not a rectangle? My concern here is do the mouse clicks move and rotate with the art (I assume not) but if the art is rotating and it's a rectangle shape and not a square then every 90 degrees the knob rectangle becomes vertical and so would the mouse clicks still work at that point.? (on only when horizontal??)

Or option C - do I first create a rectangular base image that's all 0,0,0 RGB and then that works with the mouse clicks by itself and then the square knob art is an element that sits and rotates on top of the rectangle base image?

I'm probably over-analyzing all this but I hope I explained this well enough for you to get what I'm saying,.. Essentially that if defining a rectangular area for touch / mouse clicks do I then need a base image under it to define mouse click zones or can I just use a single rectangular shaped art piece with the round knob drawn in the middle?

Thanks!

 

[rpmc]

do I also have to widen the knob art as well - No

The mouse click area is independent of art work.

 

[TheGreyGoose]

Ok, but then how exactly does that work? (and do I have this set up properly below now?) I mean I know that mouse clicks are independent of the artwork but for example if you are only using say a 100 x 100 image for the knob itself, how can you set up a larger (wider) click area of like 300 wide x 100 tall into what is "dead space". Don't you still have to set up click zone limits within a base reference area to work with? I assume I would have to set up a larger size gauge area at the top of the gauge?

Given my goals of a 100 x 100 knob but with a larger touch area that is slightly greater than the knob size, does this example look correct?

<Gauge Name="Altitude Selector Knob" Version="1.0">
<Size X="300" Y="100" />

<Element>
<Position X="100" Y="0"/> .................(so this is setting a 100 x 100 knob bitmap in the center of given area of 300 x 100)
<Image Name="Knob_AP.bmp">
<Axis X="50" Y="50"/> .................(and this is stating the axis is dead center on the 100 x 100 knob art)
</Image>
<Rotate>
<Value>(A:Autopilot Altitude Lock Var, feet)</Value>
</Rotate>
</Element>

<Mouse>
<Area Left="0" Width="150" Top="0" Height="100"> .... (sets up click area on the LEFT side of the knob to knob center)
<Tooltip>Autopilot Altitude (%((A:Autopilot Altitude Lock Var, feet))%!d! feet)</Tooltip>
<Cursor Type="DownArrow"/>
<Click Repeat="Yes">
(&gt;K:AP_ALT_VAR_DEC) (G:Var5) 10 - s0 0 &lt; if{ 340 } els{ l0 } (&gt;G:Var5)
</Click>
</Area>
<Area Left="150" Width="300" Top="0" Height="100"> .... (sets up click area on the RIGHT side of the knob from center to full right of the 300px width)
<Cursor Type="UpArrow"/>
<Click Repeat="Yes">
(&gt;K:AP_ALT_VAR_INC) (G:Var5) 10 + s0 360 &gt; if{ 0 (&gt;G:Var5) } els{ l0 } (&gt;G:Var5)
</Click>
</Area>
</Mouse>

</Gauge>