首先,先预定义按钮样式
<UserControl.Resources>
<ResourceDictionary>
<Style x:Key="ButtonStyle" TargetType="{x:Type Button}">
<Setter Property="Foreground" Value="White" />
<Setter Property="Background" Value="Orange"/>
<Setter Property="BorderThickness" Value="1" />
<Setter Property="BorderBrush" Value="White" />
<Setter Property="Margin" Value="5" />
<Setter Property="Cursor" Value="Hand" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="White"/>
<Setter Property="BorderThickness" Value="1"/>
<Setter Property="BorderBrush" Value="Orange"/>
<Setter Property="Foreground" Value="Orange" />
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter Property="Background" Value="Orange"/>
<Setter Property="BorderThickness" Value="1"/>
<Setter Property="BorderBrush" Value="Black" />
<Setter Property="Foreground" Value="Black" />
</Trigger>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="Background" Value="Gray"/>
</Trigger>
<Trigger Property="IsEnabled" Value="True">
<Setter Property="Background" Value="Green"/>
</Trigger>
</Style.Triggers>
</Style>
</ResourceDictionary>
</UserControl.Resources>
接下来在按钮处直接进行绑定:
<Button Width="80" Height="30" FontSize="18" Style="{StaticResource ButtonStyle}" Background="#2196F3" Content="初始化" Name="btn_initialize" PreviewMouseDown ="Btn_initialize_PreviewMouseDown" PreviewMouseUp="Btn_initialize_PreviewMouseUp" Margin="50, 5,0,0"/>
这样就成功实现了预定义样式。
鼠标放上去以后的效果如下:
移除鼠标恢复