HOWTO: Using the MouseWheel Event in AS3
Mousewheel usage has been increasing now that almost everyone has a mouse with a wheel on it. Flash and specifically AS3 has capabilities to get lots of information about the mouse wheel movement and mouse movements in general.
In AS3 you wire up events like this:
stage.addEventListener(Event.RESIZE, onResizeEvent);
For mouse events you wire them up using the Mouse pseudo static enumeration MouseEvent:
stage.addEventListener(MouseEvent.MOUSE_WHEEL, onMouseWheelEvent);
Inside of our flash class that we are wiring up events for we need to put the event function that we pass as an argument.
function onMouseWheelEvent(event:Event):void
{
trace("onMouseWheelEvent!");
trace(event.delta);
}
As you can see the method passes the object in the event. Here we are getting the delta property of the object returned for the mousewheel event. You can get any of these properties that return (you can see this if you trace out the object).
//[MouseEvent type="mouseWheel" bubbles=true cancelable=false eventPhase=2 localX=261 localY=241 stageX=261 stageY=241 relatedObject=null ctrlKey=false altKey=false shiftKey=false delta=-6]
[
MouseEvent
type="mouseWheel"
bubbles=true
cancelable=false
eventPhase=2
localX=261
localY=241
stageX=261
stageY=241
relatedObject=null
ctrlKey=false
altKey=false
shiftKey=false
delta=-6
]
The delta property is the amount and direction that the mouse wheel was moved up or down. If the delta is a positive integer then the mouse wheel was moved up, if negative it was moved down.
On my computer I have scrolling set to pages so it sets to 6 or -6 on all movements. Others that have different mouse customizations might only move 1 or 2 in either direction, mine moves six. This is important to note for game development or browsing with zoomable applications. Not all mousewheels are the same.
You can also see that there is a ctrlKey property and an altKey and shiftKey property to check if the user also has these down. This could be beneficial for navigation like in a 3d program or map where if you hold down shift or ctrl the application does different actions with the mouse wheel.
The mouse positions are also passed so you could check if what to scroll specifically or zoom. These mouse positional properties are available in other mouse events as well, you can always trace(event) to the passed event to see what it contains. You can also attach these events inside individual classes so that they only reacte to their own mouse wheel events rather than on the main stage.
SAMPLE MouseWheel script test file (make a new file and set this to the document class)
package
{
import flash.display.*;
import flash.events.*;
import flash.ui.*;
public class MouseWheelMain extends MovieClip
{
public function MouseWheelMain()
{
stage.addEventListener(MouseEvent.MOUSE_WHEEL, onMouseWheelEvent);
}
function onMouseWheelEvent(event:Event):void
{
trace("onMouseWheelEvent");
trace(event);
trace(event.delta); // amount mouse wheel moved
// could do something like
//movieToMove.x += event.delta/6; // or any property like scaleX, scaleY, y, depth etc.
}
}
}
