在做项目的时候要设置按钮为圆角,其中还要设置按钮的鼠标滑过事件。
博主之前也是踩了很多坑,在网上综合代码才解决问题,总结如下。
先是自定义一个按钮模板,这里需要注意的是,我们为了达到鼠标滑过事件一样的效果,需要把Border的BackGround绑定到按钮的BackGround,代码如下
<ControlTemplate x:Key="TestBtnTem" TargetType="Button">
<Border x:Name="boder" CornerRadius="5" Background="{TemplateBinding Background}">
<Grid>
<TextBlock Margin="20,0,10,0" Text="Test" HorizontalAlignment="Right" VerticalAlignment="Center" FontSize="18" />
<Image Margin="5,0,0,0" Source="path" Width="20" Height="20" VerticalAlignment="Center" HorizontalAlignment="Left"/>
</Grid>
</Border>
</ControlTemplate>
然后当然就是设置按钮事件了, 这里我是通过定义一个按钮Style来实现,当然也可以编写后台代码实现,代码如下
<Style x:Key="BtnStyle" TargetType="Button">
<Setter Property="Foreground" Value="Black"/>
<Setter Property="BorderThickness" Value="0"/>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="#87CEFA" />
</Trigger>
<Trigger Property="IsMouseOver" Value="False">
<Setter Property="Background" Value="#D3D3D3" />
</Trigger>
</Style.Triggers>
</Style>
最后就是按钮的实现了
<Button HorizontalAlignment="Right" Margin="0,8,280,0" VerticalAlignment="Top" Width="75" Height="35" Name="Test"
Style="{StaticResource BtnStyle}" Template="{StaticResource TestBtnTem}" Click="ADD_Click">
</Button>
如果以上内容觉得有帮助,请不要吝啬各位的一键三连呀!