c# - WPF property trigger with enumeration -

i have wpf c# application user control animate between 3 states.

the user control:

    public partial class cart : usercontrol {     /// <summary>     /// <see cref="layout" /> dependency property's name.     /// </summary>     public const string layoutpropertyname = "layout";      /// <summary>     /// gets or sets value of <see cref="layout" />     /// property. dependency property.     /// </summary>     public visibility layout     {                 {             return (visibility)getvalue(layoutproperty);         }         set         {             setvalue(layoutproperty, value);         }     }      public static readonly dependencyproperty layoutproperty = dependencyproperty.register(         layoutpropertyname,         typeof(visibility),         typeof(carrito),         new propertymetadata(visibility.hidden)); } 

also, have styles.xaml define 3 storyboards plan reuse property triggers position control in different positions.

    <storyboard x:key="cartvisible">     <thicknessanimation storyboard.targetproperty="margin" duration="0:0:0.5" to="0,648,0,0" /> </storyboard> <storyboard x:key="cartcollapsed">     <thicknessanimation storyboard.targetproperty="margin" duration="0:0:0.5" to="0,736,0,0" /> </storyboard> <storyboard x:key="carthidden">     <thicknessanimation storyboard.targetproperty="margin" duration="0:0:0.5" to="0,768,0,0" /> </storyboard> <style targettype="c:cart" targettype="frameworkelement">     <setter property="margin" value="0,768,0,0" />     <style.triggers>         <trigger property="layout" value="visible">             <trigger.enteractions>                 <beginstoryboard storyboard="{staticresource cartvisible}" />             </trigger.enteractions>             <trigger.exitactions>                 <beginstoryboard storyboard="{staticresource carthidden}" />             </trigger.exitactions>         </trigger>         <trigger property="layout" value="collapsed">             <trigger.enteractions>                 <beginstoryboard storyboard="{staticresource cartcollapsed}" />             </trigger.enteractions>             <trigger.exitactions>                 <beginstoryboard storyboard="{staticresource cartvisible}" />             </trigger.exitactions>         </trigger>         <trigger property="layout" value="hidden">             <trigger.enteractions>                 <beginstoryboard storyboard="{staticresource carthidden}" />             </trigger.enteractions>             <trigger.exitactions>                 <beginstoryboard storyboard="{staticresource cartvisible}" />             </trigger.exitactions>         </trigger>     </style.triggers> </style> 

then, have xaml binding property layout, triggers property value changes.

the issue animation not working each state change. examples i've seen bool properties using enter , exitactions, here have 3 may vary.

is there way make work?

thanks

i've been able fix solution animation not working correctly data triggers

the idea define storyboard in enteractions, , before beginstoryboard, make sure every other storyboards removed.

the fixed code this: (please note s:s.cart... constants held in class).

<style targettype="c:cart">     <setter property="margin" value="{x:static s:s+cart.hidden}" />     <style.triggers>         <trigger property="layout" value="visible">             <trigger.enteractions>                 <removestoryboard beginstoryboardname="cartcollapsed" />                 <removestoryboard beginstoryboardname="carthidden" />                 <beginstoryboard name="cartvisible">                     <storyboard>                         <thicknessanimation storyboard.targetproperty="margin"                                     duration="0:0:0.5"                                     to="{x:static s:s+cart.visible}" />                     </storyboard>                 </beginstoryboard>             </trigger.enteractions>         </trigger>         <trigger property="layout" value="collapsed">             <trigger.enteractions>                 <removestoryboard beginstoryboardname="cartvisible" />                 <removestoryboard beginstoryboardname="carthidden" />                 <beginstoryboard name="cartcollapsed">                     <storyboard>                         <thicknessanimation storyboard.targetproperty="margin"                                     duration="0:0:0.5"                                     to="{x:static s:s+cart.collapsed}" />                     </storyboard>                 </beginstoryboard>             </trigger.enteractions>         </trigger>         <trigger property="layout" value="hidden">             <trigger.enteractions>                 <removestoryboard beginstoryboardname="cartvisible" />                 <removestoryboard beginstoryboardname="cartcollapsed" />                 <beginstoryboard name="carthidden">                     <storyboard>                         <thicknessanimation storyboard.targetproperty="margin"                                     duration="0:0:0.5"                                     to="{x:static s:s+cart.hidden}" />                     </storyboard>                 </beginstoryboard>             </trigger.enteractions>         </trigger>     </style.triggers>