Adobe Flex / AIR: Scrolling un sub-componente, non l'intera finestra

Question

Sto sviluppando un'applicazione con Adobe Flex e AIR, e sono stato sbattere la testa contro il muro cercando di capire come risolvere un problema di scorrimento.

La struttura di base della mia finestra principale dell'applicazione (semplificato notevolmente) è questa:

<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml"
   paddingTop="0" paddingRight="0" paddingBottom="0" paddingLeft="0"
   width="800" height="600" layout="vertical" verticalAlign="top" 
>
   <mx:VBox id="MainContainer" width="100%" height="100%">
      <mx:Panel id="Toolbars" width="100%" height="25" />
      <mx:HDividedBox width="100%" height="100%" >
         <mx:Panel id="Navigation" minWidth="200" height="100%" />
         <mx:VBox id="MainContent" width="100%">
            <mx:Panel width="100%" height="200" />
            <mx:Panel width="100%" height="200" />
            <mx:Panel width="100%" height="200" />
            <mx:Panel width="100%" height="200" />
            <mx:Panel width="100%" height="200" />
         </mx:VBox>
         <mx:Panel id="HelpContent" minWidth="200" height="100%" />
      </mx:HDividedBox>
      <mx:Panel id="FooterContent" width="100%" height="25" />
   </mx:VBox>
</mx:WindowedApplication>

Il problema è che la casella "mainContent" potrebbe contenere un elenco enorme di sottocomponenti, e la presenza di quella lunga lista provoca una barra di scorrimento verticale per apparire al più alto livello della GUI, che circonda il VBOX "MainContainer".

Sembra davvero stupido, avendo le barre di scorrimento intorno l'intera finestra dell'applicazione.

Quello che sto cercando, invece, è una soluzione in cui la barra di scorrimento viene applicato solo al VBOX "mainContent" (così come la navigazione e pannelli HelpContent, se i loro tratti di contenuti passati i limiti della finestra).

Ho trovato un domanda relativa su StackOverflow, dove la soluzione del problema è stato quello di usare 'autoLayout' e 'verticalScrollPolicy' attributi di contenitori padre.

Così ho provato ad aggiungere autoLayout = "false" e verticalScrollPolicy = "off" attributi a tutti i contenitori padre, così come verticalScrollPolicy = "on" al VBOX "mainContent". Ma il risultato finale di questo esperimento è che il contenuto è stato semplicemente ritagliato da contenitore principale (e una barra di scorrimento inutile senza il pollice è stato aggiunto al VBOX mainContent).

Qualcuno sa come risolvere questo?

Answer 1

Trovato una soluzione.

Sembra che l'unico modo per evitare che il VBox di estendere in modo aggressivo il suo spazio verticale (e costringendo i suoi genitori a crescere le barre di scorrimento) è quello di avvolgere la VBox in una tela di canapa.

C'è un piccolo componente utile qui , chiamato ScrollableVBox, che esegue la soluzione pur avendo cura di alcuni problemi bookkeping (come l'aggiunta e la rimozione di bambini al VBox, facendole passare intorno al involucro Cavas).

Answer 2

Un HBox o un VBox cercherà il più forte possibile per visualizzarne il contenuto senza barre di scorrimento. Questo costringe un contenitore padre (spesso tutta la strada fino al ricorso principale) per essere quello che deve scorrere se il contenuto è troppo grande per entrare nei limiti disponibili.

Dietro le quinte, la HBox o VBox sta fissando le proprietà measuredMinWidth e measuredMinHeight nella sua funzione di misura () in base alle dimensioni richieste dai suoi figli. Il contenitore padre onorerà che la raccomandazione e il compito di scorrimento si sposta l'elenco di visualizzazione.

La soluzione di hasseg funziona in molti casi perché si ferma il contenitore da misurare, ma è una specie di hacky. Ecco cosa si può fare senza la costruzione di sottoclassi di ricambio per i contenitori. Nell'istanza contenitore che si desidera scorrere, impostare minWidth o MinHeight a 0 . Questo avrà la precedenza sul measuredMinWidth o in measuredMinHeight di quel contenitore, permettendo al genitore di impostare la dimensione effettiva a qualcosa di più gestibile.

Answer 3

Invece di avvolgere la VBox in una tela, impostare MinHeight proprietà del VBox si desidera avere barra di scorrimento a 0.

Answer 4

Il tuo problema sembra molto simile a quella che ho lottato con un po 'di tempo fa. Ho trovato la mia risposta da questa discussione : basta disabilitare la measure() attuazione del Box

.

Questa è stata una correzione piuttosto facile, che ha funzionato perfettamente nel mio caso e non ha causato alcun "danno collaterale". I risultati possono variare.

package whatever
{
    import mx.containers.Box;

    /**
    * A Box that has no measure() implementation.
    * 
    * <p>
    * See http://old.nabble.com/-flex_india%3A3318--Size-layout-issues-with-respect-to-parent-containers-to12882767.html
   *  for more info.
    * </p>
    */
    public class NonMeasuredBox extends Box
    {
        /**
        * Constructor
        */
        public function NonMeasuredBox():void
        {
            super();
        }

        override protected function measure():void { /* disabled */ }
    }
}