0
我有此IconButton：Embending圖像
類
package extra {
import spark.components.Button;
import spark.primitives.BitmapImage;
public class IconButton extends Button {
private var _icon:Class;
[SkinPart(required="false")]
public var iconElement:BitmapImage;
public function get icon():Class {
return _icon;
}
public function set icon(val:Class):void {
_icon = val;
if (iconElement != null) {
iconElement.source = _icon;
}
}
override protected function partAdded(partName:String, instance:Object):void {
super.partAdded(partName, instance);
if (icon !== null && instance == iconElement) {
iconElement.source = icon;
}
}
}
}
皮膚
<?xml version="1.0" encoding="utf-8"?>
<s:Skin xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" minWidth="40" minHeight="22">
<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>
<!-- background -->
<s:BitmapImage id="iconElement" width="104" height="54"/>
<!-- label -->
<s:Label
id="labelDisplay"
textAlign="center"
color="0xffffff"
fontFamily="AudiNormal"
fontWeight="bold"
fontSize="15"
width="100%"
top="64"
/>
</s:Skin>
CSS
e|IconButton {
skinClass: ClassReference('skins.IconButton');
}
與偉大工程：
MXML
<extra:IconButton icon="@Embed('../assets/img/animals/dog.png')">Dog Name</extra:IconButton>
但我怎麼能做到這一點？：
MXML
<extra:IconButton styleName="dog">Dog Name</extra:IconButton>
CSS
e|IconButton {
skinClass: ClassReference('skins.IconButton');
}
.dog {
icon: Embed('../assets/img/animals/dog.png');
}