xamarin-forms-docs/knowledge-base/button-with-border-and-cornerradius.md

title	description	type	page_title	slug	position	tags	ticketid	res_type
How to have Button with border and border radius	create button with border and border radius	how-to	How to have Button with border and border radius	button-with-border-and-borderradius		button, xamarin, border, corner, border, radius, xamarinforms, mobile		kb

Environment

Product Version	2019.2.802.1
Product	Button for Xamarin Cross-Platform

Description

This article shows how to have Button with border width and border radius

Border Radius

Here is an example how to have button with border and use border radius:

<Grid VerticalOptions="Center" HorizontalOptions="CenterAndExpand">
    <telerikInput:RadButton WidthRequest="54"
                            HeightRequest="54"
                            BorderWidth="10"
                            BorderRadius="10"
                            BorderColor="DarkRed"
                            BackgroundColor="LightCoral"/>
</Grid>

Corner Radius

Here is an example how to have button with border and use corner radius:

<Grid VerticalOptions="Center" HorizontalOptions="CenterAndExpand">
    <telerikInput:RadButton CornerRadius="10"
                            WidthRequest="54"
                            HeightRequest="54"
                            BorderWidth="10"
                            BorderColor="DarkRed"
                            BackgroundColor="LightCoral"/>
</Grid>