WPF按钮Radius化

[复制链接]
发表于 2025-5-25 06:05:10 | 显示全部楼层 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有账号?立即注册

×
在WPF中,可以通过以下几种方式为按钮添加圆角(Radius化):
方法一:通过自定义按钮模板

在XAML中,可以通过自定义按钮的ControlTemplate来设置圆角。具体步调如下:

  • 定义一个ControlTemplate,并在此中利用Border控件。
  • 为Border控件设置CornerRadius属性。
示例代码:
  1. <Button Content="圆角按钮" Width="120" Height="40">
  2.     <Button.Template>
  3.         <ControlTemplate TargetType="{x:Type Button}">
  4.             <Border CornerRadius="10" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="1">
  5.                 <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
  6.             </Border>
  7.         </ControlTemplate>
  8.     </Button.Template>
  9. </Button>
复制代码
方法二:利用全局样式

假如需要为多个按钮设置同一的圆角样式,可以定义一个全局样式。
示例代码:
  1. <Window.Resources>
  2.     <Style x:Key="RoundButtonStyle" TargetType="{x:Type Button}">
  3.         <Setter Property="Template">
  4.             <Setter.Value>
  5.                 <ControlTemplate TargetType="{x:Type Button}">
  6.                     <Border CornerRadius="10" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="1">
  7.                         <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
  8.                     </Border>
  9.                 </ControlTemplate>
  10.             </Setter.Value>
  11.         </Setter>
  12.     </Style>
  13. </Window.Resources>
  14. <Button Content="圆角按钮" Width="120" Height="40" Style="{StaticResource RoundButtonStyle}"/>
复制代码
方法三:直接在Border控件中设置

假如按钮的内容是通过Border控件包装的,可以直接在Border控件中设置CornerRadius。
示例代码:
  1. <Button Content="圆角按钮" Width="120" Height="40">
  2.     <Button.Resources>
  3.         <Style TargetType="{x:Type Border}">
  4.             <Setter Property="CornerRadius" Value="10"/>
  5.         </Style>
  6.     </Button.Resources>
  7. </Button>
复制代码
方法四:通过代码动态设置

假如需要在代码中动态创建按钮并设置圆角,可以通过以下方式:
  1. Button myButton = new Button
  2. {
  3.     Content = "动态圆角按钮",
  4.     Width = 120,
  5.     Height = 40
  6. };
  7. var buttonTemplate = new ControlTemplate(typeof(Button))
  8. {
  9.     VisualTree = new FrameworkElementFactory(typeof(Border))
  10.     {
  11.         SetValue(Border.CornerRadiusProperty, new CornerRadius(10)),
  12.         SetValue(Border.BackgroundProperty, Brushes.LightBlue),
  13.         SetValue(Border.ChildProperty, new FrameworkElementFactory(typeof(ContentPresenter))
  14.         {
  15.             SetValue(ContentPresenter.HorizontalAlignmentProperty, HorizontalAlignment.Center),
  16.             SetValue(ContentPresenter.VerticalAlignmentProperty, VerticalAlignment.Center)
  17.         })
  18.     }
  19. };
  20. myButton.Template = buttonTemplate;
复制代码
以上方法可以根据现实需求选择利用,实现按钮的圆角结果。
回复

使用道具 举报

登录后关闭弹窗

登录参与点评抽奖  加入IT实名职场社区
去登录
快速回复 返回顶部 返回列表