同一个Button skin flex的不同图标

Question

我的按钮有下面的皮肤：

<?xml version="1.0" encoding="utf-8"?><s:SparkSkin 
xmlns:fx="http://ns.adobe.com/mxml/2009" 
xmlns:s="library://ns.adobe.com/flex/spark" 
xmlns:mx="library://ns.adobe.com/flex/halo"
>
<!-- host component -->
<fx:Metadata>
    <![CDATA[
    [HostComponent("spark.components.Button")]
    ]]>
</fx:Metadata>  

<!-- states -->
<s:states>
    <s:State name="up" />
    <s:State name="over" stateGroups="overStates"/>
    <s:State name="down" stateGroups="overStates" />
    <s:State name="disabled" />
</s:states>

.....
 </s:SparkSkin>

我想知道如何为具有相同皮肤的不同按钮添加不同的图像。

Answer 1

两步：

1. 让您的自定义皮肤扩展 SparkButtonSkin 而不是简单地 SparkSkin。
2. 设置按钮的icon 样式

---

 <s:Button icon="@Embed('/path/to/my-icon.png')" 
           skinClass="path.to.MyButtonSkin" />

Answer 2

您可以设置图像的路径（完整路径或相对于您所在的路径）

<s:Button label="Spark Button with dynamic icon" icon="assets/asterisk_orange.png" />

或者嵌入图片

<s:Button label="Spark Button with inline embedded icon" icon="@Embed('assets/asterisk_orange.png')" />