I have a set of button skins which all look like the following skin

<s:SparkSkin 
 xmlns:fx="http://ns.adobe.com/mxml/2009"; 
 xmlns:s="library://ns.adobe.com/flex/spark"> 
        
 <fx:Metadata> 
   [HostComponent("spark.components.Button")] 
 </fx:Metadata>
        
 <s:states> 
   <s:State name="up" /> 
   <s:State name="over" /> 
   <s:State name="down" /> 
   <s:State name="disabled" /> 
 </s:states>  
                
 <!-- UP ICON -->
  <s:BitmapImage source="@Embed('assets/previous_default.png')"    
includeIn="up" />
        
 <!-- OVER ICON -->
 <s:BitmapImage source="@Embed('assets/previous_hover.png')" includeIn="over" />
        
 <!-- DOWN ICON -->
 <s:BitmapImage source="@Embed('assets/previous_down.png')" includeIn="down" />
        
</s:SparkSkin >
---
The only difference between all the skins is the image source they use. 
Is it possible to make this generic so I can define the image source in the 
style sheet. 

Thanks


Btw, In Flex 3, it was very easy to change the image skin in the style sheets 
using styleName. eg

<mx:Button styleName="LeftArrow"/>
<mx:Button styleName="RightArrow"/>
<mx:Style>
  .LeftArrow
  {
    upSkin: Embed(source="assets/previous_default.png");
    overSkin: Embed(source="assets/previous_hover.png");
    downSkin: Embed(source="assets/previous_down.png");
   }
  .RightArrow
  {
    upSkin: Embed(source="assets/right_default.png");
    overSkin: Embed(source="assets/right_hover.png");
    downSkin: Embed(source="assets/right_down.png");
   }
</mx:Style>

Reply via email to