Valeurs d'animation du storyboard

Question

J'ai une énumération sur un modèle qui représente l'une des 5 couleurs, et j'utilise un ValueConverter pour convertir ces valeurs en couleurs réelles.

Spécifiquement, la couleur de l'arrière-plan de chaque élément de la liste doit être modifiée lorsque celle-ci est survolée.

J'ai un contrôle personnalisé avec un gestionnaire d'état visuel et un groupe de survol qui utilise une SplineColorKeyFrame pour animer la couleur du survol (Ceci est défini dans le xaml du modèle de contrôle). Le contrôle personnalisé a juste une propriété de dépendance pour la couleur hover.

Cela fonctionne très bien si la valeur de la SplineColorKeyFrame provient d'une ressource ou si elle est définie dans le xaml comme une couleur fixe. Cependant il anime juste à transparent quand je place la valeur à "{TemplateBinding HoverColor}"

Même en affectant la DependencyProperty dans le xaml à une couleur, et essayant d'utiliser le TemplateBinding dans le contrôle pour lire la couleur cause le problème, l'animation n'utilisera pas la bonne couleur si je lui dis de l'obtenir à partir d'une liaison ou d'une liaison de modèle. J'ai repéré l'application et je peux voir que la propriété de dépendance a la valeur correcte, mais elle ne semble pas récupérer cette valeur dans l'animation.

Quelqu'un peut-il suggérer comment contourner ce problème?

Voici mon modèle de contrôle:

<Style TargetType="{x:Type local:MyCustomControl}"> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type local:MyCustomControl}"> 
       <Border Background="{TemplateBinding Background}" 
         BorderBrush="{TemplateBinding BorderBrush}" 
         BorderThickness="{TemplateBinding BorderThickness}" x:Name="border"> 
        <VisualStateManager.VisualStateGroups> 
         <VisualStateGroup x:Name="MouseOverGroup"> 
          <VisualStateGroup.Transitions> 
           <VisualTransition GeneratedDuration="0:0:0.2"/> 
          </VisualStateGroup.Transitions> 
          <VisualState x:Name="MouseOver"> 
           <Storyboard> 
            <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)" Storyboard.TargetName="border"> 
             <SplineColorKeyFrame KeyTime="0" Value="{TemplateBinding HoverColor}" /> 
            </ColorAnimationUsingKeyFrames> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="Normal"/> 
         </VisualStateGroup> 
        </VisualStateManager.VisualStateGroups> 
        <VisualStateManager.CustomVisualStateManager> 
         <ic:ExtendedVisualStateManager/> 
        </VisualStateManager.CustomVisualStateManager> 

        <i:Interaction.Triggers> 
         <i:EventTrigger EventName="MouseEnter"> 
          <ic:GoToStateAction x:Name="MouseOverAction" StateName="MouseOver"/> 
         </i:EventTrigger> 
         <i:EventTrigger EventName="MouseLeave"> 
          <ic:GoToStateAction x:Name="NormalAction" StateName="Normal"/> 
         </i:EventTrigger> 
        </i:Interaction.Triggers> 
       </Border> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

Voici mon code de contrôle personnalisé:

public class MyCustomControl : Control 
    { 
     public static DependencyProperty HoverColorProperty = DependencyProperty.Register("HoverColor", typeof (Color), 
                          typeof (MyCustomControl)); 
     public Color HoverColor 
     { 
      get 
      { 
       return (Color)GetValue(HoverColorProperty); 
      } 
      set 
      { 
       SetValue(HoverColorProperty, value); 
      } 
     } 

     static MyCustomControl() 
     { 
      DefaultStyleKeyProperty.OverrideMetadata(typeof(MyCustomControl), new FrameworkPropertyMetadata(typeof(MyCustomControl))); 
     } 
    } 

est ici la fenêtre principale XAML:

<Window x:Class="Test.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:Test="clr-namespace:Test" Title="MainWindow" Height="350" Width="525"> 
    <Window.DataContext> 
     <Test:ViewModel/> 
    </Window.DataContext> 
    <Grid> 
     <Test:MyCustomControl HoverColor="Yellow" 
           HorizontalAlignment="Center" VerticalAlignment="Center" Width="150" Height="150" 
           Background="Bisque"> 

     </Test:MyCustomControl> 
    </Grid> 
</Window> 

Answer 1

Je trouve la réponse à ce problème. Il s'avère que, pour une raison quelconque, la liaison ne fonctionne pas si le StoryBoard est en ligne dans le Xaml. Si vous placez le Storyboard dans une ressource et que vous vous référez à la ressource dans VisualStateManager, tout fonctionne.