自定义按钮不对IsMouseOver反应
问题描述:
我已经创建了控件IconButton(派生自Button)在我的按钮的中心显示大图标。一切似乎工作正常,但触发。当鼠标超过我的控制时,背景应该会改变。自定义按钮不对IsMouseOver反应
后面的代码:
public class IconButton : System.Windows.Controls.Button
{
public static readonly DependencyProperty ImageProperty = DependencyProperty.Register("Image", typeof(System.Windows.Media.ImageSource), typeof(IconButton));
public System.Windows.Media.ImageSource Image
{
get
{
return (System.Windows.Media.ImageSource)GetValue(ImageProperty);
}
set
{
SetValue(ImageProperty, value);
}
}
public IconButton()
{
SetResourceReference(StyleProperty, "IconsStyle");
}
}
XAML:
<Style x:Key="IconsStyle" TargetType="local:IconButton">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="local:IconButton">
<Border BorderBrush="{TemplateBinding BorderBrush}"
CornerRadius="10"
BorderThickness="{TemplateBinding BorderThickness}"
MaxHeight="{TemplateBinding MaxHeight}"
MaxWidth="{TemplateBinding MaxWidth}"
MinHeight="{TemplateBinding MinHeight}"
MinWidth="{TemplateBinding MinWidth}"
Height="{TemplateBinding Height}"
Width="{TemplateBinding Width}"
HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
VerticalAlignment="{TemplateBinding VerticalAlignment}">
<Border.Background>
<LinearGradientBrush StartPoint="0,0" EndPoint="0,2">
<GradientStop Offset="0" Color="Green"/>
<GradientStop Offset="2" Color="White"/>
</LinearGradientBrush>
</Border.Background>
<Grid VerticalAlignment="Stretch"
HorizontalAlignment="Stretch"
Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="2*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Image
VerticalAlignment="Center"
HorizontalAlignment="Center"
Source="{TemplateBinding Image}"/>
<ContentControl
VerticalAlignment="Bottom"
Grid.Row="1"
Padding="0"
FontSize="12"
HorizontalAlignment="Center"
HorizontalContentAlignment="Center"
VerticalContentAlignment="Center"
Content="{TemplateBinding Content}"
Background="Transparent"/>
</Grid>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background">
<Setter.Value>
<LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
<GradientStop Offset="-1" Color="Green"/>
<GradientStop Offset="0.5" Color="White"/>
<GradientStop Offset="2" Color="Green"/>
</LinearGradientBrush>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
什么是错的代码?为什么当我将鼠标移动到其上时,背景不会改变?
答
的Background
属性,你是在IsMouseOver
触发设置。
您应该修改样式,如下所示。它增加了一个
Background="{TemplateBinding Background}"
赋值给边框控件,并定义了样式设置器的默认背景。
<Style x:Key="IconsStyle" TargetType="local:IconButton">
<Setter Property="Background">
<Setter.Value>
<LinearGradientBrush StartPoint="0,0" EndPoint="0,2">
<GradientStop Offset="0" Color="Green"/>
<GradientStop Offset="2" Color="White"/>
</LinearGradientBrush>
</Setter.Value>
</Setter>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="local:IconButton">
<Border Background="{TemplateBinding Background}" ... >
...
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background">
<Setter.Value>
<LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
<GradientStop Offset="-1" Color="Green"/>
<GradientStop Offset="0.5" Color="White"/>
<GradientStop Offset="2" Color="Green"/>
</LinearGradientBrush>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
答
给ContentControl一个名称,然后尝试设置属性和元素名称。这应该可以解决您的问题。从未使用过
<ContentControl x:Name="ContentControl1"
VerticalAlignment="Bottom"
Grid.Row="1"
Padding="0"
FontSize="12"
HorizontalAlignment="Center"
HorizontalContentAlignment="Center"
VerticalContentAlignment="Center"
Content="{TemplateBinding Content}"
Background="Transparent"/>
</Grid>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter TargetName="ContentControl1" Property="Background" >
<Setter.Value>
<LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
<GradientStop Offset="-1" Color="Green"/>
<GradientStop Offset="0.5" Color="White"/>
<GradientStop Offset="2" Color="Green"/>
</LinearGradientBrush>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>