Compressione del layout
Scaricare l'esempioLa compressione del layout rimuove i layout specificati dalla struttura ad albero visuale nel tentativo di migliorare le prestazioni di rendering della pagina. Questo articolo illustra come abilitare la compressione del layout e i vantaggi che può offrire.
Panoramica
Xamarin.Forms esegue il layout usando due serie di chiamate di metodo ricorsive:
- Il layout inizia nella parte superiore della struttura ad albero visuale con una pagina e procede attraverso tutti i rami della struttura ad albero visuale per includere ogni elemento visivo in una pagina. Gli elementi padre di altri elementi sono responsabili del dimensionamento e del posizionamento dei figli rispetto a se stessi.
- Invalidazione è il processo in base al quale una modifica di un elemento in una pagina attiva un nuovo ciclo di layout. Gli elementi vengono considerati non validi quando non hanno più le dimensioni o la posizione corrette. Ogni elemento nella struttura ad albero visuale con elementi figlio viene avvisato ogni volta che uno dei relativi elementi figlio cambia le dimensioni. Pertanto, una modifica delle dimensioni di un elemento nella struttura ad albero visuale può causare modifiche che si increspano nell'albero.
Per altre informazioni sulle prestazioni Xamarin.Forms del layout, vedere Creazione di un layout personalizzato.
Il risultato del processo di layout è una gerarchia di controlli nativi. Tuttavia, questa gerarchia include renderer e wrapper aggiuntivi per i renderer della piattaforma, gonfiando ulteriormente l'annidamento della gerarchia di visualizzazione. Maggiore è il livello di annidamento, maggiore è la quantità di lavoro da Xamarin.Forms eseguire per visualizzare una pagina. Per i layout complessi, la gerarchia di visualizzazione può essere sia profonda che ampia, con più livelli di annidamento.
Si consideri ad esempio il pulsante seguente dell'applicazione di esempio per l'accesso a Facebook:
Questo pulsante viene specificato come controllo personalizzato con la gerarchia di visualizzazione XAML seguente:
<ContentView ...>
<StackLayout>
<StackLayout ...>
<AbsoluteLayout ...>
<Button ... />
<Image ... />
<Image ... />
<BoxView ... />
<Label ... />
<Button ... />
</AbsoluteLayout>
</StackLayout>
<Label ... />
</StackLayout>
</ContentView>
La gerarchia di visualizzazione nidificata risultante può essere esaminata con l'albero visuale attivo. In Android la gerarchia di visualizzazione nidificata contiene 17 visualizzazioni:
La compressione del layout, disponibile per Xamarin.Forms le applicazioni nelle piattaforme iOS e Android, mira a rendere flat l'annidamento della visualizzazione rimuovendo i layout specificati dalla struttura ad albero visuale, che può migliorare le prestazioni di rendering delle pagine. Il vantaggio delle prestazioni offerto varia a seconda della complessità di una pagina, della versione del sistema operativo in uso e del dispositivo in cui è in esecuzione l'applicazione. Tuttavia, le prestazioni miglioreranno in modo più evidente nei dispositivi meno recenti.
Nota
Anche se questo articolo è incentrato sui risultati dell'applicazione della compressione del layout in Android, è ugualmente applicabile a iOS.
Compressione del layout
In XAML la compressione del layout può essere abilitata impostando la CompressedLayout.IsHeadless proprietà associata su true in una classe di layout:
<StackLayout CompressedLayout.IsHeadless="true">
...
</StackLayout>
In alternativa, può essere abilitata in C# specificando l'istanza di layout come primo argomento per il CompressedLayout.SetIsHeadless metodo :
CompressedLayout.SetIsHeadless(stackLayout, true);
Importante
Poiché la compressione del layout rimuove un layout dalla struttura ad albero visuale, non è adatto per i layout con aspetto visivo o che ottengono l'input tocco. Pertanto, i layout che impostano VisualElement le proprietà , ad esempio BackgroundColor, RotationIsVisible, Scale, TranslationX e TranslationY che accettano movimenti, non sono candidati per la compressione del layout. Tuttavia, l'abilitazione della compressione del layout in un layout che imposta le proprietà dell'aspetto visivo o che accetta movimenti non genererà un errore di compilazione o di runtime. Al contrario, la compressione del layout verrà applicata e le proprietà dell'aspetto visivo e il riconoscimento dei movimenti avrà esito negativo in modo invisibile all'utente.
Per il pulsante Facebook, la compressione del layout può essere abilitata nelle tre classi di layout:
<StackLayout CompressedLayout.IsHeadless="true">
<StackLayout CompressedLayout.IsHeadless="true" ...>
<AbsoluteLayout CompressedLayout.IsHeadless="true" ...>
...
</AbsoluteLayout>
</StackLayout>
...
</StackLayout>
In Android si ottiene una gerarchia di visualizzazione nidificata di 14 visualizzazioni:
Rispetto alla gerarchia di visualizzazione nidificata originale di 17 visualizzazioni, ciò rappresenta una riduzione del numero di visualizzazioni del 17%. Anche se questa riduzione può risultare insignificante, la riduzione della visualizzazione su un'intera pagina può essere più significativa.
Renderer veloci
I renderer veloci riducono l'inflazione e il rendering dei costi dei Xamarin.Forms controlli in Android appiattindo la gerarchia di visualizzazione nativa risultante. Ciò migliora ulteriormente le prestazioni creando un minor numero di oggetti, che a sua volta comporta un albero visivo meno complesso e meno uso della memoria. Per altre informazioni sui renderer veloci, vedere Renderer veloci.
Per il pulsante Facebook nell'applicazione di esempio, la combinazione di compressione del layout e renderer veloci produce una gerarchia di visualizzazione annidata di 8 visualizzazioni:
Rispetto alla gerarchia di visualizzazione nidificata originale di 17 visualizzazioni, ciò rappresenta una riduzione del 52%.
L'applicazione di esempio contiene una pagina estratta da un'applicazione reale. Senza compressione del layout e renderer veloci, la pagina produce una gerarchia di visualizzazione nidificata di 130 visualizzazioni in Android. L'abilitazione di renderer rapidi e la compressione del layout nelle classi di layout appropriate riduce la gerarchia di visualizzazione annidata a 70 visualizzazioni, con una riduzione del 46%.
Riepilogo
La compressione del layout rimuove i layout specificati dalla struttura ad albero visuale nel tentativo di migliorare le prestazioni di rendering della pagina. Il miglioramento delle prestazioni offerto varia in base alla complessità di una pagina, alla versione del sistema operativo in uso e al dispositivo in cui viene eseguita l'applicazione. Tuttavia, le prestazioni miglioreranno in modo più evidente nei dispositivi meno recenti.