Vue d’ensemble de ListView

Le contrôle ListView fournit l’infrastructure pour afficher un ensemble d’éléments de données à l’aide d’une disposition ou d’une vue différente. Par exemple, un utilisateur peut souhaiter afficher des éléments de données dans une table et trier ses colonnes.

Remarque

Les types référencés dans cet article sont disponibles dans la section Référence de code.

Qu’est-ce qu’un ListView ?

Le ListView dérive de ListBox. En règle générale, ses éléments sont membres d’une collection de données et sont représentés en tant qu’objets ListViewItem. Un ListViewItem est un ContentControl et ne peut contenir qu’un seul élément enfant. Toutefois, cet élément enfant peut être n’importe quel élément visuel.

Définition d’un mode d’affichage pour un ListView

Pour spécifier un mode d’affichage pour le contenu d’un contrôle ListView, vous définissez la propriété View. Un mode d’affichage fourni par Windows Presentation Foundation (WPF) est GridView, qui affiche une collection d’éléments de données dans une table qui a des colonnes personnalisables.

L’exemple suivant montre comment définir un GridView pour un contrôle ListView qui affiche des informations sur les employés.


<ListView ItemsSource="{Binding Source={StaticResource EmployeeInfoDataSource}}">

    <ListView.View>

        <GridView AllowsColumnReorder="true" ColumnHeaderToolTip="Employee Information">

            <GridViewColumn DisplayMemberBinding="{Binding Path=FirstName}" Header="First Name" Width="100"/>

            <GridViewColumn DisplayMemberBinding="{Binding Path=LastName}" Width="100">
                <GridViewColumnHeader>Last Name
                    <GridViewColumnHeader.ContextMenu>
                        <ContextMenu MenuItem.Click="LastNameCM_Click" Name="LastNameCM">
                            <MenuItem Header="Ascending" />
                            <MenuItem Header="Descending" />
                        </ContextMenu>
                    </GridViewColumnHeader.ContextMenu>
                </GridViewColumnHeader>
            </GridViewColumn>

            <GridViewColumn DisplayMemberBinding="{Binding Path=EmployeeNumber}" Header="Employee No." Width="100"/>
        </GridView>

    </ListView.View>
</ListView>

L’illustration suivante montre comment les données apparaissent pour l’exemple précédent.

Capture d’écran montrant une liste ListView avec la sortie GridView.

Vous pouvez créer un mode d’affichage personnalisé en définissant une classe qui hérite de la classe ViewBase. La classe ViewBase fournit l’infrastructure dont vous avez besoin pour créer une vue personnalisée. Pour plus d’informations sur la création d’un affichage personnalisé, consultez Créer un mode d’affichage personnalisé pour unListView.

Liaison de données à un ListView

Utilisez les propriétés Items et ItemsSource pour spécifier des éléments pour un contrôle ListView. L’exemple suivant définit la propriété ItemsSource sur une collection de données appelée EmployeeInfoDataSource.

<ListView ItemsSource="{Binding Source={StaticResource EmployeeInfoDataSource}}">

Dans un GridView, les objets GridViewColumn sont liés aux champs de données spécifiés. L’exemple suivant lie un objet GridViewColumn à un champ de données en spécifiant un Binding pour la propriété DisplayMemberBinding.

GridViewColumn gvc1 = new GridViewColumn();
gvc1.DisplayMemberBinding = new Binding("FirstName");
gvc1.Header = "FirstName";
gvc1.Width = 100;

Dim gvc1 As New GridViewColumn()
gvc1.DisplayMemberBinding = New Binding("FirstName")
gvc1.Header = "FirstName"
gvc1.Width = 100

<GridViewColumn DisplayMemberBinding="{Binding Path=FirstName}" Header="First Name" Width="100"/>

Vous pouvez également spécifier une Binding dans le cadre d’une définition de DataTemplate que vous utilisez pour styler les cellules d’une colonne. Dans l’exemple suivant, le DataTemplate identifié par une ResourceKey définit la Binding d’une GridViewColumn. Notez que cet exemple ne définit pas la DisplayMemberBinding, car cela prend le pas sur CellTemplate.

<DataTemplate x:Key="myCellTemplateMonth">
  <DockPanel>
    <TextBlock Foreground="DarkBlue" HorizontalAlignment="Center">
      <TextBlock.Text>
        <Binding Path="Month"/>
      </TextBlock.Text>
    </TextBlock>
  </DockPanel>
</DataTemplate>

<GridViewColumn Header="Month" Width="80"
      CellTemplate="{StaticResource myCellTemplateMonth}"/>

Style d’un ListView qui implémente un GridView

Le contrôle ListView contient des objets ListViewItem, qui représentent les éléments de données affichés. Vous pouvez utiliser les propriétés suivantes pour définir le contenu et le style des éléments de données :

Sur le contrôle ListView, utilisez les propriétés ItemTemplate, ItemTemplateSelectoret ItemContainerStyle.
Sur le contrôle ListViewItem, utilisez les propriétés ContentTemplate et ContentTemplateSelector.

Pour éviter les problèmes d’alignement entre les cellules d’un GridView, n’utilisez pas le ItemContainerStyle pour définir des propriétés ou ajouter du contenu qui affecte la largeur d’un élément dans un ListView. Par exemple, un problème d’alignement peut se produire lorsque vous définissez la propriété Margin dans le ItemContainerStyle. Pour spécifier des propriétés ou définir du contenu qui affecte la largeur des éléments dans un GridView, utilisez les propriétés de la classe GridView et de ses classes associées, telles que GridViewColumn.

Pour plus d’informations sur l’utilisation de GridView et de ses classes associées, consultez Vue d’ensemble de GridView.

Si vous définissez un ItemContainerStyle pour un contrôle ListView et définissez également un ItemTemplate, vous devez inclure un ContentPresenter dans le style pour que le ItemTemplate fonctionne correctement.

N’utilisez pas les propriétés HorizontalContentAlignment et VerticalContentAlignment pour le contenu ListView affiché par un GridView. Pour spécifier l’alignement du contenu dans une colonne d’un GridView, définissez une CellTemplate.

Deux contrôles ListView ne peuvent pas partager le même mode d’affichage en même temps. Si vous essayez d’utiliser le même mode d’affichage avec plusieurs contrôles ListView, une exception se produit.

Pour spécifier un mode d’affichage qui peut être utilisé simultanément par plusieurs ListView, utilisez des modèles ou des styles.

Création d’un mode d’affichage personnalisé

Les vues personnalisées comme GridView sont dérivées de la classe abstraite ViewBase, qui fournit les outils permettant d’afficher les éléments de données représentés sous forme d’objets ListViewItem.

Référence de code

Les objets suivants sont référencés dans cet article :

Collecte des données EmployeeInfoDataSource. Si vous utilisez Visual Basic .NET, l’élément Window est déclaré légèrement différent de ce que vous voyez dans l’exemple de code :

<Window x:Class="SDKSample.Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Loaded="OnLoad"
        xmlns:ds="clr-namespace:SDKSample">

    <Window.Resources>
        <ObjectDataProvider x:Key="EmployeeInfoDataSource" ObjectType="{x:Type ds:myEmployees}" />
    </Window.Resources>

EmployeeInfo classe, qui est utilisée comme type pour la collecte de données EmployeeInfoDataSource.

public class EmployeeInfo
{
    private string _firstName;
    private string _lastName;
    private string _employeeNumber;

    public string FirstName
    {
        get {return _firstName;}
        set {_firstName = value;}
    }

    public string LastName
    {
        get {return _lastName;}
        set {_lastName = value;}
    }

    public string EmployeeNumber
    {
        get {return _employeeNumber;}
        set {_employeeNumber = value;}
    }

    public EmployeeInfo(string firstname, string lastname, string empnumber)
    {
        _firstName = firstname;
        _lastName = lastname;
        _employeeNumber = empnumber;
    }
}

Public Class EmployeeInfo
    Private _firstName As String
    Private _lastName As String
    Private _employeeNumber As String

    Public Property FirstName() As String
        Get
            Return _firstName
        End Get
        Set(ByVal value As String)
            _firstName = value
        End Set
    End Property

    Public Property LastName() As String
        Get
            Return _lastName
        End Get
        Set(ByVal value As String)
            _lastName = value
        End Set
    End Property

    Public Property EmployeeNumber() As String
        Get
            Return _employeeNumber
        End Get
        Set(ByVal value As String)
            _employeeNumber = value
        End Set
    End Property

    Public Sub New(ByVal firstname As String, ByVal lastname As String, ByVal empnumber As String)
        _firstName = firstname
        _lastName = lastname
        _employeeNumber = empnumber
    End Sub
End Class

Voir aussi

GridView
ListView
ListViewItem
Binding
Vue d’ensemble GridView
Sujets de type "comment faire"
Contrôles

Commentaires

Cette page a-t-elle été utile ?

Last updated on 2025-05-07