对于Flex 4.6 Button,可以定义标签和图标:
<s:Button icon="{@Embed('assets/icon.png'}" label="Do the dance" />
对应的皮肤部分是:
iconDisplay:BitmapImage
和labelDisplay:IDisplayText
,由组件(adobe ref)设置。它们在ButtonBase.as中定义spark.components.supportClasses.ButtonBase
//--------------------------------------------------------------------------
//
// Skin parts
//
//--------------------------------------------------------------------------
[SkinPart(required="false")]
/**
* A skin part that defines an optional icon for the button.
*
* @langversion 3.0
* @playerversion Flash 10.1
* @playerversion AIR 2.0
* @productversion Flex 4.5
*/
public var iconDisplay:BitmapImage;
[SkinPart(required="false")]
/**
* A skin part that defines the label of the button.
*
* @langversion 3.0
* @playerversion Flash 10
* @playerversion AIR 1.5
* @productversion Flex 4
*/
public var labelDisplay:IDisplayText;
spark.components.Button扩展了ButtonBase并添加了一些新样式和_emphasized属性,但未提及有关iconDisplay的任何内容。因此在我看来,用于实际绘制按钮的唯一类是外观类。如果我们转到spark.skins.spark.ButtonSkin(它是Flex使用的默认外观)(或者是?),我们将发现:
<!-- layer 8: text -->
<!--- @copy spark.components.supportClasses.ButtonBase#labelDisplay -->
<s:Label id="labelDisplay"
textAlign="center"
maxDisplayedLines="1"
horizontalCenter="0" verticalCenter="1" verticalAlign="middle"
left="10" right="10" top="2" bottom="2">
</s:Label>
这样可以显示标签,但是皮肤没有
<s:BitmapImage id="iconDisplay">
,因此我不明白当没有容器显示时该图标如何显示? 最佳答案
这是因为ButtonSkin
扩展了SparkButtonSkin
,后者已将iconDisplay放置在iconGroup中,并与ConstructIconParts()一起显示。由于用于扩展类的mxml语法(使用<s:SparkButtonSkin>
作为ButtonSkin.mxml的根节点),它不是很清楚。
在按钮中显示可扩展的FXG图标也有很好的外观:
http://hulstkamp.com/articles/flex-advanced-fxg-spark-icon-buttons/