Visual-state in SilverLight? (how we use that)

Question

Hi
I wrote simple template in xaml for button s.(for silver-light 4)
So when I try use "ControlTemplate.Triggers", I found that is impossible in silver-light, and we must use Visual-State in Silver-Light
so I wrote first ControlTemplate with Visual-State but it not work fine.(here is code)

 <Style x:Key="NextButtonStyle" TargetType="Button">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate>
                    <Grid x:Name="MainGrid">
                        <Border x:Name="MainBorder"
                                BorderThickness="2"
                                BorderBrush="#FFC0C0C0"
                                Background="Bisque"
                                CornerRadius="4 4 4 4" >
                            <TextBlock x:Name="lbl"
                                       VerticalAlignment="Center"
                                       HorizontalAlignment="Center"
                                       Text=">"
                                       Foreground="#FFC0C0C0"
                                       FontWeight="Bold"
                                       FontFamily="TimesNewRoman"
                                       FontSize="15"/>
                        </Border>
                        <vsm:VisualStateManager.VisualStateGroups>
                            <vsm:VisualStateGroup x:Name="CommonStates">
                                <vsm:VisualState x:Name="MouseOver">
                                    <Storyboard>
                                        <ColorAnimationUsingKeyFrames AutoReverse="False" Duration="00:00:00.2"
                                                                      Storyboard.TargetName="MainBorder"
                                                                      Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color}">
                                            <SplineColorKeyFrame KeyTime="00:00:00" Value="#FF606060"/>
                                        </ColorAnimationUsingKeyFrames>
                                        <ColorAnimationUsingKeyFrames AutoReverse="False" Duration="00:00:00.2"
                                                                      Storyboard.TargetName="lbl"
                                                                      Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color}">
                                            <SplineColorKeyFrame KeyTime="00:00:00" Value="#FF606060"/>
                                        </ColorAnimationUsingKeyFrames>
                                    </Storyboard>
                                </vsm:VisualState>

                            </vsm:VisualStateGroup>
                        </vsm:VisualStateManager.VisualStateGroups>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

When i use this style and move on this border this border, both of border and textbloc became invisible. so
1) What do i do?
2) and is there any good examples for Visual-State

Answer 1

Because of two simple mistakes u r style was not working , else all is right.

1)Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color}

It will be : Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)

2) The same goes for the textblock : Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color}

It will be : Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)