How to Create a Flash MX Component - Page 3

Overview

A Component starts with a movie clip. We are first going to define the visuals for the triangle within a movie clip, and then write the ActionScript within the movie clip for the triangle class, properties, and methods. We then link the movie clip with the class definition. When the Component is placed in a movie, the class constructor is invoked. The triangle is very simple, so we do not need complex visuals or animation. The triangle has a base, a height, and a tint color property, a boolean flag (property) indicating whether or not to apply the tint, as well as a set of methods for reading and setting those values. The methods access the properties and manipulate the visuals.

Step 1. Create the triangle movie clip

The first step is to create the prototype triangle that we will scale and stretch according to the set base and height. Start by creating a new movie clip, naming it "Triangle Component". Inside that clip, draw an isosceles triangle any way you know how. Next, set the width and height of the triangle using the Property panel to be 10 pixels by 10 pixels.

Select the triangle, open the Align panel, select "To Stage", and align the triangle to the center (horizontally) and bottom (vertically). We align it to the bottom center so that when we place the component on the stage, we know that the base will remain in position when we scale the base and height. Your screen should look as follows: