WPF: Changez la couleur de fond de la bordure avec le bouton gauche de la souris

Question

NE VOUS ÉTEINDRE PAS, LA QUESTION EST SIMPLE!

Voici un style que j'utilise pour les boutons de mon application. Maintenant, j'essaie de changer la couleur de fond de l'élément Border qui porte le nom "Background" lorsque l'utilisateur clique sur le bouton avec le bouton gauche de la souris.

Comment faire cela?

<Style TargetType="{x:Type Button}"> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type Button}"> 
       <Border BorderBrush="#6e6964" BorderThickness="1" CornerRadius="1" Margin="{TemplateBinding Margin}" SnapsToDevicePixels="True"> 
        <Border BorderBrush="White" BorderThickness="1" CornerRadius="1" SnapsToDevicePixels="True"> 
         <Border Padding="12,4,12,4" SnapsToDevicePixels="True" Name="Background"> 
          <Border.Background> 
           <LinearGradientBrush StartPoint="0,0" EndPoint="0,1"> 
            <GradientStop Color="White" Offset="0"/> 
            <GradientStop Color="#f1f1f1" Offset="1"/> 
           </LinearGradientBrush> 
          </Border.Background> 
          <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" /> 
         </Border> 
        </Border> 
       </Border> 
       <ControlTemplate.Triggers> 
        <Trigger Property="IsMouseOver" Value="True"> 
         <Setter Property="Background" TargetName="Background"> 
          <Setter.Value> 
           <LinearGradientBrush StartPoint="0,0" EndPoint="0,1"> 
            <GradientStop Offset="0" Color="#edf8fb"/> 
            <GradientStop Offset="1" Color="#e2edf0"/> 
           </LinearGradientBrush> 
          </Setter.Value> 
         </Setter> 
        </Trigger> 
       </ControlTemplate.Triggers> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

Answer 1

Vous avez juste besoin propriété déclencheur suivant:

  <ControlTemplate.Triggers> 
       <Trigger Property="IsPressed" Value="True"> 
        <Setter Property="Background" TargetName="Background" Value="Red"/> 
       </Trigger> 
      </ControlTemplate.Triggers> 

Answer 2

Vous avez besoin d'un EventTrigger

Donnez un ou les deux d'un nom de votre frontière de GradientStops (pas les ceux de votre Trigger):

<GradientStop Color="#f1f1f1" Offset="1" x:Name="Stop2" /> 

Et ajouter dans la EventTrigger suivante à votre ControlTemplate .Triggers:

<EventTrigger RoutedEvent="Button.Click"> 
    <EventTrigger.Actions> 
    <BeginStoryboard> 
     <Storyboard> 
     <ColorAnimation Storyboard.TargetName="Stop2" Storyboard.TargetProperty="Color" To="Red" Duration="0" /> 
     </Storyboard> 
    </BeginStoryboard> 
    </EventTrigger.Actions> 
</EventTrigger> 

Si vous souhaitez modifier à la fois de votre dégradé arrête d'être sûr de leur donner à la fois un nom et d'effectuer un ColorAnimation sur chacun individuellement (je pense que vous pouvez les faire tous les deux dans le même storyboard)

Espérons que ça aide! Edit: Cela rendra le changement permanent sur un événement Click (j'ai testé avec VS 2010 Beta 2 et Button.MouseLeftButtonDown ne fonctionne pas mais Button.Click ne fonctionne que pour le bouton gauche de la souris mais pas le bouton droit de la souris) . Si vous souhaitez seulement avoir le changement lorsque la souris est enfoncée ... mais revenir à une valeur normale quand le bouton n'est plus pressé ... alors vous devriez utiliser le déclencheur IsPressed Property comme indiqué dans l'autre réponse.