Make Custom Button using Rectangle in WPF

You can create and use your own custom button control in WPF. Custom buttons may be helpful to create the user interface more interactive and cool.

In the given example, we are creating a custom button from a rectangle:

        <UserControl>

            <UserControl.Resources>

            <Style x:Key="ButtonStyle1" TargetType="{x:Type Button}">

                <Setter Property="Template">

                    <Setter.Value>

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

                            <Grid>

                                <Rectangle Fill="Navy"  RadiusY="10" RadiusX="10" Stroke="Red"/>

                                <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>

                            </Grid>                           

                        </ControlTemplate>

                    </Setter.Value>

                </Setter>

            </Style>

            </UserControl.Resources>

            <Grid x:Name="LayoutRoot">

            <Button Content="Button" Foreground ="White"  HorizontalAlignment="Center" Height="40" Margin="0" Style="{DynamicResource ButtonStyle1}" VerticalAlignment="Center" Width="100" Name="Button1" />

            </Grid>

        </UserControl>

Note: Don't Copy the code from here. Download the file attached herewith.

The above code generate the following button, as shown in below image: