A Drag & Drop Effect in a ScrollPane

Interestingly, the right combination of parameters makes the ScrollPane exhibit a nice "drag&drop" behavior without extensive programming. This is a bit of an aside from our main purpose, but it connects well with a couple of ideas developed in other tutorials on this site, so we thought we would mention it.

To see the effect, use the SimpleScrollPane.fla example from the previous page, and set three particular parameters using the following three lines in the Actions panel:

spExample.horizontalScrollPolicy="off";

spExample.scrollDrag = true;

spExample.verticalScrollPolicy= "off";

There are no scroll bars visible and only the mouse drag action moves the picture around within the frame.

By way of connection with some our other material on this site, we include an alternate way to get this effect using masking (as explained in the tutorial Masking in Flash CS3 and ActionScript 3 in the Intermediate section) and "drag & drop" (as explained in the tutorial Drag-and-Drop in Flash CS3 in the Basic section).

The code for this example is included in the Downloads section at the bottom of this page. Note that the size of the fla and swf files for the Components version is huge compared to the minimal resources required to accomplish the effect directly.

Downloads

The source file for this example is DragPane.fla and the image file used in the example is prep2008a.jpg.

Back to Basic Tutorials              Back to Flash and Math Home

We welcome your comments, suggestions, and contributions. Click the Contact Us link below and email one of us.

Adobe®, Flash®, ActionScript®, Flex® are registered trademarks of Adobe Systems Incorporated.