Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>There are three parts to this solution:</p> <ol> <li>Name your <code>IsMouseOver</code> <code>BeginStoryBoard</code> objects.</li> <li>Use those names in two <code>StopStoryBoard</code> objects in the <code>IsPressed</code> <code>Trigger.EnterActions</code>.</li> <li>Reverse the order of your <code>Trigger</code> objects:</li> </ol> <p>You should end up with something like this:</p> <pre><code>&lt;Trigger Property="IsPressed" Value="True"&gt; &lt;Trigger.EnterActions&gt; &lt;StopStoryboard BeginStoryboardName="MouseOverStoryBoard" /&gt; &lt;StopStoryboard BeginStoryboardName="MouseOverStoryBoard2" /&gt; &lt;BeginStoryboard&gt; &lt;Storyboard&gt; &lt;ColorAnimation Storyboard.TargetName="backgroundBrush" Storyboard.TargetProperty="Color" To="{StaticResource pressedBackgroundColor}" Duration="0:0:0.2" /&gt; &lt;/Storyboard&gt; &lt;/BeginStoryboard&gt; &lt;/Trigger.EnterActions&gt; &lt;Trigger.ExitActions&gt; &lt;BeginStoryboard&gt; &lt;Storyboard&gt; &lt;ColorAnimation Storyboard.TargetName="backgroundBrush" Storyboard.TargetProperty="Color" To="{StaticResource backgroundColor}" Duration="0:0:0.2" /&gt; &lt;/Storyboard&gt; &lt;/BeginStoryboard&gt; &lt;/Trigger.ExitActions&gt; &lt;/Trigger&gt; &lt;Trigger Property="IsMouseOver" Value="True"&gt; &lt;Trigger.EnterActions&gt; &lt;BeginStoryboard Name="MouseOverStoryBoard"&gt; &lt;Storyboard&gt; &lt;ColorAnimation Storyboard.TargetName="backgroundBrush" Storyboard.TargetProperty="Color" To="{StaticResource hoverBackgroundColor}" Duration="0:0:0.2" /&gt; &lt;/Storyboard&gt; &lt;/BeginStoryboard&gt; &lt;/Trigger.EnterActions&gt; &lt;Trigger.ExitActions&gt; &lt;BeginStoryboard Name="MouseOverStoryBoard2"&gt; &lt;Storyboard&gt; &lt;ColorAnimation Storyboard.TargetName="backgroundBrush" Storyboard.TargetProperty="Color" To="{StaticResource backgroundColor}" Duration="0:0:0.2" /&gt; &lt;/Storyboard&gt; &lt;/BeginStoryboard&gt; &lt;/Trigger.ExitActions&gt; &lt;/Trigger&gt; </code></pre> <p>Actually, I think that you might be able to do without the second <code>StopStoryboard</code>, but having them both won't hurt.</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload