Essayez ! Attribuer un style à un bouton à l'aide d'effets

Outre l'utilisation de déclencheurs de propriété pour changer l'aspect d'un bouton en fonction de l'interaction utilisateur, dans Microsoft Expression Blend, vous pouvez aussi appliquer un effet sur chaque état.

Pour créer des effets sur un bouton

1. Dessinez un objet SimpleButton sur la planche graphique dans Expression Blend.

   Conseil :
   Les contrôles de style simple se trouvent sous Styles simples dans la catégorie Styles du panneau Composants. Une fois que vous avez sélectionné un contrôle de style simple dans la liste, vous pouvez le dessiner sur la planche graphique.

2. Cliquez avec le bouton droit sur le bouton dans le panneau Objets et chronologie, pointez sur Modifier le modèle, puis cliquez sur Modifier l'élément actuel. Si vous ne souhaitez pas changer le dictionnaire de ressources SimpleStyles.xaml, vous pouvez cliquer sur Modifier une copie et non sur Modifier l'élément actuel pour créer un modèle et l'enregistrer dans le document.

   Pour plus d'informations sur la création d'une copie, voir Créer une ressource.

   Conseil :

   Pour quitter le mode d'édition de modèle et revenir à l'étendue de votre document, cliquez sur Étendue supérieure qui se trouve au-dessus de l'arborescence des objets dans le panneau Objets et chronologie. Pour revenir au mode d'édition de modèle pour un modèle existant : dans le panneau Objets et chronologie, cliquez avec le bouton droit sur l'objet dont vous voulez modifier le modèle, pointez sur Modifier le modèle, puis cliquez sur Modifier l'élément actuel.

3. Dans l'étendue d'édition du modèle de contrôle, supprimez l'objet enfant Border de l'objet Grille.

4. Cliquez sur l'objet Grille pour l'activer afin de pouvoir ajouter des objets enfants.

5. Dessinez un objet Rectangle dans la grille, puis choisissez le jaune pour la propriété Fill sous Pinceaux dans le panneau Propriétés.

6. Cliquez avec le bouton droit sur l'objet Rectangle, pointez sur Trier, puis cliquez sur Mettre en arrière-plan pour le placer derrière l'objet ContentPresenter.

7. Arrondissez les bords de l'objet Rectangle à l'aide de l'ornement qui apparaît lorsque vous placez le pointeur au-dessus de l'une des deux poignées à l'extérieur du coin supérieur gauche du rectangle, ou à l'aide des propriétés RadiusX et RadiusY sous Apparence dans le panneau Propriétés.

8. Depuis la catégorie Effets du panneau Composants, faites glisser l'objet DropShadowEffect sur l'objet Rectangle.

   Une ombre portée est ajoutée à l'objet Rectangle en tant qu'objet enfant.

9. DropShadowEffect étant sélectionné dans le panneau Objets et chronologie, réglez les propriétés de l'effet dans le panneau Propriétés. Affectez à la propriété ShadowDepth la valeur 20.

10. Dans le panneau Déclencheurs, cliquez sur le déclencheur IsMouseOver = True pour activer l'enregistrement de déclencheur. Dans le panneau Propriétés, affectez à la propriété ShadowDepth la valeur 25.

    Une nouvelle ligne apparaît sous Propriétés une fois actif dans le panneau Déclencheurs, reflétant ainsi le changement de propriété qui se produit lorsque la souris passe au-dessus du bouton.

    Conseil :
    Vous devrez éventuellement régler les fenêtres du panneau Déclencheurs pour voir tous les déclencheurs et toutes les actions. Utilisez la souris pour redimensionner les fenêtres.

11. Dans le panneau Déclencheurs, cliquez sur le déclencheur IsPressed = True pour activer l'enregistrement de déclencheur. Dans le panneau Propriétés, affectez à la propriété ShadowDepth la valeur 10.

    Une nouvelle ligne apparaît sous Propriétés une fois actif dans le panneau Déclencheurs, reflétant ainsi le changement de propriété qui se produit lorsque l'on clique sur le bouton dans l'application en cours d'exécution.

12. Cliquez sur Par défaut dans le panneau Déclencheurs pour désactiver l'enregistrement de déclencheur.

13. Testez votre application (F5) pour voir l'effet en action.

Voir aussi

Tâches

Ajouter ou supprimer un déclencheur

Concepts

SimpleButton

Utilisation de déclencheurs pour la définition du comportement d'un contrôle WPF

Application d'effets