TileGroup: aggiorna il layout al ridimensionamento

Question

Non sono nuovo all'utilizzo di MXML per la costruzione di app.

Fondamentalmente, sto costruendo un elenco di piastrelle (6 di esse) usando Tilegroup. Quando si inizializza su Portrait View, sembra fantastico (3 nella prima riga e 3 sulla seconda).

Tuttavia, quando cambio l'orientamento, voglio che le piastrelle si ridisegnino in base alla nuova larghezza e altezza.

Da Stack Overflow, ho scoperto che posso ascoltare l'evento ridimensionato. Ma non so come far ristrutturare i tilegroup.

Inizialmente, pensavo di poter usare AutoLayout per TileGroup. Ma questo non ha fatto il trucco. Sto facendo fatica a cercare una soluzione (forse non stavo usando le parole chiave giuste).

C'è una funzione che posso chiamare per ridisegnare?

O c'è un altro modo per rendere la mia piastrella reattiva all'orientamento?

Ecco il mio codice:

<components:View xmlns:fx="http://ns.adobe.com/mxml/2009" 
             xmlns:s="library://ns.adobe.com/flex/spark" xmlns:components="spark.components.*" 
             title="Forex Calculator">
<components:states>
    <s:State name="portrait"/>
    <s:State name="landscape"/>
</components:states>
<fx:Declarations>
    <!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>

<s:TileGroup id="mainGroup" includeIn="portrait, landscape" autoLayout="true">
    <s:Rect width="75" height="75">
        <s:fill>
            <s:SolidColor color="0xd54f4f"/>
        </s:fill>
    </s:Rect>
    <s:Rect width="75" height="75">
        <s:fill>
            <s:SolidColor color="0x2f977d"/>
        </s:fill>
    </s:Rect>
    <s:Rect width="75" height="75">
        <s:fill>
            <s:SolidColor color="0xfffca2"/>
        </s:fill>
    </s:Rect>
    <s:Rect width="75" height="75">
        <s:fill>
            <s:SolidColor color="0xfffca2"/>
        </s:fill>
    </s:Rect>
    <s:Rect width="75" height="75">
        <s:fill>
            <s:SolidColor color="0xfffca2"/>
        </s:fill>
    </s:Rect>
</s:TileGroup>   

Per favore consigli! Grazie!

Justin

Answer 1

Il riorganizzazione in base al ridimensionamento avviene automaticamente. Tuttavia, se non fornisci un contenitore (il tuo TileGroup In questo caso) con alcune regole di dimensionamento specifiche applicherà il suo comportamento di dimensionamento predefinito, che è quello di adattarsi al suo contenuto. Ovviamente quel contenuto non cambia se ti trovi nello stato del ritratto o del paesaggio, quindi non succede nulla.

Non sono esattamente sicuro di quello che stai cercando di fare, ma di impostazione width="100%" height="100%" allungherà il TileGroup sull'intero schermo. Cioè le sue dimensioni verranno calcolate in base alla dimensione del suo contenitore principale anziché al suo contenuto. Pertanto il numero di colonne/righe cambierà quando lo stato cambia.