Flash / AS

Blend / WPF
ASP.net / PHP

Photoshop

Forums
Blog

About

 


FlashComponents
  Galleries
  Slideshows
  Menus
  Design & Effects
  Audio & Video
  User Interface
  Templates

 

 

 

 

 
Adding
Thumbnails - Page 7
        by kirupa  |  14 June 2005

I will now provide a quick summary of everything in our thumbnail code, from the previous pages, and what causes it to work.

First, you decide that you want to have thumbnails. You make the necessary modifications to the XML file by adding in the path for your thumbnail images. Now that you have your XML file modified, your next course of action is to modify the loadXML function in your FLA. You tell Flash to loop through each node and pick out the thumbnail image path and store it in an array.

So, now, you have reached a point where data from XML has been retrieved, processed, and stored as an array in Flash. What do you do with an array full of thumbnail image paths? You create an empty movie clip for each thumbnail and load that thumbnail into it!

Loading the thumbnail is only one part of our whole thumbnail scroller. You have to make sure that each image is spaced accordingly by taking into account each image's width and not loading the next successive image on top of a previous image! That is where our hit_left and hit_right movie clips first gain importance.

The second part of the thumbnail scroller is to actually scroll when our mouse is on the left or right edges of our thumbnail. In this tutorial, I used the two movie clips, hit_left and hit_right to simulate the left and right boundaries of our thumbnail scroller. If the mouse was both within the thumbnail area and touching either the left or right hit movie clips, your thumbnails will scroll provided there are thumbnails left to scroll.

Since most of the code is based on the existing photo gallery code, it was not difficult to load the larger image when a thumbnail is clicked. Each thumbnail contained a number that was equivalent to a number used in loading images in the photo gallery. Passing that number to our existing functions from our photo gallery was all it took to getting images to load.

I have provided a ZIP file containing both our final thumbnail FLA and the modified images.xml file.

Download Source MX 2004

A great big thanks go out to all of the members who constantly helped others with their thumbnail and photo gallery questions on the forums. I'm sure there are more members, but the ones I've seen helping answer these questions often are scotty, stringy, senocular, lostinbeta, claudio, and more!

I hope the information helped. If you have any questions or comments, please don't hesitate to post them on the kirupa.com Forums. Just post your question and I, or our friendly forum helpers, will help answer it.

The following is a list of related tutorial and help resources that you may find useful:

How to use the Forums
New, Upcoming, and In-Progress Tutorials
How to Help out kirupa.com
Writing Tutorials
 
Cheers!
Kirupa Chinnathambi
kirupaBlog

 


page 7 of 7


 


kirupa.com's fast and reliable hosting provided by Media Temple. flash components
The Text Animation Component for Flash CS3
Check out the great, high-quality flash extensions. Buy or sell stock flash, video, audio and fonts for as little as 50 cents at FlashDen.
Check out our high quality vector-based design packs! Flash Effect Components

Flash Templates
CSS Templates
Dreamweaver Templates

flash menus, buttons and components
Digicrafts Components The best flash components ever!
Entheos Flash Website Templates Free Flash Page Flip
flash components Buy and sell FLAs at Ultrashock!
Upload, publish, deliver. Secure hosting for your professional or academic video, presentations & more. Screencast.com create flash slideshow as easy as 1,2,3
Learn how to advertise on kirupa.com