Question

我有两个州。当我从OFF切换到A时，它会正确调整大小，但是当我从A切换回OFF时，它会在没有平滑调整大小过渡的情况下发生。我做错了什么？

这是我的代码：

<?xml version="1.0" encoding="utf-8"?>
<s:VGroup xmlns:fx="http://ns.adobe.com/mxml/2009" 
         xmlns:s="library://ns.adobe.com/flex/spark" 
         xmlns:mx="library://ns.adobe.com/flex/mx">

  <fx:Script>
    <![CDATA[
      protected function butA_changeHandler(e:Event):void
      {       
        if ((e.target as ToggleButton).selected) {
          this.currentState="A";
        } else {
          this.currentState="off";
        }
      }
    ]]>
  </fx:Script>

  <s:states>
    <s:State name="off" />
    <s:State name="A" />
  </s:states>

  <s:transitions>
    <s:Transition fromState="off" toState="A" autoReverse="true">
      <s:Parallel duration="300">
        <s:Resize target="{content}" heightTo="{cA.height}" />
        <s:Fade targets="{cA}"/>
      </s:Parallel>
    </s:Transition>
    <s:Transition fromState="A" toState="off" autoReverse="true">
      <s:Parallel duration="300">
        <s:Resize target="{content}" heightTo="0" />
        <s:Fade targets="{cA}"/>
      </s:Parallel>
    </s:Transition>
  </s:transitions>

  <s:Group id="content" excludeFrom="off" width="100%" clipAndEnableScrolling="true">   
    <s:Group id="cA" includeIn="A" width="100%"><s:Label fontSize="70" text="A"/></s:Group>
  </s:Group>

  <s:HGroup>
    <s:ToggleButton id="butA" label="A" change="butA_changeHandler(event)"/>
  </s:HGroup>

</s:VGroup>

提前致谢，努诺

Answer 1

您应该同时使用AddAction和RemoveAction，因为在转换之前处理了includeIn和excludeFrom属性：

<s:transitions>
        <s:Transition fromState="off" toState="A" autoReverse="true">
            <s:Sequence>
                <s:AddAction target="{content}" />
                <s:Parallel duration="300">
                    <s:Resize target="{content}" heightTo="{cA.height}" />
                    <s:Fade targets="{cA}"/>
                </s:Parallel>
            </s:Sequence>

        </s:Transition>
        <s:Transition fromState="A" toState="off" autoReverse="true">
            <s:Sequence>
                <s:Parallel duration="300">
                    <s:Resize target="{content}" heightTo="0" />
                    <s:Fade targets="{cA}"/>
                </s:Parallel>
                <s:RemoveAction target="{content}" />
            </s:Sequence>
        </s:Transition>
    </s:transitions>

    <s:Group id="content" width="100%" clipAndEnableScrolling="true">   
        <s:Group id="cA" includeIn="A" width="100%"><s:Label fontSize="70" text="A"/></s:Group>
    </s:Group>

使用heightFrom和widthFrom从您想要的尺寸开始调整大小，使它们实际上有效。

*注意：使用includeIn =“A”表示您也暗示conent将具有excludeFrom =“OFF”属性。这意味着您将无法混合Add / RemoveAction和includeIn / excludeFrom（一个用于添加视图，另一个用于删除视图）。

Answer 2

设置为true的

autoreverse在第二次转换时必须是多余的。它已经将A定义为关闭。只需在第一次转换中添加heightFrom即可。

在Flex 4中，状态转换不会在两个方向上调整大小

2 个答案: