Dynamic Movie Clips and the ScrollPane - Page 4

In the previous page you added some code and started explaining how the code works. In this page, I will wrap up the code explanation and the tutorial.

btnAdd.onRelease = function() {

//attaching blueMovie to the content location stored in mcMain

mcMain.attachMovie("blueMovie", "blue"+i, mcMain.getNextHighestDepth(), {_y:50*i+5, _x:5});

i++;

scrollPane.invalidate();

};

 

btnRemove.onRelease = function() {

if (i != 0) {

i--;

removeMovieClip(mcMain+".blue"+i);

scrollPane.invalidate();

}

}

The above two sections of code are linked to the onRelease handlers of the add and remove buttons that add or remove items from our scrollpane. Much of this code only deals with attaching a movieclip or removing a movieclip.

To attach a movieclip, I use the following code:

mcMain.attachMovie("blueMovie", "blue"+i, mcMain.getNextHighestDepth(), {_y:50*i+5, _x:5});

The interesting thing to note is that I am attaching the movie blueMovie into the location referenced by the mcMain movieclip. The depth of the newly attached movie clip is also relative to the mcMain movie clip as shown by:

mcMain.getNextHighestDepth()

Be sure to also notice how I am using the i variable to act as a pointer to the next location for the next movie clip. I am not going to dwell too much on the intricacies of the attachMovie function, for I will save that for a future tutorial.

What is relevant is this line of code found after both the attachMovie and removeMovieClip functions in both the btnAdd and btnRemove functions:

scrollPane.invalidate();

The scrollPane's invalidate method repaints/refreshes the scrollpane. This ensures that our scrollbars and scrollbuttons are displayed and up-to-date on how far they need to scroll. If you do not call the invalidate method, you will see the blueMovie movieclips being added to your scrollpane, but you will not see the scrollbars appear when the number of movie clips exceeds the boundaries of the scrollpane itself.

Conclusion
Hopefully this tutorial helps you to better use the scrollpane component. Most of the Adobe documentation deals with other uses of the scrollpane such as using it to load external movies, so be sure to check their excellent scrollpane articles here.

I have provided the final source file that you can use to see how my implementation I explained in this tutorial works:

1 | 2 | 3 | 4