Note that there are some explanatory texts on larger screens.

plurals
  1. POSetter in property trigger fails if target property already has an explicit value
    text
    copied!<p>I'm currently trying to create a <code>ControlTemplate</code> for the <code>Button</code> class in WPF, replacing the usual visual tree with something that makes the button look similar to the little (X) close icon on Google Chrome's tabs. I decided to use a <code>Path</code> object in XAML to achieve the effect. Using a property trigger, the control responds to a change in the IsMouseOver property by setting the icon's red background.</p> <p>Here's the XAML from a test app:</p> <pre><code>&lt;Window x:Class="Widgets.Window1" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="Window1" Height="300" Width="300"&gt; &lt;Window.Resources&gt; &lt;Style x:Key="borderStyle" TargetType="Border"&gt; &lt;Style.Triggers&gt; &lt;Trigger Property="IsMouseOver" Value="True"&gt; &lt;Setter Property="Background"&gt; &lt;Setter.Value&gt; &lt;SolidColorBrush Color="#CC0000"/&gt; &lt;/Setter.Value&gt; &lt;/Setter&gt; &lt;/Trigger&gt; &lt;/Style.Triggers&gt; &lt;/Style&gt; &lt;ControlTemplate x:Key="closeButtonTemplate" TargetType="Button"&gt; &lt;Border Width="12" Height="12" CornerRadius="6" BorderBrush="#AAAAAA" Background="Transparent" Style="{StaticResource borderStyle}" ToolTip="Close"&gt; &lt;Viewbox Margin="2.75"&gt; &lt;Path Data="M 0,0 L 10,10 M 0,10 L 10,0" Stroke="{Binding BorderBrush, RelativeSource={RelativeSource FindAncestor, AncestorType=Border, AncestorLevel=1}}" StrokeThickness="1.8"/&gt; &lt;/Viewbox&gt; &lt;/Border&gt; &lt;/ControlTemplate&gt; &lt;/Window.Resources&gt; &lt;Grid Background="White"&gt; &lt;Button Template="{StaticResource closeButtonTemplate}"/&gt; &lt;/Grid&gt; &lt;/Window&gt; </code></pre> <p>Note that the circular background is always there - it's just transparent when the mouse isn't over it.</p> <p>The problem with this is that the trigger just isn't working. Nothing changes in the button's appearance. However, if I remove the <code>Background="Transparent"</code> value from the <code>Border</code> object in the <code>ControlTemplate</code>, the trigger <em>does</em> work (albeit only when over the 'X').</p> <p>I really can't explain this. Setters for any other properties placed in the <code>borderStyle</code> resource work fine, but the <code>Background</code> setter fails as soon as the default background is specified in the <code>ControlTemplate</code>.</p> <p>Any ideas why it's happening and how I can fix it? I know I could easily replace this code with, for example, a .PNG-based image, but I want to understand why the current implementation isn't working.</p> <p>Thanks! :)</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