Partager via


SimpleSlider

Cette page s’applique uniquement aux projets WPF

Le curseur est un contrôle simple qui permet à un utilisateur de sélectionner une gamme de valeurs en déplaçant un contrôle Thumb. Par défaut, le curseur se déplace horizontalement, mais vous pouvez prévoir un déplacement vertical en définissant la propriété Orientation sous Propriétés communes dans le panneau Propriétés de Microsoft Expression Blend. Pour définir la valeur d’un curseur, utilisez les propriétés Minimum, Maximum et Value.

Vue de planche graphique d’un contrôle SimpleSlider

Cc295377.50295968-6423-4517-9479-ed886201b731(fr-fr,Expression.10).png

Composition du modèle de contrôle

Le modèle de contrôle SimpleSlider est composé des éléments suivants :

  • Un panneau Grille nommé GridRoot, qui sert à contenir les multiples enfants dans le curseur. La grille est également utilisée pour permettre à un concepteur d’interface utilisateur d’application d’ajouter plus facilement des éléments au modèle. L’élément GridRoot est divisé en trois lignes : la ligne du haut contient l’élément TopTick, celle du milieu contient l’élément Thumb et celle du bas contient l’élément BottomTick.

  • Deux éléments TickBar nommés TopTick et BottomTick, qui servent à afficher les taquets sur le curseur. Par défaut, la propriété Visibility est réglée à l’état réduite. Les éléments TickBar déterminent le nombre de marques de graduation à afficher en fonction des propriétés définies sur le contrôle Slider auquel ce modèle est appliqué. Les éléments TickBar ne fournissent pas un modèle modifiable, mais vous pouvez définir le pinceau qu’ils utilisent pour afficher la marque de graduation en définissant la propriété Foreground sur le contrôle Slider (cet élément TickBar est lié par modèle à la propriété Foreground du contrôle Slider).

  • Un élément Border, qui est utilisé parce qu’il inclut une propriété BorderThickness pouvant être liée par modèle à la propriété BorderThickness du contrôle de bouton auquel ce modèle est appliqué.

  • Un élément Track nommé PART_Track, qui sert à afficher un élément Thumb le long d’une barre. L’utilisateur peut faire glisser l’élément Thumb. Par défaut, l’élément Thumb utilise le modèle SimpleThumbStyle que vous pouvez modifier.

  • Deux éléments RepeatButton, qui sont contenus dans l’élément PART_Track et qui permettent à l’utilisateur de cliquer d’un côté ou de l’autre du contrôle Thumb pour effectuer de plus grands changements à la valeur de curseur. Vous pouvez spécifier la valeur de pas pour ces changements dans la propriété LargeChange du contrôle Slider (pas dans le modèle). La valeur de pas qui est spécifiée par la propriété SmallChange est utilisée lorsque l’utilisateur déplace le contrôle Thumb avec les touches fléchées.

  • Une transformation de disposition, qui sert à afficher le curseur dans une orientation horizontale. Cette conception simplifie l’édition car il n’est pas nécessaire de modifier deux modèles différents. Cependant, dans certains cas, les deux orientations doivent être suffisamment différentes pour imposer des modèles distincts. Dans ce cas, il convient d’utiliser une méthode Setter dans l’élément <Style> de la vue XAML dans Expression Blend pour changer de modèle en fonction de l’orientation. Vous trouverez un exemple dans le modèle par défaut du contrôle système Slider.

    Cc295377.alert_caution(fr-fr,Expression.10).gifAttention :

    Ne renommez pas un élément dont le nom commence par « PART_ » car il est fait référence à ces éléments depuis le code mettant en œuvre le contrôle.

    Liste d’objets : parties de base (modèle) d’un contrôle SimpleSlider

    Cc295377.29dedf1c-7f1c-41d0-82a6-8bfccb4eb726(fr-fr,Expression.10).png

Cc295377.7e183f1f-37d8-4dcb-980c-19a5d61ca087(fr-fr,Expression.10).gifHaut de la page

Déclencheurs de propriété utilisés

Des déclencheurs de propriété dans le modèle de contrôle sont utilisés pour que le contrôle réagisse aux changements de propriétés. Vous pouvez cliquer sur les éléments sous Déclencheurs dans le panneau Interaction pour voir les propriétés qui sont changées lorsqu’un déclencheur est actif. Par exemple, dans le modèle SimpleSlider, des déclencheurs sont utilisés pour faire apparaître des éléments TickBar en fonction de la propriété TickPlacement. Cela définit la visibilité sur les éléments TopTick et BottomTick. L’orientation horizontale ou verticale est également configurée sur les déclencheurs du modèle SimpleSlider. Cela s’applique à une transformation de disposition sur le contrôle Slider qui le fait pivoter de 90 degrés. Comme le tracé s’oriente automatiquement, il est rétabli de telle sorte qu’il ne puisse pivoter deux fois.

Cc295377.7e183f1f-37d8-4dcb-980c-19a5d61ca087(fr-fr,Expression.10).gifHaut de la page

Pinceaux utilisés

Les ressources pinceau suivantes dans le dictionnaire de ressources SimpleStyles.xaml sont utilisées par le modèle SimpleSlider :

  • La propriété Background est définie à l’aide de l’élément LightBrush lorsqu’aucun déclencheur n’est actif, et de l’élément DisabledBackgroundBrush lorsque IsEnabled a la valeur False.

  • La propriété BorderBrush est définie à l’aide de l’élément NormalBorderBrush lorsqu’aucun déclencheur n’est actif, et est définie à l’aide de l’élément DisabledBorderBrush lorsque IsEnabled a la valeur False.

  • La propriété Foreground de l’élément TopTick est définie à l’aide de l’élément GlyphBrush.

  • La propriété Fill du modèle SimpleThumb est définie à l’aide de l’élément NormalBrush, et la propriété Stroke est définie à l’aide de l’élément NormalBorderBrush.

Cc295377.7e183f1f-37d8-4dcb-980c-19a5d61ca087(fr-fr,Expression.10).gifHaut de la page

Recommandations et directives de conception

  • En général, utilisez un contrôle Grid comme racine de votre modèle si vous prévoyez qu’un concepteur ajoutera des éléments visuels à votre contrôle. Expression Blend recherche un panneau de disposition comme le contrôle Grid et l’active par défaut afin que de nouveaux éléments ajoutés à la planche graphique deviennent des éléments enfants du panneau de disposition.

  • Si vous le souhaitez, vous pouvez ajouter des déclencheurs au modèle SimpleSlider, ou modifier l’élément PART_Track pour rendre l’aspect du curseur plus attrayant, mais ne renommez pas d’éléments dont le nom commence par « PART_ » car il est fait référence à ces éléments depuis le code mettant en œuvre le contrôle. Les boutons Thumb et de répétition doivent être placés dans les éléments appropriés dans le contrôle Track. Le contrôle Track sait comment placer l’élément Thumb en fonction de la valeur du contrôle Slider. Les boutons de répétition utilisent des liaisons de commande pour obtenir l’augmentation ou la diminution du curseur.

  • Lorsque vous modifiez le modèle du contrôle SimpleSlider, vous pouvez forcer l’affichage des éléments TickBar en utilisant la zone Déclencheurs du panneau Interaction pour sélectionner le déclencheur approprié. Par exemple, dans le modèle SimpleSlider, lorsque la propriété TickPlacement est réglée sur Both, les deux éléments TickBar sont affichés en réglant leur propriété Visibility sur Visible.

Cc295377.7e183f1f-37d8-4dcb-980c-19a5d61ca087(fr-fr,Expression.10).gifHaut de la page

Voir aussi

Concepts

Essayez ! Personnaliser l’élément Thumb d’un contrôle SimpleSlider