views:

66

answers:

0

Hi,

I have a ControlTemplate for my ListBoxItems and i want to animate between 4 different colors for the 4 Possible states of the Properties IsSelected and IsMouseOver.

I have tried this using a MultiTrigger like this (IconBorder is a border surrounding the ListBoxItems

                         <MultiTrigger>
                            <MultiTrigger.Conditions>
                                <Condition Property="IsSelected" Value="True"/>
                                <Condition Property="IsMouseOver" Value="False"/>
                            </MultiTrigger.Conditions>
                            <MultiTrigger.EnterActions>
                                <BeginStoryboard Name="SelNotOver">
                                    <Storyboard>
                                        <ColorAnimation To="LightBlue" 
                                                        IsAdditive="True"
                                                        Duration="0:0:1" 
                                                        Storyboard.TargetName="IconBorder"                                                           
                                                        Storyboard.TargetProperty="Background.Color"/>
                                    </Storyboard>
                                </BeginStoryboard>
                            </MultiTrigger.EnterActions>
                        </MultiTrigger>

                        <MultiTrigger >
                            <MultiTrigger.Conditions>
                                <Condition Property="IsSelected" Value="False"/>
                                <Condition Property="IsMouseOver" Value="True"/>
                            </MultiTrigger.Conditions>
                            <MultiTrigger.EnterActions>
                                <BeginStoryboard Name="NotSelOver">
                                    <Storyboard>
                                        <ColorAnimation To="Aquamarine" 

                                                        Duration="0:0:1" 
                                                        Storyboard.TargetName="IconBorder"                                                           
                                                        Storyboard.TargetProperty="Background.Color"/>
                                    </Storyboard>
                                </BeginStoryboard>
                            </MultiTrigger.EnterActions>
                        </MultiTrigger>

                        <MultiTrigger >
                            <MultiTrigger.Conditions>
                                <Condition Property="IsSelected" Value="True"/>
                                <Condition Property="IsMouseOver" Value="True"/>
                            </MultiTrigger.Conditions>
                            <MultiTrigger.EnterActions>
                                <BeginStoryboard Name="SelOver">                                        
                                    <Storyboard>
                                        <ColorAnimation To="Blue" 

                                                        Duration="0:0:1" 
                                                        Storyboard.TargetName="IconBorder"                                                           
                                                        Storyboard.TargetProperty="Background.Color"/>
                                    </Storyboard>
                                </BeginStoryboard>
                            </MultiTrigger.EnterActions>
                        </MultiTrigger>

                       <MultiTrigger >
                            <MultiTrigger.Conditions>
                                <Condition Property="IsSelected" Value="False"/>
                                <Condition Property="IsMouseOver" Value="False"/>
                            </MultiTrigger.Conditions>
                            <MultiTrigger.EnterActions>
                                <BeginStoryboard>
                                    <Storyboard>
                                        <ColorAnimation To="Transparent" 
                                                        IsAdditive="True"
                                                        Duration="0:0:1" 
                                                        Storyboard.TargetName="IconBorder"                                                           
                                                        Storyboard.TargetProperty="Background.Color"/>
                                    </Storyboard>
                                </BeginStoryboard>
                            </MultiTrigger.EnterActions>
                        </MultiTrigger>

this code is unfortunately not working. I have tried to add a StopStoryBoard for the 3 other BeginStoryBoards in each of the Triggers, but that has the effect, that the animations start over with a white color, and not with the Color the Item currently has.

How can i do this properly?

Thanks, Robert.