Как сделать простую кнопку наведения, используя 2 изображения в Silverlight

Question

Желательно без использования внутреннего кода? Я ищу самое чистое решение для использования кнопки наведения с постепенным исчезновением, используя 2 изображения. Вот что у меня пока

Edit:

Я получил это, чтобы частично работать .. проблема теперь в том, что мышка выглядит резкой, в то время как мышка кажется нормальной, что я делаю неправильно?

<VisualStateGroup x:Name="CommonStates">
    <VisualState x:Name="Normal" />
    <VisualState x:Name="MouseOver">
        <Storyboard>
            <DoubleAnimation BeginTime="0:0:0" Duration="0:0:1" To="1" 
                                Storyboard.TargetProperty="(UIElement.Opacity)" 
                                Storyboard.TargetName="mouseOverImage" d:IsOptimized="True"/>
            </Storyboard>
    </VisualState>
    <VisualState x:Name="MouseOut">
        <Storyboard>
            <DoubleAnimation BeginTime="0:0:0" Duration="0:0:1" To="0" 
                                Storyboard.TargetProperty="(UIElement.Opacity)" 
                                Storyboard.TargetName="mouseOverImage" d:IsOptimized="True"/>                                         
        </Storyboard>
    </VisualState>
    <VisualState x:Name="Pressed"/>
    <VisualState x:Name="Disabled"/>
</VisualStateGroup>
<VisualStateGroup x:Name="FocusStates">
    <VisualState x:Name="Focused"/>
    <VisualState x:Name="Unfocused"/>
</VisualStateGroup>

Answer 1

Обнаружено, что по умолчанию отсутствует визуальное состояние, называемое mouseout.нормальное состояние будет работать как mouseout или mouseleave.

                                    <Storyboard>
                                        <DoubleAnimation BeginTime="0:0:0" Duration="0:0:0.5" From="0" To="1" 
                                                            Storyboard.TargetProperty="(UIElement.Opacity)" 
                                                            Storyboard.TargetName="mouseOverImage" />                               
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Normal">
                                    <Storyboard>
                                        <DoubleAnimation BeginTime="0:0:0" Duration="0:0:0.5" From="1" To="0" 
                                                            Storyboard.TargetProperty="(UIElement.Opacity)" 
                                                            Storyboard.TargetName="mouseOverImage" />
                                     </Storyboard>