Question

我是Flex 4菜鸟，所以请耐心等待......

我想做类似的事情：

Main.mxml

<s:HGroup id="animals">

    <s:Button name="dog">Dog Name</s:Button>
    <s:Button name="bird">Bird Name</s:Button>
    <s:Button name="cat">Cat Name</s:Button>

</s:HGroup>

#animals s | Button

的皮肤

<?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>

    <s:BitmapImage width="104" height="54" source="@Embed('../../assets/img/animals/__PUT_HERE_BUTTON_NAME__.png')"/>

    <s:Label
    id="labelDisplay"
    textAlign="center"
    color="0xffffff"
    fontFamily="CuteFont"
    fontWeight="bold"
    fontSize="15"
    width="100%"
    top="64"
    />
</s:Skin>

我是否必须扩展Button组件或我该如何处理？

Answer 1

Add.png的位置必须位于flex项目的src目录中。如果它在其他地方，那么你需要指定Add.png及其位置。

Answer 2

使用图标属性（Object）和必需的iconBitmapImage（BitmapImage）外观部件创建自定义按钮。

图标设置器，将此属性应用于iconBitmapImage的源属性。

然后你应该可以做类似的事情：

<s:CustomButton name="dog" icon="@Embed('../../assets/img/animals/dog.png')" />

带嵌入图像的Spark按钮

2 个答案: