如何访问自定义ButtonBar按钮?

时间:2013-10-21 21:55:41

标签: flex flex-spark

我已经创建了一个自定义Spark ButtonBar。我想在其中显示通知标记(即显示标签有多少通知的数字),但我无法弄清楚如何从外部访问按钮。

我看过像这样的问题:Hide a Button in a ButtonBar

但这似乎不起作用,我回来的对象:

  

btnBarNav.dataGroup.getElementAt(0);

不是Button或我的皮肤的实例,它是“GameMenuBarInnerClass0”。

有关如何最好地将一些数据传递到我的皮肤以显示与该按钮相关的数字的任何建议吗?

1 个答案:

答案 0 :(得分:1)

请勿尝试直接访问和操作视图(您的按钮)。改为使用模型+数据绑定。

创建自定义皮肤

看起来你已经这样做了,但仅供参考:你需要ButtonBar的自定义皮肤,以及ButtonBarButtons的三个皮肤:一个用于第一个按钮,一个用于最后一个,一个用于所有按钮介于两者之间。

使用数据提供者的表示模型

创建一个包含按钮标签的演示模型,可能是一个图标以及按钮中需要的任何其他信息。例如:

class ButtonModel {
    public var label:String;
    [Bindable]
    public var messageCount:int = 0;
}

请注意,我使messageCount绑定,以便我们以后可以绑定它。

将这些模型的集合指定为ButtonBar

的数据提供者
<s:ButtonBar>
    <s:ArrayList>
        <rs:ButtonModel label="Button 1"/>
        <rs:ButtonModel label="Button 2"/>
    </s:ArrayList>
</s:ButtonBar>

在自定义外观中使用演示文稿属性

在自定义按钮外观中,您现在可以绑定到此演示模型的属性。 hostcomponent(ButtonBarButton)具有保存此模型实例的属性data

<s:Label id="labelDisplay"/>
<s:Label text="{hostComponent.data.messageCount}"/>

每当您更新模型上的messageCount属性时,它都会自动反映在按钮中。