1. Code
  2. News

Quick Tip: Mimic the Stacks Feature of Mac OS X Using AS3

Read Time:2 minsLanguages:

The Stacks feature has been part of the Mac OS since Leopard and it is a great way to handle display elements. In this Quick Tip we will mimic this feature using ActionScript 3 Classes.

Final Result Preview

Let's take a look at the final result we will be working towards:

Step 1: Brief Overview

We'll make use of the awesome class created by PixelFumes and custom graphics to create a Stacks menu in Flash. You can download the source of the class from the developer's site.

Step 2: Set Up Your Flash File

Launch Flash and create a new Flash Document, set the stage size to 508x243px and the frame rate to 24fps.

Flash OSX stacks effectFlash OSX stacks effectFlash OSX stacks effect

Step 3: Interface

Flash OSX stacks effectFlash OSX stacks effectFlash OSX stacks effect

This is the interface we'll be using; the background is an image taken from my desktop and the cool logos are part of the Tuts+ network.

Convert the logos to MovieClip and mark the Export for ActionScript checkbox. The gray square is a stage button called stackButton.

Step 4: ActionScript

Create a new ActionScript Class (Cmd+N), save the file as and write the following lines; please read the comments in the code to fully understand the class behavior.

Step 5: Document Class

Add the class name to the Class field in the Publish section of the Properties panel.

Flash OSX stacks effect


You've created a useful Stacks menu for your applications or website. You can adapt the project to meet your needs or use this technique to build your custom Stacks.

I hope you liked this Quick Tip, thank you for reading!

Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.