How to Write a Flash Gallery Script
Flash galleries make for excellent places to showcase pictures of friends and family, or even to show off your own personal work as an artist, animator, writer or even website designer. A gallery can be as simple as a collection of thumbnails of your work, which, when clicked on, will show you a full-size image, or it can be an interactive, scrolling showcase of images that viewers can move through with buttons.
Other People Are Reading
Instructions
-
Set Up Your Gallery
-
1
Use "File" > "Import" to bring all of the images for your gallery into Flash.
-
2
Arrange all of your images on the stage as thumbnails in a single view. You can make the stage larger in the Properties Inspector if you need to.
-
-
3
Using the "F8" key, select each of your thumbnails individually and turn them into movieclip symbols. Give them logical names in the Properties Inspector that you can reference in ActionScript. The script in this tutorial uses the names "pic1," "pic2," etc., which you can change as needed.
-
4
Insert additional keyframes on the timeline as needed to showcase your images one at a time. Arrange one image on each of your keyframes in full size.
-
5
Insert a new layer on the timeline for your buttons and lock the layer with the images. On the new layer in the first keyframe you will draw your buttons to navigate through the gallery. Create a "forward" button at the bottom (or top) right corner of the screen, and a "back" button at the bottom (or top) left corner of the screen. Turn these into movieclip symbols and give them instance names. The script below uses the names "btnFwd" and "btnBack," which you can change as needed.
Add the ActionScript
-
6
On the first keyframe, press "F9" to open the Actions Panel and paste the following script, expanding as needed for the number of images you have:
btnFwd.onRelease = goForward;
btnBack.onRelease = goBackward;
pic1.onRelease = pic1Release;
pic2.onRelease = pic2Release;
pic3.onRelease = pic3Release;
-
7
Insert a couple of lines after the script above and paste the following code:
function goForward(){
nextFrame();
}
function goBackward(){
prevFrame();
}
function pic1Release(){
gotoAndStop(2);
}
function pic2Release(){
gotoAndStop(3);
}
function pic3Release(){
gotoAndStop(4);
}
-
8
Press "Ctrl" + "Enter" to test your movie. Make any tweaks or adjustments to size and/or positioning of the elements that are needed.
-
1
Tips & Warnings
Many popular galleries use a "navigation bar" at the bottom between the forward and the back buttons. It is just a long rectangle divided into sections and numbered, so that while viewing the gallery, visitors may jump to any page they want.
References
Resources
- Photo Credit Roman art gallery, Vatican Museums image by Eishier from Fotolia.com
