The main procedure used in custom skin design with Creative FL Tabbed Menu is the following: firstly, you have to create a series of movie clips that will represent the elements of the menu (some of these elements need to be created in order for the skin to work, while others are optional and used for obtaining a better design); these movie clips have to be named following a special naming procedure; all the elements have to be exported for ActionScript under the same names (from the previous step); the movie clips don’t have to exist on the stage, but in the Flash file library – an useful measure would be to put them in a folder named accordingly.
Probably the most important detail that you have to consider when creating a custom skin is how you name the movie clips. In the tables below I will describe the naming procedure in detail, what elements you have to create (the first table) and what are only optional and used for enhancing the appearance (the second table).
Required skin elements |
|
|---|---|
Skin Element Name |
Description |
| main_back | The background of the main menu. |
| sub_back | The background of the sub menu. |
| main_button_up | The up state of the main menu button. |
| main_button_over | The over state of the main menu button. |
| sub_button_up | The up state of the submenu button. |
| sub_button_over | The over state of the submenu button. |
Optional skin elements |
||
|---|---|---|
Skin Element Names |
Description |
Dependency |
| sub_button_down | The down state of the submenu button. | sub_button_up |
| main_button_down | The down state of the main menu button. | main_button_up |
| main_first_button_up | The up state of the first main menu button. | main_button_up |
| main_first_button_over | The over state of the first main menu button. | main_button_over |
| main_first_button_down | The down state of the first main menu button. | main_button_up |
| main_last_button_up | The up state of the last main menu button. | main_button_up |
| main_last_button_over | The over state of the last main menu button. | main_button_over |
| main_last_button_down | The down state of the last main menu button. | main_button_up |
| sub_first_button_up | The up state of the first submenu button. | main_button_up |
| sub_first_button_over | The over state of the first submenu button. | sub_button_over |
| sub_first_button_down | The down state of the first submenu button. | sub_button_up |
| sub_last_button_up | The up state of the last submenu button | sub_button_up |
| sub_last_button_over | The over state of the last submenu button. | sub_button_over |
| sub_last_button_down | The down state of the last submenu button. | sub_button_up |
| main_separator | The main menu button separator. | None |
| sub_separator | The submenu button separator. | None |
| main_arrow | The arrow that points out that a main menu button has a submenu. | None |
| sub_arrow | The arrow that points out that a submenu button opens its own submenu. | None |
The third column in the table above - "Dependency" - refers to what element will be used in case the optional element in the first column is not defined (in the Library).
The final names for the skin elements must have the following style: nameOfSkinElement_skinName, where nameOfSkinElement is one of the elements presented in the table above, and skinName is the name introduced in the General tab of the product’s configuration interface.