Set CornerRadius on button template Set CornerRadius on button template wpf wpf

Set CornerRadius on button template


You're not limited to the dependency properties of the control you're templating. In this case, while Button does not have a CornerRadius property, Border does, so you can use Border.CornerRadius instead:

<Style TargetType="Button" x:Key="TabButton">    <Setter Property="Background" Value="White" />    <Setter Property="TextBlock.TextAlignment" Value="Center" />    <Setter Property="Template">        <Setter.Value>            <ControlTemplate TargetType="Button">                <Border CornerRadius="{TemplateBinding Border.CornerRadius}"                         Background="White" BorderBrush="#ccc"                         BorderThickness="0,1,1,0" >                    <ContentPresenter x:Name="contentPresenter"                                       ContentTemplate="{TemplateBinding ContentTemplate}"                                       Content="{TemplateBinding Content}"                                       HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"                                      Margin="{TemplateBinding Padding}"                                       VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>                </Border>            </ControlTemplate>        </Setter.Value>    </Setter></Style><Style TargetType="Button" x:Key="TabButtonFirst" BasedOn="{StaticResource TabButton}">    <Setter Property="Border.CornerRadius" Value="3,0,0,0" /></Style><Style TargetType="Button" x:Key="TabButtonLast" BasedOn="{StaticResource TabButton}">    <Setter Property="Border.CornerRadius" Value="0,0,0,3" /></Style>

With this approach, you no longer need to maintain multiple copies of your control template.


As Nitesh has said you do not have a CornerRadius Property on the Button, it is a property of the Border as you have shown in your first style, just duplicate your first Style and change the CornerRadius, then assign it to the Style of the appropriate Button.

<Window x:Class="WpfApplication1.MainWindow"        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"        Title="MainWindow" Height="350" Width="525">    <Window.Resources>        <Style TargetType="Button" x:Key="TabButton">            <Setter Property="Background" Value="White" />            <Setter Property="TextBlock.TextAlignment" Value="Center" />            <Setter Property="Template">                <Setter.Value>                    <ControlTemplate TargetType="Button">                        <Border CornerRadius="0" Background="White" BorderBrush="#ccc" BorderThickness="0,1,1,0" >                            <ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>                        </Border>                    </ControlTemplate>                </Setter.Value>            </Setter>        </Style>        <Style TargetType="Button" x:Key="TabButtonFirst">            <Setter Property="Background" Value="White" />            <Setter Property="TextBlock.TextAlignment" Value="Center" />            <Setter Property="Template">                <Setter.Value>                    <ControlTemplate TargetType="Button">                        <Border CornerRadius="3,0,0,0" Background="White" BorderBrush="#ccc" BorderThickness="0,1,1,0" >                            <ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>                        </Border>                    </ControlTemplate>                </Setter.Value>            </Setter>         </Style>         <Style TargetType="Button" x:Key="TabButtonLast">            <Setter Property="Background" Value="White" />            <Setter Property="TextBlock.TextAlignment" Value="Center" />            <Setter Property="Template">                <Setter.Value>                    <ControlTemplate TargetType="Button">                        <Border CornerRadius="0,0,0,3" Background="White" BorderBrush="#ccc" BorderThickness="0,1,1,0" >                            <ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>                        </Border>                    </ControlTemplate>                </Setter.Value>            </Setter>        </Style>      </Window.Resources>        <Grid Background="Black">        <Button Style="{StaticResource TabButton}" Content="Button" Height="23" HorizontalAlignment="Left" Margin="12,72,0,0" Name="button1" VerticalAlignment="Top" Width="75" />        <Button Style="{StaticResource TabButtonFirst}" Content="Button" Height="23" HorizontalAlignment="Left" Margin="10,43,0,0" Name="button2" VerticalAlignment="Top" Width="75" />        <Button Style="{StaticResource TabButtonLast}" Content="Button" Height="23" HorizontalAlignment="Left" Margin="12,101,0,0" Name="button3" VerticalAlignment="Top" Width="75" />    </Grid></Window>

enter image description here


Just create a new Button like this:

<!--Button-->            <Button                 Name="myButton"               Content="OK"               FontFamily="Century Gothic"               Foreground="white"               Background="CornflowerBlue"               BorderThickness="0"               Padding="10"               Margin="10,5">                <Button.Resources>                    <Style TargetType="{x:Type Border}">                        <Setter Property="CornerRadius" Value="7"/>                    </Style>                </Button.Resources>            </Button>