Button with and without a custom control template

I have a two button controls. I used custom control template for Cancel button. Copy this code and Run the application. You can see the general Rectangle button and one Ellipse shaped button. Ellipse shaped button is created by using custom control template.

 

<Window.Resources>

<Style x:Key="XXXX" TargetType="Button">

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="{x:Type Button}">

<Grid>

<Ellipse Fill="{TemplateBinding Background}" Stroke="{TemplateBinding BorderBrush}"/>

<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>

</Grid>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

</Window.Resources>

 

<Grid Height="251" Width="295">

<Button Margin="58,59,0,0" Name="button1" Height="38" VerticalAlignment="Top" HorizontalAlignment="Left" Width="60" Background="HotPink">

<Button.BitmapEffect>

<OuterGlowBitmapEffect GlowColor="HotPink" />

</Button.BitmapEffect> OK

</Button>

 

<Button Margin="0,59,64,0" Name="button2" Height="38" HorizontalAlignment="Right" VerticalAlignment="Top" Width="73" Style="{StaticResource XXXX}" Background="BlueViolet">

<Button.BitmapEffect>

<OuterGlowBitmapEffect GlowColor="BlueViolet" />

</Button.BitmapEffect>Cancel</Button>

</Grid>