Flex: riporta una finestra al suo stato originale

Question

Mi sto strappando i capelli ormai da una settimana o giù di lì, è tempo di cercare aiuto ...

Sto codificando una piccola app per mostrarmi il prossimo treno che lascia la stazione. Normalmente viene mostrata solo l'ora del prossimo treno, ma se si fa clic sul pulsante prefs, la finestra dell'applicazione si allarga e viene mostrato un datagrid con i treni e le ore. Facendo clic sul pulsante di chiusura in quello stato si ritorna allo stato 'start', o dovrebbe farlo.

Il problema è che il datagrid scompare, ma la finestra dell'applicazione rimane della stessa dimensione. Dovrebbe tornare alle dimensioni originali.

Ho provato molti approcci diversi, sostituendo i VBox con Canvas o Panels ma nessuno ha funzionato. In modalità progettazione, tutto funziona come previsto quando si passa da uno stato all'altro.

Questa è la prima volta che utilizzo gli stati, quindi potrei perdere qualcosa di fondamentale.

Ecco un esempio di codice: sto usando 2 stati di visualizzazione, Start e Pref.

<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" 
creationComplete="init();" 
cornerRadius="12"
currentState='Start' width="350" height="250">
<mx:states>
    <mx:State name="Start">
        <mx:AddChild>
            <mx:VBox id="box_parent" width="100%" height="100%" verticalGap="2">
                <mx:Label text="Next Train Leaves At" textAlign="center" width="100%"/>
                <mx:Label text="--:--" width="100%" height="100" fontSize="64" id="timetext" textAlign="center" fontWeight="bold"/> 
                <mx:HBox width="100%" height="25" id="hbox1">
                    <mx:Button label="Prefs"
                        id="buttonPrefs"
                        click="currentState='Prefs'"/>
                    <mx:Spacer width="70%" id="spacer1"/>
                    <mx:Button 
                        label="Next"
                        click="findNextTrain()" id="buttonNext"/>   
                </mx:HBox>      
            </mx:VBox>      
        </mx:AddChild>
        <mx:SetProperty name="layout" value="vertical"/>
        <mx:SetProperty name="width" value="350"/>
        <mx:SetProperty name="height" value="220"/>
    </mx:State>
    <mx:State name="Prefs" basedOn="Start">
        <mx:AddChild relativeTo="{box_parent}" position="lastChild">
            <mx:DataGrid height="80%" width="100%" dataProvider="{trains}" id="traindata" editable="false">
                <mx:columns>
                    <mx:DataGridColumn headerText="Station" dataField="stationid"/>
                    <mx:DataGridColumn headerText="Leave" dataField="leave"/>
                </mx:columns>
            </mx:DataGrid>
        </mx:AddChild>
        <mx:RemoveChild target="{buttonPrefs}"/>
        <mx:SetProperty target="{box_parent}" name="height" value="500"/>
        <mx:AddChild relativeTo="{spacer1}" position="before">
            <mx:Button label="Close" click="currentState='Start'"/>
        </mx:AddChild>
        <mx:SetProperty name="height" value="570"/>
    </mx:State>
</mx:states>

<mx:transitions> 
    <mx:Transition fromState="*" toState="*"> 
        <mx:Resize target="{this}" duration="500"/> 
    </mx:Transition> 
</mx:transitions> 
</mx:WindowedApplication>

Answer 1

Devo ancora trovare un modo per ripristinare uno stato in Flex ai valori forniti nell'MXML. Devi reimpostare quali valori hai bisogno di te programmaticamente. Nel caso del codice di esempio fornito, puoi ripristinare l'altezza dell'applicazione quando torni allo stato iniziale aggiungendo quanto segue nel tag WindowedApplication

currentStateChange="if(currentState == 'Start') this.height = 220"

Questo dice al tag WindowedApplication di gestire l'evento inviato dopo aver cambiato lo stato corrente per verificare se il nuovo stato corrente è Start e di impostare l'altezza della finestra se lo è.