ActionScript Development
Flickr in Flash – Creating a portfolio
by Jassa Amir-Lang
In the last issue of Flash & Flex Developer’s Magazine, we looked at how to connect to Flickr fromFlash, andhowto interactwith thedata thatwe could access from Flickr. In this issue, we're going to extend that functionality to create an online Flash portfolio, managed by Flickr.
over to http://code.google.com/p/as3flickrlib/ and download the latest release. Unzip the source files into your Portfolio. Now do the same with http://code.google.com/p/as3corelib/ . If you need more information on this, just refer to my article in the last issue. Next, jump over to Flash and create a new (AS3) document. Set the framerate to 30fps. Now save this Flash Document to the newly create Portfolio folder. Now that the basics have been setup we can get started on our design. Design To start with, we're going to need some sort of design for our portfolio. When designing this we should take into account the various components that we will need – which ones will be pulled from Flickr, and which ones will be static. Consider the following list of static elements:
What you will learn… • How to interact with data from Flickr to create a portfolio in Flash
an API Key. You can learn all about the API and API Keys at http://www.flickr.com/services/api/ . Finally, we learnt the basic steps needed in AS3, to connect to your Flickr account and start playing around with the photos. In this tutorial we will be going over some of the same steps so I won't go into as much detail with them. Setup To get started, create a new folder somewhere and call it Porfolio . Within that folder, create a folder called items . As with the last issue, we'll need to add the as3flickrlib and as3corelib libraries. Head What you should know… • You should have read the introductory article from the previous issue of the magazine • You should have a fair grasp of AS3 and basic OOP techniques
Level of difficulty
Recapping I'm going to start by briefly going over what we learnt in the last issue. First of all we need to sign up for a free Flickr account at http:// www.flickr.com . For the purpose of this tutorial, I'm going to assume that you've uploaded images into three different sets. Next we learnt that to connect to Flickr, we were going to need
• A title for the portfolio • A description for the portfolio
These two elements will be a static part of your design, meaning that they will not be provided to us by Flickr. Now lets think about the items that Flickr can give us, and the information within those items that we will want to use:
• A Photoset
• Thumbnail • title
• A Photo
• Thumbnail • Title • Description • Image
Now look at Figure 1 to see how we will use each of these elements in our design.
Figure 1. The Design Elements
03/2009 (5)
38
Made with FlippingBook HTML5