В настоящее время я пытаюсь создать ControlTemplate
для класса Button
в WPF, заменив обычное визуальное дерево чем-то, что делает кнопку похожей на маленький (X) значок закрытия на вкладках Google Chrome.Я решил использовать объект Path
в XAML для достижения эффекта.Используя триггер свойства, элемент управления реагирует на изменение свойства IsMouseOver, устанавливая красный фон значка.
Вот XAML из тестового приложения:
<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">
<Window.Resources>
<Style x:Key="borderStyle" TargetType="Border">
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background">
<Setter.Value>
<SolidColorBrush Color="#CC0000"/>
</Setter.Value>
</Setter>
</Trigger>
</Style.Triggers>
</Style>
<ControlTemplate x:Key="closeButtonTemplate" TargetType="Button">
<Border Width="12" Height="12" CornerRadius="6"
BorderBrush="#AAAAAA" Background="Transparent"
Style="{StaticResource borderStyle}"
ToolTip="Close">
<Viewbox Margin="2.75">
<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"/>
</Viewbox>
</Border>
</ControlTemplate>
</Window.Resources>
<Grid Background="White">
<Button Template="{StaticResource closeButtonTemplate}"/>
</Grid>
</Window>
Обратите внимание, что круговой фонвсегда там - это просто прозрачно, когда мышь не находится над ним.
Проблема в том, что триггер просто не работает.Ничего не меняется в появлении кнопки.Тем не менее, если я удаляю значение Background="Transparent"
из объекта Border
в ControlTemplate
, триггер работает (хотя и только после «X»).
Iдействительно не могу это объяснить.Сеттеры для любых других свойств, помещенных в ресурс borderStyle
, работают нормально, но сеттер Background
завершается ошибкой, как только в ControlTemplate
задан фон по умолчанию.
Любые идеи, почему это происходит и как яможно это исправить?Я знаю, что мог бы легко заменить этот код, например, изображением на основе .PNG, но я хочу понять, почему текущая реализация не работает.
Спасибо!:)