Skinning v2 Components

I had the hardest time trying to skin the scrollbar (which is a subcomponent) for the TextArea component. Finding no definitive answer in any one place, I did however piece together enough information to finally accomplish just that.

**Here’s the steps I took to do it… **

  1. I opened the HaloTheme.fla
    (Path…Flash root installation folder>en>FirstRun>ComponentFLA>HaloTheme.fla

  2. Save as myTheme.fla (or any other name you choose)

  3. Open Library (Ctrl+L)

  4. Inside the Flash UI Components 2 folder navigate to Theme>MMDefault

  5. Open each folder for the component you wish to skin and break it down to the core assets and modify to your liking

  6. Save fla after all modifications are made

**To Use Your Modified Skin **

  1. Open a new Flash document (Save As and name it as you wish…here I’ll use appliedTheme.fla)

  2. Open the myTheme.fla file (or your choice)

  3. Drag the Flash UI Components 2 [COLOR=crimson]folder from the myTheme.fla library[/COLOR] [COLOR=darkblue]to the stage of appliedTheme.fla[/COLOR]

  4. You now have the Flash UI Components 2 folder in the appliedTheme.fla…just use the components from the Components Panel as before

I’m sure there are other ways, but that worked for me. I know it has to possible with AS too. (I was able to do the TextArea background with AS but not the scrollbar). I did the TextArea with…

[AS] // Change background color of TextField component instance myText_txt.setStyle(“backgroundColor”, “0x5a6970”)
myText_txt.setStyle(“borderColor”, “0x6e818a”) /Outside Top and Bottom/
myText_txt.setStyle(“highlightColor”, “0xabc9d6”) /Inside Top/
myText_txt.setStyle(“shadowColor”, “0xabc9d6”) /Inside Bottom/
myText_txt.setStyle(“borderCapColor”, “0x6e818a”) /Outside Left and Right/
myText_txt.setStyle(“shadowCapColor”, “0xabc9d6”) /Inside Left and Right/
[/AS]