Передача состояния дочерней кнопке Flex4 ButtonBar

Question

У меня есть Spark ButtonBar, который имеет собственный скин, который определяет собственный скин для требования middleButton. Мой CustomButtonBarSkin имеет пользовательское состояние, свернутое , которое я хочу передать в свой скин middleButton, чтобы он мог изменять свой дизайн.

Возможно ли это сделать? Я вижу, что мой скин кнопки может использовать parentDocument.currentState для получения минимизированного состояния, но это действительно ужасно. Есть ли способ передать скин из бара дочерней кнопке (кнопкам)?

Answer 1

Я думаю, вы должны продлить значение по умолчанию ButtonBar.Примерно так:

package
{
import mx.core.IFactory;

import spark.components.ButtonBar;

[SkinState("minimized")]
[SkinState("minimizedDisabled")]
public class MinimizableButtonBar extends ButtonBar
{
    public function MinimizableButtonBar()
    {
        super();

        itemRendererFunction = defaultButtonBarItemRendererFunction;
    }

    [SkinPart(required="true", type="mx.core.IVisualElement")]
    public var middleButtonMinimized:IFactory;

    private var _minimized:Boolean;

    [Bindable]
    public function get minimized():Boolean
    {
        return _minimized;
    }

    public function set minimized(value:Boolean):void
    {
        if (_minimized == value)
            return;

        _minimized = value;
        invalidateSkinState();
        itemRendererFunction = defaultButtonBarItemRendererFunction;
    }

    override protected function getCurrentSkinState():String
    {
        if (_minimized)
            return enabled ? "minimized" : "minimizedDisabled";
        return super.getCurrentSkinState();
    }

    private function defaultButtonBarItemRendererFunction(data:Object):IFactory
    {
        var i:int = dataProvider.getItemIndex(data);
        if (i == 0)
            return firstButton ? firstButton : (_minimized ? middleButtonMinimized : middleButton);

        var n:int = dataProvider.length - 1;
        if (i == n)
            return lastButton ? lastButton : (_minimized ? middleButtonMinimized : middleButton);

        return (_minimized ? middleButtonMinimized : middleButton);
    }
}
}

Итак, используя этот код, вы можете объявить свой собственный скин следующим образом:

<?xml version="1.0" encoding="utf-8"?>
<s:Skin alpha.disabledGroup="0.5" xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark">
    <fx:Metadata>[HostComponent("MinimizableButtonBar")]</fx:Metadata>

    <s:states>
        <s:State name="normal" />
        <s:State name="disabled" stateGroups="disabledGroup" />
        <s:State name="minimized" stateGroups="minimizedGroup" />
        <s:State name="minimizedDisabled" stateGroups="disabledGroup,minimizedGroup" />
    </s:states>

    <fx:Declarations>
        <fx:Component id="firstButton">
            <s:ButtonBarButton skinClass="spark.skins.spark.ButtonBarFirstButtonSkin" />
        </fx:Component>
        <fx:Component id="middleButton">
            <s:ButtonBarButton skinClass="spark.skins.spark.ButtonBarMiddleButtonSkin" />
        </fx:Component>
        <fx:Component id="middleButtonMinimized">
            <s:ButtonBarButton skinClass="MinimazedButtonBarMiddleButtonSkin" />
        </fx:Component>
        <fx:Component id="lastButton">
            <s:ButtonBarButton skinClass="spark.skins.spark.ButtonBarLastButtonSkin" />
        </fx:Component>
    </fx:Declarations>

    <s:DataGroup height="100%" id="dataGroup" width="100%">
        <s:layout>
            <s:ButtonBarHorizontalLayout gap="-1" />
        </s:layout>
        <s:layout.minimizedGroup>
            <s:VerticalLayout />
        </s:layout.minimizedGroup>
    </s:DataGroup>
</s:Skin>

Надеюсь, что это решит вашу проблему.

Иесли ваше свернутое состояние связано только с изменением обложки средней кнопки, вы можете удалить код, связанный со всеми состояниями, как из пользовательского компонента, так и из обложки.

Answer 2

Может быть, я не понимаю, что именно вы пытаетесь сделать, но это кажется довольно очевидным и простым для меня.Просто сделайте так, чтобы ваша обычная панель кнопок кожи установила состояние вашей средней кнопки, когда свернутое состояние активно:

<s:Skin>

<s:states>
<s:State name="minimized" />
</s:states>

<s:ButtonBarButton currentState.minimized="someState" />

</s:Skin>

Получить?

Answer 3

Мне недавно нужно было изменить скин на компоненте, основываясь на его родительском состоянии. Я использовал то же решение, что и в HTML, используя CSS. В вашем случае что-то вроде:

s|ButtonBar:minimized s|ButtonBarButton {
    skinClass: ClassReference("CustomButtonBarSkin");
}
s|ButtonBarButton {
    skinClass: ClassReference("spark.skins.spark.ButtonBarMiddleButtonSkin");
}

: свернуто - это Псевдоселектор (для штатов).

К сожалению, это не похоже на то, что ребенок подхватил (ошибка?), Если я не изменил styleName для родительского элемента при изменении состояния:

<s:Skin xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx"
    styleName.normal="foo" styleName.minimized="foo"
    >

Может быть, есть какой-то недействительный метод, который мне следовало бы вызвать вместо изменения состояния родителей, чтобы заставить ребенка забрать изменение, а просто изменить styleName на что-то фальшивое, сработавшее.

Возможно, это не очень распространенный метод в Flex, поскольку Flex 3 поддерживает только базовые селекторы CSS.

Answer 4

Я недавно работал со скином панели кнопок и хотел расширить / удалить некоторые из поведения по умолчанию.Вместо того, чтобы расширять и перезаписывать или копировать / вставлять код ButtonBar, я только что развернул свой собственный минималистичный компонент:и ButtonBarSkin - все ненужное, если вы не хотите переключать кнопки / selectedIndex.IMO - это боль в том, чтобы создавать кнопки на основе dataProvider вместо того, чтобы просто объявлять кнопки в MXML и назначать там обработчики и другие свойства.