Forum > General

Using the Mouse Wheel to Zoom

(1/2) > >>

J-G:
I've not looked at the [OnMouseWheel] event previously and was surprized how easy it was to impliment a [Zoom] facility. I had prevously set up a TTrackBar to deal with the Zoom but the idea of using the MouseWheel seemed to be more 'intuitive' for the end user.

The proc for the TTrackBar is very simple :

--- Code: Pascal  [+][-]window.onload = function(){var x1 = document.getElementById("main_content_section"); if (x1) { var x = document.getElementsByClassName("geshi");for (var i = 0; i < x.length; i++) { x[i].style.maxHeight='none'; x[i].style.height = Math.min(x[i].clientHeight+15,306)+'px'; x[i].style.resize = "vertical";}};} ---procedure TForm1.ZoomChange(Sender: TObject);begin  Mag := Zoom.Position/100;  if Mag < 0.1 then    Mag := 0.1;  Calc(self);end;You'll see that it just checks for a minimum size.

For the MouseWheel event it's very similar :

--- Code: Pascal  [+][-]window.onload = function(){var x1 = document.getElementById("main_content_section"); if (x1) { var x = document.getElementsByClassName("geshi");for (var i = 0; i < x.length; i++) { x[i].style.maxHeight='none'; x[i].style.height = Math.min(x[i].clientHeight+15,306)+'px'; x[i].style.resize = "vertical";}};} ---procedure TForm1.DisplayMouseWheel(Sender: TObject; Shift: TShiftState;  WheelDelta: Integer; MousePos: TPoint; var Handled: Boolean);begin  Mag := Mag*(WheelDelta/100);  if Mag < 0.1 then    Mag := 0.1;  Zoom.Position := Round(Mag*100);  Calc(self);end;It still checks for the Min but also sets the TTrackBar position - just to keep the two 'in sync'.

The (WheelDelta/100) was decided empirically - starting with /1 then /1000  -    /100 seems OK but further tests may change that.

This works as anticipated ---  but only when enlarging  ie. pushing the Wheel forward  -- as soon as I pull the wheel back - just one click - the Magnification becomes the Min (0.1)

Assuming that WheelDelta might become negative, I tried ABS(WheelDelta/100) but that made the 'negative' Zoom maximize.  ???

I can see from the description of the TMouseWheelEvent that WheelDelta is "How many notches the wheel has been turned" but there doesn't appear to be a 'direction' parameter which I might be able to use.

Can anyone shed some light on how I might better determine the level of magnification - specifically in the negative direction?





bytebites:
sign(WheelDelta) tells the direction.

jamie:
wheel delta is 120 by standard.

Not sure how you want to handle that, but I guess one could query that info at will.

J-G:

--- Quote from: bytebites on August 13, 2022, 02:01:06 pm ---sign(WheelDelta) tells the direction.
--- End quote ---
Thanks @bytebits  -  very useful.

I still needed to put my thinking cap on though and eventually came up with :

--- Code: Pascal  [+][-]window.onload = function(){var x1 = document.getElementById("main_content_section"); if (x1) { var x = document.getElementsByClassName("geshi");for (var i = 0; i < x.length; i++) { x[i].style.maxHeight='none'; x[i].style.height = Math.min(x[i].clientHeight+15,306)+'px'; x[i].style.resize = "vertical";}};} ---procedure TForm1.DisplayMouseWheel(Sender: TObject; Shift: TShiftState;  WheelDelta: Integer; MousePos: TPoint; var Handled: Boolean);Var  ZD : Single;       // Zoom Direction / Magnitudebegin  ZD := WheelDelta/110;  if Sign(ZD) = -1 then    Mag := ABS(Mag/ZD)  else    Mag := Mag*ZD;   if Mag < 0.1 then    Mag := 0.1;   if Mag > MaxZoom then    Mag := MaxZoom;   Zoom.Position := Round(Mag*100);  Calc(self);end;It hadn't previously occured to me to DIVIDE by the WheelDelta if Zooming out - nor to check if it was negative - the 'Sign' is certainly a useful test which I hadn't found before.

Empirically I've found that dividing the WheelDelta by 110 gives good control and now appreciate that that number essentially controls the 'sensitivity' of the Mouse Wheel. I tried it at 120 and of course found that there was no 'zoom' !! :-[  but I found little real difference if I used 60 - yes it was 'faster' but not massively, and 118 was perceptably slower.

@jamie  -  Yes, as you can see that is exactly what I do.

jamie:
Hmm..
 Would this be easier to calculate ?


--- Code: Pascal  [+][-]window.onload = function(){var x1 = document.getElementById("main_content_section"); if (x1) { var x = document.getElementsByClassName("geshi");for (var i = 0; i < x.length; i++) { x[i].style.maxHeight='none'; x[i].style.height = Math.min(x[i].clientHeight+15,306)+'px'; x[i].style.resize = "vertical";}};} ---  WheelDelta := Sign(WheelDelta)+Abs(WheelDelta)-120;   Width := Width+WheelDelta;   Height := height+WheelDelta;                       
that simply reduces it down but still, this only works if all widgets' fallows and there is a chance of different micky resolutions where in some cases drafters use a highres joystick etc.

Navigation

[0] Message Index

[#] Next page

Go to full version