We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Different Corner Radii not Working

Thread ID:





144111 Apr 18,2019 08:14 PM UTC May 21,2019 01:01 PM UTC Xamarin.Forms 5
Tags: SfBorder
Asked On April 18, 2019 08:14 PM UTC


I am using SfBorder in my Xamarin Forms app. It is being used as a header to a bottom drawer that pops up when user taps on the map. I am trying to set the header so that the top two edges of the header are rounded and the bottom corners are not rounded. However when I try setting the corner radius for bottom edges as 0, the whole header shows as a rectangle (screenshot attached). Here is my XAML code for drawer-

            <RowDefinition Height="60"/>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
                                 <Grid Grid.Row="0">
                                    <TapGestureRecognizer Tapped="OnInfoButtonClicked" NumberOfTapsRequired="1"/>
                         <Image  Source="header_background.png" Aspect="AspectFill"/>
                 <StackLayout Orientation="Horizontal" Spacing="10">
                            <Label Text="Welcome to App" TextColor="{StaticResource ColorWhite}" HorizontalOptions = "StartAndExpand" Margin="16,5,10,5" VerticalOptions="Center" FontSize="Medium" FontAttributes="Bold" LineBreakMode="WordWrap"/>
                        <Label Grid.Row="1" Text="title" TextColor="#1D2E4E" HorizontalOptions="Center" FontSize="Medium" FontAttributes="Bold" Margin="5,5,5,2"/>
                        <Label Grid.Row="2" Text="text" TextColor="{StaticResource ColorGray}" HorizontalOptions="Center" FontSize="Small" LineBreakMode="WordWrap" VerticalOptions="CenterAndExpand" Margin="5,0,5,0" HorizontalTextAlignment="Center"/>
                        <ScrollView Grid.Row="3" Margin="5,2,5,5">
                             <Image   Source="partner.png" Aspect="AspectFit" />

  <Style TargetType="border:SfBorder" Class="PopupHeader">
                <Setter Property="CornerRadius" Value="10,10,10,10" />
                <Setter Property="VerticalOptions" Value="End" />
                <Setter Property="HorizontalOptions" Value="FillAndExpand" />

Enclosed zip file contains two screen shots titled "current" and "Error". Both screenshots show the header at the bottom of the page titled "Welcome to Boulder Area Trails". "Current" shows how the screen looks like currently with all four corners of the header having a corner radius of 10. "Error" shows how the screen looks like when I set the corner radius to 10,10,0,0. Please note that the top edges of header in "Error" are square with rounded corner hidden behind those.

I would appreciate if you can please help with this production issue.



Attachment: Archive_b2f53730.zip

Bharathiraja K [Syncfusion]
Replied On April 19, 2019 03:01 PM UTC

Hi Apurva, 
Thanks for using Syncfusion product. 
We have tried to replicate the reported issue at our end by creating a simple sample with the provided information that you mention in your last update, we are afraid that, we are not able to reproduce the issue at our end. 
You can also refer the Border customization sample in our application in play store. 
We are not able to reproduce this issue at our end, so can you please revert us by modifying the sample based on your application along with replication procedure. This will be helpful for us to investigate further and provide you a better solution at the earliest. 

Replied On April 19, 2019 03:05 PM UTC

Hi Bharathi,

Thank you for your response. You can replicate the issue I described by setting the Grid background color to any color other than white in your sample.



Bharathiraja K [Syncfusion]
Replied On April 25, 2019 09:59 AM UTC

Hi Apurva,  
Sorry for the inconvenience caused.  
We were able to reproduce the reported "Child of the border not get cropped while setting different corner radius" issue in iOS Platform at our end and logged a defect report. 
We will fix the issue and include in our upcoming weekly NuGet release and it will be planned to release on 7th May 2019.  

Bharathiraja K [Syncfusion]
Replied On May 7, 2019 12:47 PM UTC

Hi Apurva,  

Sorry for the inconvenience caused.  

We are not able to move this fix in the promised weekly NuGet and hence we have fixed and provided the patch for the reported “Child of the border not get cropped while setting different corner radii“ issue and it can be downloaded from the below link.  

Please find the patch setup from the below location.  

Please find the patch assemblies from the below location.  

Please find the NuGet from the below location.  

Assembly Version:  
Please note that we have created this patch for version specifically to resolve the issue reported in the forum 144111. If you have received other patches for the same version for other products, please apply all patches in the order received. This fix will be included in our next volume 1 SP 1 release which is scheduled to be rolled in the mid of May 2019.  

Please follow the below steps before applying the patch clear the NuGet cache in your machine and check  


Bharathiraja K [Syncfusion]
Replied On May 21, 2019 01:01 PM UTC

Hi Apurva, 
We are glad to announce that our weekly NuGet was rolled out today and fix for the reported issue was included in the weekly NuGet.   
NuGet Version:  
We thank you for your support and appreciate your patience in waiting for this release. Please get in touch with us if you would require any further assistance. 


This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon