AFComponents.com

Components Used in this Tutorial: Stack AS3.0.

The Completed Project:



Adding an Image Using Component Inspector

To begin make sure that you have the Stack Component installed using the extension manager, have created a new Flash ActionScript 3.0 File and have dragged an instance of the Stack onto the stage from the Component Panel (Window > Components).

Next, select your instance of the Stack and in the Component Inspector (Window > Component Inspector) or Parameters Panel (Window > Properties > Parameters) look for the property called content. Double Click the "[]" in the value for content and new window will pop-up. Use the + to add an item. When you add an item you can define the Path, Description, Data, and Type of the new item.

•  In the Path enter either the local or full URL path to the image. 
• Description is optional but useful if you want a text description or if you are linking to another component. 
• Data is also an optional field but is useful if you want to add a hyperlink or a large image link if you are using the Stack in a gallery.
• In Type we will enter image since we are loading an image.
  

Adding a external .SWF

Loading a .swf file from an URL path is similar to loading an image. 

•  In the Path enter either the local or full URL path to the swf. 
• Description is optional but useful if you want a text description or if you are linking to another component. 
• Data is also an optional field but is useful if you want to add a hyperlink or a large image link if you are using the Stack in a gallery.
• In Type we will still enter image.
  

Adding a Movie Clip

Another type of content that you can load into the Stack is a movie clip that is internal to your flash file.

• In the Path enter either class name that will give the movie clip in Linkage (directions follow). We use DisplayObjectName in this example
• Description is optional but useful if you want a text description or if you are linking to another component. 
• Data is also an optional field but is useful if you want to add a hyperlink or a large image link if you are using the Stack in a gallery.
• In Type we enter instance.
  

The other important step is exporting the Movie Clip for ActionScript. Now, inside of flash create you movie clip however you would like. Once you have create a movie clip, find it in the library (Window > Library). Right click on the movie clip and select Linkage. In the pop-up define the class as the same name you used in the XML document - DisplayObjectName. Also make sure Export for ActionScript and Export in First Frame are both selected.

Properties of the Stack That Will Affect How The Content Loads

After you have successfully loaded your content in the Stack , you may want to change how your content is appearing in the Stack . These can also be found in the component inspector (Window > Component Inspector) or parameters panel (Window > Properties > Parameters) under the property displayStyle:

•     maintainAspectRatio to false
•     scaleContent to true
•     autoSize to false

The width and height of the images inside of the stack are controlled by the width and height of the stack component. You change this in the properties panel when your instance of stack is selected.
If you want to change how other things such as the containers in the Stack, there are other properties that you can customize: Stack API.