Skinning the TextScroller component is a simple process. This tutorial will tell you how.
1. Open Flash and start a new file.
2. Create a textfield on your stage that will need to be scrolled. Press Ctrl+F3 (Windows) or Cmnd+F3 (Mac) to open the properties panel. Set the textfield to multiline and give it an instance name. You can later associate this textfield with content in your database using the fText component.
3. Press Ctrl+F8 (Windows) or Cmnd+F8 (Mac) to open the 'Create New Symbol' dialogue box. Name the clip 'minus' (without the quotes) and ensure the type is set to 'Movie clip'. Click 'OK'.
On the timeline of the new clip create the visual representation of the button of a scrollbar. Ensure that the registration point of all content is 0,0. Size the background of the graphic to 16 pixels by 16 pixels.
4. Repeat step 3 three times to create a 'plus', 'track' and 'thumb' movieclips.
5. Create another new clip to act as your skin. Enter a name for the symbol and set the type to 'Movie clip'. If the advanced section is not open, open it. Tick the 'Export for Actionscript' checkbox (the 'Export in first frame' checkbox will tick itself) and enter an 'Identifier' for the clip. Click 'OK'.
6. Drag a copy of the 'minus' clip out of the library and drop on the timeline of the skin clip. With the minus clip still selected, open the properties panel and set the instance name to 'minus' (without the quotes). Position the clip at x=0 and y=0.
7. Repeat step 6 to add an instance of the 'plus' clip, positioning it around a 100 pixels below the 'minus' clip. Set its instance name to 'plus' (without the quotes).
8. Repeat step 6 to add an instance of the 'track' clip. Position it immediately below the 'minus' clip and set its height so that its bottom edge touches the 'plus' clip. Set its instance name to 'track' (without the quotes).
9. Repeat step 6 to add a copy of the 'thumb' clip to the stage. Position it over the 'track' clip and give it the instance name 'thumb' (without the quotes).
10. Return to the main timeline. Press Ctrl+F7 (Windows) or Cmnd+F7 (Mac) to open the components panel and locate the TextScroller component in the fCMSPro folder. Drag a copy out of the panel onto the textfield you created in step 2.
11. With the TextScroller component still selected press Alt+F7 to open the Components Inspector panel. (The 'target' parameter is set as the name of the textfield by dropping the component onto it.) Locate the 'skin' parameter and enter as its value the Linkage Identifier you entered for your skin symbol in step 5.
12. Press Ctrl+s (Windows) or Cmnd+S (Mac) to save your file. When you test it you'll find that it is using the symbols that you have created for it.