How to partially cut ViewCell separator line in Xamarin Forms?

c#, xamarin.forms, xamarin.ios

Solution

I am novice to xamarin but, According to this post you need to do this on the UITableView and on your UITableViewCell subclasses.

I hope this will help you. :)

Problem

I am using `ViewCell` to create rows in my table settings page. I have a setting to select a Light or Dark theme. ``` <ViewCell Height="50"> <StackLayout x:Name="darkTheme" VerticalOptions="FillAndExpand" Padding="20,0,20,0"> <StackLayout Orientation="Horizontal" VerticalOptions="CenterAndExpand"> <Label Text="Dark" XAlign="Center" FontSize="15"/> <Label x:Name="darkThemeCheckmark" Text="{x:Static local:FontAwesome.FACheck}" FontFamily="FontAwesome" XAlign="Center" IsVisible="false" FontSize="12" HorizontalOptions="EndAndExpand"/ </StackLayout> </StackLayout> </ViewCell> <ViewCell Height="50"> <StackLayout x:Name="lightTheme" VerticalOptions="FillAndExpand" Padding="20,0,20,0"> <StackLayout Orientation="Horizontal" VerticalOptions="CenterAndExpand"> <Label Text="Light" XAlign="Center" FontSize="15"/> <Label x:Name="lightThemeCheckmark" Text="{x:Static local:FontAwesome.FACheck}" FontFamily="FontAwesome" XAlign="Center" IsVisible="false" FontSize="12"/> </StackLayout> </StackLayout> </ViewCell> ``` Whenever I switch from dark to light theme, there is faint light line on the left side between my rows that I can't seem to get rid of. Please refer to the images below: In my renderer I have set the following: ``` tableView.LayoutMargins = new UIEdgeInsets() { Left = 20 }; cell.SeparatorInset = new UIEdgeInsets() { Left = 20 }; cell.LayoutMargins = new UIEdgeInsets() { Left = 20 }; ``` Anyone knows how to get rid of this line? Edit: I wanted it to look like below:

Original source

Related problems