CollectionView

Parcourir l’exemple

L’interface utilisateur de l’application multiplateforme .NET (.NET MAUI) CollectionView est un affichage permettant de présenter des listes de données à l’aide de différentes spécifications de disposition. Elle vise à offrir une alternative plus flexible et performante à ListView.

La capture d’écran suivante montre une CollectionView grille verticale à deux colonnes et autorise plusieurs sélections :

CollectionView doit être utilisé pour présenter des listes de données qui nécessitent un défilement ou une sélection. Une disposition pouvant être liée peut être utilisée lorsque les données à afficher ne nécessitent pas de défilement ou de sélection. Pour plus d’informations, consultez BindableLayout.

Différences entre CollectionView et ListView

Bien que les API et ListView les CollectionView API soient similaires, il existe quelques différences notables :

• CollectionView a un modèle de disposition flexible, qui permet aux données d’être présentées verticalement ou horizontalement, dans une liste ou une grille.
• CollectionView prend en charge une sélection unique et multiple.
• CollectionView n’a pas de concept de cellules. Au lieu de cela, un modèle de données est utilisé pour définir l’apparence de chaque élément de données de la liste.
• CollectionView utilise automatiquement la virtualisation fournie par les contrôles natifs sous-jacents.
• CollectionView réduit la surface d’API de ListView. De nombreuses propriétés et événements provenant de ListView ne sont pas présents dans CollectionView.
• CollectionView n’inclut pas de séparateurs intégrés.
• CollectionView lève une exception si elle ItemsSource est mise à jour hors du thread d’interface utilisateur.

Passer de ListView à CollectionView

ListView Les implémentations peuvent être migrées vers des implémentations à CollectionView l’aide du tableau suivant :

Concept	API ListView	CollectionView
Données	ItemsSource	Un CollectionView est rempli avec les données en définissant sa ItemsSource propriété. Pour plus d’informations, consultez Remplir un CollectionView avec des données.
Apparence de l’élément	ItemTemplate	L’apparence de chaque élément d’un CollectionView peut être définie en définissant la ItemTemplate propriété sur un DataTemplate. Pour plus d’informations, consultez Définir l’apparence de l’élément.
Cellules	TextCell, , ImageCellViewCell	CollectionView n’a pas de concept de cellules et, par conséquent, aucun concept d’indicateurs de divulgation. Au lieu de cela, un modèle de données est utilisé pour définir l’apparence de chaque élément de données de la liste.
Séparateurs de lignes	SeparatorColor, SeparatorVisibility	CollectionView n’inclut pas de séparateurs intégrés. Ceux-ci peuvent être fournis, si vous le souhaitez, dans le modèle d’élément.
Sélection	SelectionMode, SelectedItem	CollectionView prend en charge une sélection unique et multiple. Pour plus d’informations, consultez Configurer la sélection d’éléments CollectionView.
Hauteur des lignes	HasUnevenRows, RowHeight	Dans un CollectionView, la hauteur de ligne de chaque élément est déterminée par la ItemSizingStrategy propriété. Pour plus d’informations, consultez Dimensionnement des éléments.
Mise en cache	CachingStrategy	CollectionView utilise automatiquement la virtualisation fournie par les contrôles natifs sous-jacents.
En-têtes et pieds de page	Header, , HeaderElement, FooterHeaderTemplate, , FooterElementFooterTemplate	CollectionViewpeut présenter un en-tête et un pied de page qui défilent avec les éléments de la liste, via les propriétés , FooterHeaderTemplateet FooterTemplate les Headerpropriétés. Pour plus d’informations, consultez En-têtes et pieds de page.
Regroupement	GroupDisplayBinding, , GroupHeaderTemplateGroupShortNameBinding, ,IsGroupingEnabled	CollectionView affiche correctement les données regroupées en définissant sa IsGrouped propriété sur true. Les en-têtes de groupe et les pieds de page de groupe peuvent être personnalisés en définissant les propriétés et GroupFooterTemplate les GroupHeaderTemplate propriétés sur DataTemplate les objets. Pour plus d’informations, consultez Afficher les données groupées dans un Objet CollectionView.
Tirer pour actualiser	IsPullToRefreshEnabled, IsRefreshing, , RefreshCommandRefreshAllowed, RefreshControlColor, , BeginRefresh(),EndRefresh()	La fonctionnalité d’extraction pour actualiser est prise en charge en définissant un CollectionView enfant d’un RefreshView. Pour plus d’informations, consultez Pull pour actualiser.
Éléments de menu contextuel	ContextActions	Les éléments de menu contextuel sont pris en charge en définissant une SwipeView vue racine dans la DataTemplate vue racine qui définit l’apparence de chaque élément de données dans le CollectionView. Pour plus d’informations, consultez Menus contextuels.
Scrolling	ScrollTo()	CollectionView définit des ScrollTo méthodes, qui défilent les éléments en mode affichage. Pour plus d’informations, consultez Contrôle de défilement dans un Objet CollectionView.