Silverlight Triggers in a Button Template?

Question

Does anyone have a functioning example of how to use triggers in a Silverlight Button Template using the Microsoft.Expression.Interactivity dlls?

I want to respond to the click event in a Button's template defined in a style, by triggering an animation.

Answer 1

You can always use the VisualStateManager and change to the "Click" state by handling the click event of a Button.

void myButton_Click(object sender, RoutedEventArgs)
{
     VisualStateManager.GoToState(this, "Click", true);
}

You will also need to define a style and state in the XAML code.

<Style x:Key="ButtonStyle" TargetType="Button">       
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="StateGroup">
                               <VisualState x:Name="ActiveLink">
                                    <Storyboard>
                                        //animations go here
                              ...

Also, remember that Button objects have a bunch of predefine states like Disabled, Pressed (Click?), MouseOver, and Normal.

Answer 2

You want to use an EventTrigger that fires a GoToStateAction

<Button x:Name="button" Height="53" HorizontalAlignment="Left" Margin="173,124,0,0" VerticalAlignment="Top" Width="147" Content="Button">
    <i:Interaction.Triggers>
        <i:EventTrigger EventName="Click">
            <ic:GoToStateAction TargetName="checkBox" StateName="Checked"/>
        </i:EventTrigger>
    </i:Interaction.Triggers>
</Button>
<CheckBox x:Name="checkBox" Height="24" HorizontalAlignment="Left" Margin="173,206,0,0" VerticalAlignment="Top" Width="147" Content="CheckBox"/>

To do this in Blend you would drag a GoToStateAction onto the button and then set the TargetName property to the target UIElement and the StateName property to the desired state.