Condividi tramite


CollectionView

Sfoglia l'esempio. Sfoglia l'esempio

L'interfaccia utente dell'app multipiattaforma .NET (.NET MAUI) CollectionView è una visualizzazione per la presentazione di elenchi di dati usando specifiche di layout diverse. Mira a offrire un'alternativa più flessibile ed efficiente a ListView.

Lo screenshot seguente mostra un CollectionView oggetto che usa una griglia verticale a due colonne e consente più selezioni:

Screenshot di un layout griglia verticale di CollectionView.

CollectionView deve essere utilizzato per presentare elenchi di dati che richiedono lo scorrimento o la selezione. Un layout associabile può essere usato quando i dati da visualizzare non richiedono lo scorrimento o la selezione. Per altre informazioni, vedere BindableLayout.

Annotazioni

In iOS e Mac Catalyst, i gestori ottimizzati facoltativi in .NET 9 sono i gestori predefiniti per CollectionView in .NET 10, offrendo prestazioni e stabilità migliori.

Ripristinare il comportamento di .NET 9

È consigliabile usare il nuovo gestore per CollectionView, ma se si vuole rifiutare esplicitamente questo comportamento e ripristinare il gestore .NET 9, è possibile usare il codice seguente in MauiProgram.cs.

#if IOS || MACCATALYST
builder.ConfigureMauiHandlers(handlers =>
{
    handlers.AddHandler<Microsoft.Maui.Controls.CollectionView, Microsoft.Maui.Controls.Handlers.Items.CollectionViewHandler>();
});
#endif

Differenze di CollectionView e ListView

Anche se le CollectionView API e ListView sono simili, esistono alcune differenze significative:

  • CollectionView ha un modello di layout flessibile, che consente di presentare i dati verticalmente o orizzontalmente, in un elenco o in una griglia.
  • CollectionView supporta la selezione singola e multipla.
  • CollectionView non ha alcun concetto di cellule. Viene invece usato un modello di dati per definire l'aspetto di ogni elemento di dati nell'elenco.
  • CollectionView utilizza automaticamente la virtualizzazione fornita dai controlli nativi sottostanti.
  • CollectionView riduce la superficie DELL'API di ListView. Molte proprietà ed eventi di ListView non sono presenti in CollectionView.
  • CollectionView non include separatori predefiniti.
  • CollectionView genererà un'eccezione se il relativo ItemsSource viene aggiornato fuori dal thread dell'interfaccia utente.

Passare da ListView a CollectionView

ListView È possibile eseguire la migrazione delle implementazioni alle CollectionView implementazioni con l'aiuto della tabella seguente:

Concetto ListView API CollectionView
Data ItemsSource Un CollectionView oggetto viene popolato con i dati impostandone la ItemsSource proprietà . Per altre informazioni, vedere Popolare un oggetto CollectionView con i dati.
Aspetto dell'elemento ItemTemplate L'aspetto di ogni elemento di un CollectionView oggetto può essere definito impostando la ItemTemplate proprietà su un oggetto DataTemplate. Per altre informazioni, vedere Definire l'aspetto dell'elemento.
Cellule TextCell, ImageCell, ViewCell CollectionView non ha alcun concetto di cellule, e quindi nessun concetto di indicatori di divulgazione. Viene invece usato un modello di dati per definire l'aspetto di ogni elemento di dati nell'elenco.
Separatori di riga SeparatorColor, SeparatorVisibility CollectionView non include separatori predefiniti. Questi elementi possono essere forniti, se necessario, nel modello di elemento.
Selection SelectionMode, SelectedItem CollectionView supporta la selezione singola e multipla. Per altre informazioni, vedere Configurare la selezione di elementi CollectionView.
Altezza riga HasUnevenRows, RowHeight In un CollectionViewoggetto l'altezza della riga di ogni elemento è determinata dalla ItemSizingStrategy proprietà . Per altre informazioni, vedere Dimensionamento degli elementi.
Caching CachingStrategy CollectionView usa automaticamente la virtualizzazione fornita dai controlli nativi sottostanti.
Intestazioni e piè di pagina Header, HeaderElement, HeaderTemplate, Footer, FooterElementFooterTemplate CollectionView può presentare un'intestazione e un piè di pagina che scorrono con gli elementi nell'elenco, tramite le proprietà Header, Footer, HeaderTemplate e FooterTemplate. Per altre informazioni, vedere Intestazioni e piè di pagina.
Grouping GroupDisplayBinding, GroupHeaderTemplate, GroupShortNameBindingIsGroupingEnabled CollectionView visualizza correttamente i dati raggruppati impostandone la IsGrouped proprietà su true. Le intestazioni e i piè di pagina del gruppo possono essere personalizzati impostando le proprietà GroupHeaderTemplate e GroupFooterTemplate su oggetti DataTemplate. Per altre informazioni, vedere Visualizzare i dati raggruppati in un controllo CollectionView.
Trascina per aggiornare IsPullToRefreshEnabled, IsRefreshing, RefreshAllowed, RefreshCommandRefreshControlColor, , BeginRefresh()EndRefresh() La funzionalità scorrere per aggiornare è supportata impostando un CollectionView come figlio di un RefreshView. Per altre informazioni, vedere Eseguire il pull per l'aggiornamento.
Elementi del menu di scelta rapida ContextActions Le voci del menu contestuale sono supportate impostando un SwipeView come vista radice nel DataTemplate che definisce l'aspetto di ciascun elemento dei dati nel CollectionView. Per altre informazioni, vedere Menu di scelta rapida.
Scorrimento ScrollTo() CollectionView definisce ScrollTo i metodi, che consentono di scorrere gli elementi nella visualizzazione. Per ulteriori informazioni, consultare Controllare lo scorrimento in una CollectionView.