ToggleButton ControlTemplate pour faire tourner le chemin soit avec ou sans animation

Question

Dans cette animée ToggleButtonControlTemplate, après avoir cliqué sur ce fait il est l'animation qui tourne le Path quand IsChecked est changé.

<ControlTemplate x:Key="AnimatedExpanderButtonTemp" TargetType="{x:Type ToggleButton}"> 
    <Border x:Name="ExpanderButtonBorder" 
     Background="{TemplateBinding Background}" 
     BorderBrush="{TemplateBinding BorderBrush}" 
     BorderThickness="{TemplateBinding BorderThickness}" 
     Padding="{TemplateBinding Padding}"> 
     <Grid> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="Auto"/> 
      </Grid.ColumnDefinitions> 
      <Rectangle Fill="Transparent"/> 
      <Ellipse x:Name="Circle" 
        Grid.Column="0" 
        Stroke="DarkGray" 
        Fill="White" 
        Width="15" 
        Height="15" 
        HorizontalAlignment="Center" 
        VerticalAlignment="Center"/> 
      <Path x:Name="Arrow" 
       Grid.Column="0" 
       Data="M 1,1.5 L 4.5,5 8,1.5" 
       Stroke="#FF666666" 
       StrokeThickness="2" 
       HorizontalAlignment="Center" 
       VerticalAlignment="Center" 
       RenderTransformOrigin="0.5,0.5"> 
      </Path> 
     </Grid> 
    </Border> 
    <ControlTemplate.Triggers> 
     <Trigger Property="IsChecked" Value="True"> 
      <Trigger.EnterActions> 
       <BeginStoryboard> 
        <Storyboard> 
         <DoubleAnimation Storyboard.TargetName="Arrow" 
             Storyboard.TargetProperty="(UIElement.RenderTransform).(RotateTransform.Angle)" 
             To="180" 
             Duration="0:0:0.4"/> 
        </Storyboard> 
       </BeginStoryboard> 
      </Trigger.EnterActions> 
      <Trigger.ExitActions> 
       <BeginStoryboard> 
        <Storyboard> 
         <DoubleAnimation Storyboard.TargetName="Arrow" 
             Storyboard.TargetProperty="(UIElement.RenderTransform).(RotateTransform.Angle)" 
             To="0" 
             Duration="0:0:0.4"/> 
        </Storyboard> 
       </BeginStoryboard> 
      </Trigger.ExitActions> 
     </Trigger> 
    </ControlTemplate.Triggers> 
</ControlTemplate> 

Cependant, il y a des conditions où je ne veux pas que l'animation se joue.

tel lorsque le ToggleButton est d'abord chargé et il est pré-cochée,
ou,
si vous l'utilisez dans un VirtualizingPanel et le bouton ligne est hors de portée et revient à nouveau.

Quelques scenerios:
1) Si elle est déjà cochée et non d'un clic alors il va directement à tourner la flèche 180 degrés sans animation.

2) S'il est cliqué et si Vérifié est True, il pivote à 180 animé.

3) Si l'on clique sur et si la case Checked est False, elle tourne à 0 animée.

Comment puis-je accomplir ceci?

Answer 1

Essayez quelque chose comme ceci:

<ControlTemplate.Triggers> 
    <MultiTrigger> 
     <MultiTrigger.Conditions> 
      <Condition Property="IsChecked" Value="True" /> 
      <Condition Property="IsPressed" Value="False" /> 
      <!--<Condition Property="IsMouseOver" Value="False" /> not sure if needed in your case--> 
     </MultiTrigger.Conditions> 
     <!--your logic for changing without animation--> 
     <!--<Setter Property="" Value="" />--> 
    </MultiTrigger> 

    <MultiTrigger> 
     <MultiTrigger.Conditions> 
      <Condition Property="IsChecked" Value="True" /> 
      <Condition Property="IsPressed" Value="True" /> 
      <!--<Condition Property="IsMouseOver" Value="False" /> not sure if needed in your case--> 
     </MultiTrigger.Conditions> 
     <!--your logic for changing with animation--> 
     <!--<Setter Property="" Value="" />--> 
    </MultiTrigger> 

    <MultiTrigger> 
     <MultiTrigger.Conditions> 
      <Condition Property="IsChecked" Value="False" /> 
      <Condition Property="IsPressed" Value="True" /> 
      <!--<Condition Property="IsMouseOver" Value="False" /> not sure if needed in your case--> 
     </MultiTrigger.Conditions> 
     <!--your logic for changing with animation--> 
     <!--<Setter Property="" Value="" />--> 
    </MultiTrigger> 
</ControlTemplate.Triggers>