Create Circle Button

 

You could easily create circular buttons with RadButton by adjusting its Width, Height and BorderRadius properties following the next instructions:

  • Width should be equal to Height;
  • BorderRadius should be set to half Width/Height value;

In some cases, you may need to set a BorderWidth value in order for BorderRadius to take effect.

Here is a quick example:

<telerikInput:RadButton WidthRequest="120" 
                        HeightRequest="120"                                
                        Text="Circle Button" 
                        FontSize="Micro" 
                        TextColor="White" 
                        BackgroundColor="DarkBlue" 
                        CornerRadius="60"  />

Add the namespace:

xmlns:telerikInput="clr-namespace:Telerik.XamarinForms.Input;assembly=Telerik.Maui.Controls.Compatibility"

CornerRadius property does not work on Android as it is still not supported check this ifo here.

How it looks:

Button Key Features Example

See Also

In this article
Not finding the help you need?