Learn how to respond to mouse events in Away3D Lite.
Interaction with a Flash application is almost always via the mouse – especially for the sort of small applications that Away3D Lite is designed for. Away3D Lite does support mouse events on 3D objects. The process is similar to normal GUI controls, but there are a few caveats to watch out for. To demonstrate mouse interaction with 3D object we will build off the last tutorial and add event listeners to a number of primitive models.
ApplicationManager.as
We add a new function call addMesh, which adds the mesh to the scene and then attaches two function, mouseOver and mouseOut, to the events MouseEvent3D.MOUSE_OVER and MouseEvent3D.MOUSE_OUT. This is done using the standard addEventListener function, and should look familiar to anyone who has done event driven development in Flex before. [code]
The removeMesh function is updated to remove the event listeners. [code]
Inside the mouseOver and mouseOut functions we use TweenMax to modify the scale of the mesh. When the mouse is over the model, its scale will bounce between 1 and 2, returning to the default scale of 1 when the mouse has moved off the shape. [code]
So far the code for dealing with mouse events is quite straight forward, but there are a few catches. You can’t modify the material of the model in response to a mouse event, because Away3D Lite determines the model that was under the mouse pointer by maintaining a reference to the model itself and also the material of that model. This means if you change the material in response to say a mouse over event, the next time the mouse is moved Away3D thinks that the model that is under the pointer has changed because the material of the model under the pointer has changed.
Also, Away3D Lite won’t check for mouse events unless the mouse has moved or a button has been pressed. This seems like an obvious thing to do, but in our case the model under the mouse pointer may actually cease to be under the pointer because its scale is changing. You could also find the same situation if models are moving. By default in this situation the mouse out event is not triggered, even though the model is now no longer under the pointer. To get around this we need to modify the Away3D Lite source code and make the View3D fireMouseEvent function public, and then call it every frame. In doing so Away3D Lite will check to see if a model has moved out from underneath the pointer every frame, and not just in response to mouse input. [code]
Finally, you can not use the FastTemplate if you want to respond to mouse input, because it specifically disables processing of mouse events by setting view.mouseEnabled = false. Of course you could just set view.mouseEnabled = true to change it back, but this is not an issue when using the BasicTemplate.
Responding to mouse events in Away3D Lite follows the same patterns that Flex uses throughout, and once you know some of the quirks of the Away3D mouse event system it is very easy to implement.
Go back to Away3D Tutorials
Five3D Tutorials - Mouse Interaction
Learn how to interact with Five3D objects.