Conseils de conception de styles pour le contrôle ListBox

Le contrôle ListBox représente une collection d’éléments. Vous pouvez renseigner le contrôle ListBox en le liant à une source de données ou en affichant des éléments non liés. Le contrôle ListBox est un contrôle d’éléments. Vous pouvez donc le renseigner avec des éléments contenant des contrôles de texte ou autres.

Comme avec tous les contrôles, vous pouvez modifier le contrôle ListBox (et chaque contrôle ListBoxItem contenu dans l’objet ListBox) de sorte qu’il paraisse très différent de son apparence par défaut. Par défaut, le contrôle ListBox se présente comme suit :

Propriétés d'intérêt du contrôle ListBox

Vous pouvez définir l’élément sélectionné dans le contrôle ListBox en définissant la propriété SelectedIndex sous Propriétés communes dans le panneau Propriétés. Une valeur de -1 permet d’afficher l’objet ListBox sans sélection. Une valeur de 0 permet d’afficher l’objet ListBox avec le premier élément sélectionné.

Pour ajouter des éléments à un contrôle ListBox, vous pouvez ajouter manuellement des objets ListBoxItem, ou vous pouvez lier une collection de données à l’objet ListBox pour que les éléments s’affichent automatiquement.

Pour plus d’informations, voir Lier un objet à des données et Création d'un échantillon de données.

Parties du modèle ListBox

Le contrôle ListBox utilise un seul modèle pour définir son apparence : le modèle ListBox. La seule partie de ce modèle remplit un rôle dans l’apparence et le comportement de l’objet ListBox auquel le modèle est appliqué.

Conseil :

Pour appliquer un style aux éléments contenus dans un contrôle ListBox, vous devez modifier d’autres modèles. Par exemple, lorsqu’un contrôle ListBox est lié aux données, le modèle utilisé pour appliquer un style aux éléments qu’il contient est un modèle d’éléments généré (modèle de données). Lorsqu’un contrôle ListBox n'est pas lié aux données, il ne comporte aucun modèle qu’il applique aux éléments qu'il contient. En revanche, vous pouvez modifier le modèle des éléments eux-mêmes, comme le modèle ListBoxItem.

D’autres objets peuvent exister dans le modèle pour personnaliser l’apparence du contrôle ListBox, mais la partie répertoriée dans le tableau suivant est liée à son comportement dans un contrat.

Pour visualiser les parties d'un modèle, ouvrez le panneau Parties lors de la modification du modèle. Dans le panneau Objets et chronologie, une icône  s’affiche en regard de tout objet qui joue le rôle d’une partie dans le panneau Parties.

Nom de la partie	Type d’objet	Description
ScrollViewer	ScrollViewer	Un objet qui affiche les éléments dans une fenêtre déroulante. Cette partie est obligatoire.

Un modèle modifié peut être appliqué à l’objet ScrollViewer dans un modèle ListBox. Des modèles modifiés peuvent être également appliqués aux objets ScrollBar de l’objet ScrollViewer. Ceci entraîne une imbrication des modèles comme suit :

	un contrôle ListBox. Le contrôle ListBox est un conteneur pour une liste d’éléments, soit liés aux éléments d’une source de données, soit affichant des objets non liés.
	un contrôle ScrollViewer à l’intérieur du modèle ListBox ;
	un élément non lié dans le contrôle ListBox.
	un contrôle ScrollBar vertical à l’intérieur du modèle ScrollViewer ;
	un contrôle Thumb vertical à l’intérieur du modèle ScrollBar ;
	un contrôle RepeatButton vertical à l’intérieur du modèle ScrollBar pour diminuer la valeur du contrôle ScrollBar par grands incréments ;
	un contrôle RepeatButton vertical à l’intérieur du modèle ScrollBar pour diminuer la valeur du contrôle ScrollBar par petits incréments.

Pour plus d’informations sur l’application des styles aux objets ScrollViewer et ScrollBar, voir Conseils de conception de styles pour le contrôle ScrollViewer et Conseils de conception de styles pour le contrôle ScrollBar.

États d’un contrôle ListBox

Par défaut, le contrôle ListBox peut être dans l’un des trois états suivants du groupe d’états ValidationStates :

Nom de l’état	Description
Valide	Aspect du contrôle ListBox lorsqu'il est valide.
InvalidUnfocused	Aspect du contrôle ListBox lorsqu'il n'est pas valide et ne possède pas le focus clavier.
InvalidFocused	Aspect du contrôle ListBox lorsqu'il n'est pas valide et possède le focus clavier.

Lorsque vous sélectionnez un état, l'enregistrement d'état est activé et les éventuelles modifications que vous apportez seront enregistrées pour cet état. Pour désactiver l’enregistrement de l’état, cliquez sur le bouton d’enregistrement  sur la planche graphique, ou sélectionnez Base dans le panneau États.

Pour convertir des objets en contrôle ListBox

Pour modifier le modèle d’un contrôle ListBox, effectuez l’une des opérations suivantes :

• Dessinez un contrôle ListBox  sur la planche graphique, puis créez une copie du modèle par défaut.

  Pour plus d’informations, voir Créer ou modifier un modèle.

• Concevez l’apparence de votre contrôle ListBox en dessinant des objets ou en important les conceptions graphiques, puis en utilisant la commande Créer un contrôle.

Si vous utilisez la commande Créer un contrôle, suivez ces étapes pour vous assurer de créer tous les objets requis par le modèle ListBox :

1. Regroupez tous les objets souhaités pour définir l’apparence de votre contrôle ListBox dans un contrôle Grid. Incluez ces objets qui ne sont pas destinés à devenir des parties du modèle.

2. Sélectionnez le nouveau contrôle Grid, puis, dans le menu Outils, cliquez sur Créer un contrôle.

3. Dans la boîte de dialogue qui s’affiche, sélectionnez ListBox, nommez votre modèle, et sélectionnez l’emplacement de stockage du modèle.

   Pour plus d’informations sur les emplacements, voir Créer une ressource.

4. Après avoir cliqué sur OK, Microsoft Expression Blend passe en mode de modification de modèle et affiche les objets qui composent votre contrôle ListBox. Vous pouvez continuer à modifier votre modèle dans ce mode. Par exemple, ajoutez ou modifiez des objets, ou sélectionnez un état dans le panneau États pour modifier l’apparence de votre modèle dans cet état.

5. Pour créer la partie ScrollViewer, double-cliquez sur ScrollViewer dans le panneau Parties. Le nouvel objet ScrollViewer étant sélectionné, dessinez un contrôle ItemsPresenter à l’intérieur. Utilisez l’outil Sélection ou les propriétés sous Disposition dans le panneau Propriétés pour redimensionner et déplacer ces objets à l’intérieur de votre modèle.

6. Pensez à lier certaines des propriétés de pinceau pour les objets de votre modèle aux propriétés suivantes de l’objet ListBox qui utiliseront finalement votre modèle :

   • Arrière-plan

   • BorderBrush

   • Premier plan

   • BorderThickness

   Pour plus d’informations, voir Véhiculer des propriétés d'objet vers le modèle.

7. Pour quitter le mode de modification de modèle, cliquez sur [ListBox] dans la barre de navigation en haut de la planche graphique, ou cliquez sur Étendue supérieure  dans le panneau Objets et chronologie.

   Pour plus d’informations sur l’application de votre nouveau modèle ListBox à d’autres objets ListBox, voir Appliquer ou supprimer une ressource.

Références

Vous trouverez des informations détaillées sur les propriétés et événements du contrôle ListBox Microsoft Silverlight dans la Galerie de contrôles Silverlight sur MSDN.

Voir aussi

Tâches

Utiliser le contrôle DataGrid

Utiliser le contrôle TreeView

Concepts

Conseils de conception de styles pour les contrôles Silverlight courants

SimpleListBox et SimpleListBoxItem

Définition d'un style pour un contrôle prenant en charge les modèles

Appliquer un style à un contrôle d'affichage de données