Share via


Conseils de conception de styles pour le contrôle TextBox

Ee371168.0b2c798e-86c6-4ea2-a8a6-5cf1f12be1e2(FR-FR,Expression.30).png

Le contrôle TextBox permet d’obtenir l’entrée d’un utilisateur, ou d’afficher un texte. Il est généralement utilisé pour le texte modifiable, bien qu’il puisse être également défini en lecture seule. Les objets TextBox peuvent afficher plusieurs lignes et renvoyer le texte à la ligne selon la taille du contrôle.

Comme avec tous les contrôles, vous pouvez modifier le contrôle TextBox de sorte qu’il paraisse très différent de son apparence par défaut. Par défaut, le contrôle TextBox se présente comme suit :

Ee371168.f77261da-feb5-4693-b764-582a9cc93c12(FR-FR,Expression.30).png

Propriétés intéressantes du contrôle TextBox

Le contrôle TextBox est un contrôle de texte. Vous pouvez ainsi afficher un texte à l’intérieur en définissant la propriété Text sous Propriétés communes dans le panneau Propriétés.

La propriété IsReadOnly permet d’avoir le contrôle TextBox en lecture seule.

La propriété AcceptsReturn permet l’ajout de caractères de ligne au texte tapé. Si vous optez pour cette solution, vous souhaiterez peut-être également activer les barres de défilement en définissant les propriétés HorizontalScrollBarVisibility et VerticalScrollBarVisibility.

Pour spécifier la taille de police, le type de police, etc., définissez les propriétés sous Texte dans le panneau Propriété. Vous pouvez même ajouter des polices personnalisées à votre projet et les incorporer pour une utilisation dans votre contrôle de texte.

Pour plus d’informations, voir Dessiner du texte.

Vous pouvez définir ces propriétés comme suit :

  • Définir les propriétés de l’objet   Après avoir dessiné un objet TextBox sur la planche graphique, vous pouvez définir directement les propriétés de l’objet. Pour que plusieurs objets TextBox utilisent les mêmes valeurs, définissez ces propriétés dans un style.

  • Définir les propriétés dans un style   Si vous définissez ces propriétés dans le style Ee371168.94fa7fc4-4f3e-4e84-9ba1-287f1b894371(FR-FR,Expression.30).png de l’objet TextBox, tout objet TextBox qui a recours à ce style utilise ces valeurs par défaut. Vous pouvez remplacer les valeurs d’un objet spécifique.

    Pour plus d’informations, voir Créer un style.

Parties d’un modèle TextBox

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

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

Pour afficher les parties du modèle, ouvrez le panneau Parties lorsque vous modifiez le modèle. Dans le panneau Objets et chronologie, une icône Ee371168.6cf58c39-edba-4a0e-acbc-1da272f9a387(FR-FR,Expression.30).png s’affiche en regard de tout objet qui joue le rôle d’une partie dans le panneau Parties.

Ee371168.62c81ec5-2055-4556-a068-2dc300675ac9(FR-FR,Expression.30).png

Nom de la partie

Type d’objet

Description

ContentElement

FrameworkElement

Un objet qui affiche du texte.

Cette partie est obligatoire.

Les autres objets du modèle TextBox permettent de modifier l’apparence du contrôle TextBox dans divers états.

États d’un contrôle TextBox

Par défaut, le contrôle TextBox peut être dans l’un des quatre états suivants dans le groupe d’états CommonStates, que vous pouvez afficher dans le panneau États lors de la modification d’un modèle TextBox :

Nom de l’état

Description

Normal

Aspect du contrôle TextBox en l’absence d’interaction avec ce dernier.

MouseOver

Aspect du contrôle TextBox lorsque l’utilisateur place le pointeur dessus.

Enfoncé

Aspect du contrôle TextBox lorsque l’utilisateur clique dessus ou lorsque contrôle possède le focus et que l’utilisateur appuie sur Entrée ou sur Espace.

Désactivé

Aspect du contrôle TextBox lorsque la valeur False est affectée à la propriété IsEnabled.

Le contrôle TextBox peut se trouver dans l’un des deux états suivants du groupe d’états FocusStates :

Nom de l’état

Description

Sans focus

Aspect du contrôle TextBox lorsqu'il ne possède pas le focus clavier.

Avec focus

Aspect du contrôle TextBox lorsqu'il possède le focus clavier. Un utilisateur pourrait, par exemple, appuyer sur la touche Tabulation pour parcourir en séquence les objets d'une application jusqu'à ce que le focus clavier soit sur le contrôle TextBox.

Le contrôle TextBox peut se trouver dans l’un des trois états suivants du groupe d’états ValidationStates :

Nom de l’état

Description

Valide

Aspect du contrôle TextBox lorsqu'il est valide.

InvalidUnfocused

Aspect du contrôle TextBox lorsqu'il n'est pas valide et ne possède pas le focus clavier.

InvalidFocused

Aspect du contrôle TextBox lorsqu'il n'est pas valide et possède le focus clavier.

Ee371168.alert_tip(FR-FR,Expression.30).gifConseil :

Un groupe d’états contient les états visuels qui appartiennent à une même catégorie logique et ne peuvent pas être affichés simultanément. Le groupe CommonStates, par exemple, comprend des états qui se rapportent à une interaction utilisateur avec un périphérique d’entrée tel que la souris. Un seul état d’un groupe d’états peut être affiché à la fois, mais un état d’un groupe peut être affiché en même temps qu’un état d’un autre groupe d’états.

Lorsque vous sélectionnez un état, l'enregistrement de l'état est activé et toutes les modifications que vous effectuez sont enregistrées pour cet état. Pour désactiver l’enregistrement de l’état, cliquez sur le bouton d’enregistrement Ee371168.0dcc6415-6d4e-4fcf-a9a3-eb4664cb6cbc(FR-FR,Expression.30).png ou sélectionnez Base dans le panneau États. Pour modifier l'apparence de votre contrôle lorsque deux états distincts sont actifs, vous pouvez épingler un aperçu d'un état dans un groupe d'états pendant que vous modifiez un état dans un autre groupe d'états.

Pour convertir des objets en contrôle TextBox

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

  • Dessinez un contrôle TextBox Ee371168.343296b4-5c7d-4145-84cc-91b08ba67a1b(FR-FR,Expression.30).png 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 TextBox en dessinant des objets ou en important les conceptions graphiques, puis utilisez 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 TextBox :

  1. Pour afficher un texte dans votre contrôle TextBox, incluez un contrôle TextBlock Ee371168.42165963-00f7-4a33-abcd-b0849edebada(FR-FR,Expression.30).png avec les objets qui composent l’apparence de votre contrôle TextBox.

    Lors de la conversion d’une conception graphique contenant un objet TextBlock en modèle pour un contrôle TextBox, la commande Créer un contrôle effectue les actions suivantes :

    • Met un objet ScrollViewer représentant la partie ContentElement dans le modèle à la place du contrôle TextBlock.

    • Copie les propriétés de disposition à partir du contrôle TextBlock vers l’objet ContentElement.

    • Copie les propriétés typographiques à partir du contrôle TextBlock vers le style du contrôle TextBox. (Le style s’ajuste autour du modèle.)

    • Copie la propriété Text à partir du contrôle TextBlock vers l’objet TextBox auquel le modèle est appliqué.

    Vous pouvez également affecter un objet à la partie ContentElement après avoir converti vos objets en modèle de contrôle. Pour plus d’informations, voir Affecter des parties de modèle aux objets.

  2. Regroupez vos objets dans un panneau de disposition, sélectionnez ce dernier, puis, dans le menu Outils, cliquez sur Créer un contrôle.

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

  4. Après avoir cliqué sur OK, Microsoft Expression Blend passe en mode d’édition de modèle et affiche les objets qui composent votre contrôle TextBox. 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. Pensez à lier certaines des propriétés de pinceau pour les objets de votre modèle aux propriétés suivantes de l’objet TextBox 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.

  6. Pour quitter le mode d’édition de modèle, cliquez sur [TextBox] dans la barre de navigation en haut de la planche graphique, ou cliquez sur Étendue supérieure Ee371168.55844eb3-ed98-4f20-aa66-a6f5b23eeb2b(FR-FR,Expression.30).png dans le panneau Objets et chronologie.

Pour plus d’informations sur l’application de votre nouveau modèle TextBox à d’autres objets TextBox, 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 TextBox Microsoft Silverlight dans la Galerie de contrôles Silverlight Gallery sur MSDN.

Voir aussi

Concepts

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

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

Dessiner du texte