首先我们在资源里添加几个图片,Up,Over和Down状态。
然后我们创建一个Style。默认我们的背景设置成Up
然后在Triggers里添加代码,当Property:IsMouseOver为True的时候更换成Over;当Property:IsPressed为True的时候更换成Down;
这样就可以了。代码如下:
<Window.Resources>
<ImageBrush x:Key="btnCloseUp" ImageSource="/source/guanbi.png"></ImageBrush>
<ImageBrush x:Key="btnCloseOver" ImageSource="/source/guanbi1.png"></ImageBrush>
<ImageBrush x:Key="btnCloseDown" ImageSource="/source/guanbi1 1.png"></ImageBrush>
<Style x:Key="btnCloseStyle" TargetType="{x:Type Button}">
<Setter Property="Background" Value="{StaticResource btnCloseUp}"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Border x:Name="button"
BorderThickness="0"
Background="{TemplateBinding Background}"
SnapsToDevicePixels="True" IsEnabled="False">
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" TargetName="button" Value="{StaticResource btnCloseOver}"></Setter>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter Property="Background" TargetName="button" Value="{StaticResource btnCloseDown}"></Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
当然如果需要不可用的时候显示成灰色,可以添加其他的状态:
<Trigger Property="IsEnabled" Value="False">
<Setter Property="Background" TargetName="button" Value="{StaticResource btnUpdateImgDisable}"></Setter>
</Trigger>
效果如图: