Add icon on spark button skin

FlyingCat picture FlyingCat · Jun 11, 2010 · Viewed 9.7k times · Source

I am trying to add a different icon each of my buttons. I have my skin file ready but not sure if I have to create a different skin class for each button. It sounds inefficient. Any suggestions?

<s:Button id="pass"
    width="110"
    height="35"
    fontWeight="bold" 
    fontSize="12" 
    fontFamily="arial" 
    label="Past Track" 
    click="pass_clickHandler(event)" 
    skinClass="skins.CustomSkin"/>      
<s:Button id="future" 
    width="110"
    height="20"
    fontWeight="bold" 
    fontSize="12" 
    fontFamily="arial" 
    label="Future Plan"
    click="future_clickHandler(event)"
    skinClass="skins.CustomSkin"/>

The skin:

<!-- layer 2: fill -->
<!--- @private -->
<s:Rect id="fill" left="1" right="1" top="1" bottom="1" radiusX="2">
    <s:fill>
        <s:LinearGradient rotation="90">
            <s:GradientEntry color="#304fd7" 
                             color.over="#4b6bf6" 
                             color.down="0xAAAAAA" 
                             alpha="0.85" />
            <s:GradientEntry color="#1f38a3" 
                             color.over="#3653cf" 
                             color.down="0x929496" 
                             alpha="0.85" />
        </s:LinearGradient>
    </s:fill>
</s:Rect>

<!-- icon --> // I could add my icon here but that would make me create  
              // a different icon image for different button

Answer

JeffryHouser picture JeffryHouser · Jun 11, 2010

It is not built in, but a few folks have created components that support icons in Spark Buttons:

http://themorphicgroup.net/blog/?p=83
http://www.andymcintosh.com/?p=179