как переключить маску на группу в Flex (работает для BorderContainer)

Question

Вот мое тестовое приложение:

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx" 
               creationComplete="initApp()"
               width="800" height="800">

    <fx:Script>
        <![CDATA[
            protected function initApp():void {
                spe.graphics.clear();
                spe.graphics.lineStyle(1,0xff9900);
                spe.graphics.beginFill(0xff9900,0.5);
                spe.graphics.drawRect(-50,-75,100,100);
            }
        ]]>
    </fx:Script>

    <s:CheckBox id="showMask" label="Show Mask"/>
    <s:Group id="graphArea" width="500"  height="500"
             horizontalCenter="0" verticalCenter="0"
             mask="{(showMask.selected) ? maskCanvas : null}">
        <s:SpriteVisualElement id="spe"/>
        <s:SkinnableContainer id="maskCanvas" alpha="0" width="100%" height="100%"/>
    </s:Group>
</s:Application>

Я ожидаю, что маска будет применена, когда установлен флажок, и удалена, если она не установлена.Но это не похоже на работу.

Однако, когда вы переходите на, это работает как шарм.Может кто-нибудь объяснить мне, почему?

Примечание. В моем реальном приложении я применяю это в скине к компоненту, расширяющему SkinnableComponent, который не может использовать BorderContainer, поэтому решение этой проблемы было бы замечательно.

Answer 1

В документации по маске имущества Группы сказано: "Устанавливает маску. Маска будет добавлена ​​в список отображения. Маска не должна быть ни в списке отображения, ни в массиве элементов."

Попробуйте переместить маску в, и она должна работать правильно.

<fx:Declarations>
    <s:SkinnableContainer id="maskCanvas" 
                       x="{spe.x}"
                       y="{spe.y}"
                       width="40" height="40"
                       alpha="0"
                       backgroundColor="white"
                       />
</fx:Declarations>

<s:CheckBox id="showMask" label="Show Mask"/>

<s:Group id="graphArea" width="500"  height="500"
         horizontalCenter="0" verticalCenter="0"
         mask="{(showMask.selected) ? maskCanvas : null}">
    <s:SpriteVisualElement id="spe"/>
</s:Group>

Надеюсь, это поможет.

Blaze