0

2つのコンテナがある素敵な状態遷移を作成しようとしています（以下の例では、パネルを使用しています）。

状態が変化したら、上部パネルをフェードアウトしてから、下部パネルを画面の上部に移動し、その下に新しい「下部」パネルをフェードインします。

以下のコードでは、フェードは正常に機能していますが、パネルはボックスの上部に移動せず、トランジションなしで新しい位置に移動します。

また、「逆」遷移はまったく発生しません。autoReverseをtrueに設定しようとしました。また、反対のトランジションを作成しようとしましたが、どちらも結果がなく、トランジションもありませんでした。

VBoxのVGroup（すべてが発生する）を置き換えると、わずかに良い結果が得られ、遷移は1つの方法で機能します。逆遷移はまだまったく機能しません。

<?xml version="1.0" encoding="utf-8"?>


<fx:Script>
    <![CDATA[
        private function switchMode():void
        {
            if (currentState == "up")
                currentState = "down";
            else
                currentState = "up";
        }
    ]]>
</fx:Script>

<s:states>
    <s:State name="up" />
    <s:State name="down" />
</s:states>

<s:transitions>
    <s:Transition fromState="up" toState="down">
        <s:Sequence>
            <s:Fade target="{upperGrid}" />
            <s:RemoveAction target="{upperGrid}" />
            <s:Move target="{panel1}" />
            <s:AddAction target="{lowerGrid}" />
            <s:Fade target="{lowerGrid}" />
        </s:Sequence>
    </s:Transition>

    <s:Transition fromState="down" toState="up">
        <s:Sequence>
            <s:Fade target="{lowerGrid}" />
            <s:RemoveAction target="{lowerGrid}" />
            <s:Move target="{panel1}" />
            <s:AddAction target="{upperGrid}" />
            <s:Fade target="{upperGrid}" />
        </s:Sequence>
    </s:Transition>
</s:transitions>

<s:VGroup width="100%" height="100%" top="10" left="10" right="10" bottom="10">
    <s:Panel id="upperGrid" width="100%" height="100%" includeIn="up" title="upper panel" />
    <s:Panel id="panel1" width="100%" title="Panel">
        <s:Button label="Switch mode" click="switchMode()" />
    </s:Panel>
    <s:Panel id="lowerGrid" width="100%" height="100%" includeIn="down" title="lower panel" />
</s:VGroup>

VGroupまたはVBoxを削除し、絶対位置を使用すると、遷移は正常に機能します。

<s:Panel id="upperGrid" left="10" right="10" top="10" bottom="{panel1.height + 20}" includeIn="up" title="upper panel" />
<s:Panel id="panel1" left="10" right="10" top.up="{upperGrid.height + 20}" top.down="10" title="Panel">
    <s:Button label="Switch mode" click="switchMode()" />
</s:Panel>
<s:Panel id="lowerGrid" left="10" right="10" top="{panel1.height + 20}" bottom="10" includeIn="down" title="lower panel" />

このような移動トランジションが必要な場合は、常に絶対ポジショニングを使用する必要がありますか、それともincludeInおよびexcludeFromプロパティと組み合わせてVGroupまたはVBoxでこれらのトランジションを使用できますか？もしそうなら、上記の例でそれをどのように修正できますか？

4

1 に答える 1

0

問題は、子を「レイアウト」するためのコンテナを使用していることです。子が現在エフェクトにあるときを認識し、完了するまでそれらに触れない独自のレイアウトを作成するか、代わりに絶対配置レイアウト コンテナー (グループなど) を使用することができます。

于 2011-05-11T15:37:26.343 に答える