listviewxamarinxamarin.iosxamarin.forms

Listview Separator Inset Full Width

So to my surprise, I haven't found anything on the web or SO on this particular issue. I'm trying to make my listview separator inset to be full width. I have found documentation on this for a tableview, here. But it's not clear to me how to do this for a listview as well? I am using Xamarin Forms listview, trying to accomplish this on iOS. I imagine I have to write a custom renderer, seeing as no (publically exposed) property is available on forms for a listview.

This is a good picture that is happening for me on a listview, although the image shown is from a SO question regarding tableview, not listview, but the issue seems to be the same.

enter image description here

Solution

  • The answer depends on whether you are using Xamarin Forms 3.0+ or earlier versions.

    Xamarin Forms 3.0 and higher

    A ListView on Xamarin Forms 3.0 and higher now exposes a SeparatorStyle property which can be set to a SeparatorStyle enum value, either Default or FullWidth. This has been provided via this PR.

    Make sure to set the SeparatorStyle property to FullWidth in order to achieve the wanted effect.

    Before Xamarin Forms 3.0

    You are correct that there isn't a property exposed through the Xamarin Forms ListView (which ultimately renders as a UITableView on iOS) to change the separator width. If you want to change the separator yourself, you will have to resort to a custom renderer and implement what you found in the other SO question.

    As a workaround, you could disable the separator visibility and then add a BoxView of 1 height to simulate a full width separator.