User Guide

Accordion component (Flash Professional only) 103
clear();
lineStyle(0, 0, 100);
beginFill(c, 100);
drawRect(0, 0, __width, __height);
endFill();
}
// required for skins
static function classConstruct():Boolean
{
UIObjectExtensions.Extensions();
_global.skinRegistry["AccordionHeaderSkin"] = true;
return true;
}
static var classConstructed:Boolean = classConstruct();
static var UIObjectExtensionsDependency = UIObjectExtensions;
}
This class creates a square box based on the border style: a blue box for the false up, rollover,
and disabled states; a green box for the normal pressed state; and a red box for the expanded
child.
3.
Save the file.
4.
Create a new FLA file.
5.
Save the FLA file in the same folder as the AS file.
6.
Create a new symbol by selecting Insert > New Symbol.
7.
Set the name to AccordionHeaderSkin.
8.
If the advanced view is not displayed, click the Advanced button.
9.
Select Export for ActionScript.
The identifier will be automatically filled out with
AccordionHeaderSkin.
10.
Set the AS 2.0 class to RedGreenBlueHeader.
11.
Ensure that Export in First Frame is already selected, and click OK.
12.
Drag an Accordion component to the Stage.
13.
Set the Accordion properties so that they display several children.
For example, set the childLabels to an array of [One,Two,Three] and childNames to an
array of
[one,two,three].
14.
Select Control > Test Movie.
Using movie clips to customize the Accordion header skin
The above example demonstrates how to use an ActionScript class to customize the Accordion
header skin, which is the method used by the skins provided in both the Halo and Sample
themes. However, because the example uses simple colored boxes, it is simpler in this case to use
different movie clip symbols as header skins.