Bug 41252 - Unable to change ListView GroupHeaders separator color
Summary: Unable to change ListView GroupHeaders separator color
Alias: None
Product: Forms
Classification: Xamarin
Component: Android ()
Version: 2.3.0
Hardware: PC Mac OS
: Normal enhancement
Target Milestone: ---
Assignee: Bugzilla
Depends on:
Reported: 2016-05-23 11:44 UTC by John Miller [MSFT]
Modified: 2018-04-13 11:21 UTC (History)
15 users (show)

Tags: ac
Is this bug a regression?: ---
Last known good build:

Sample Project (81.58 KB, application/zip)
2016-05-23 11:44 UTC, John Miller [MSFT]
Group Header seperator (320.75 KB, image/png)
2018-03-23 10:47 UTC, neil.alderson
Group Header seperator example (126.71 KB, image/jpeg)
2018-03-23 10:52 UTC, neil.alderson

Notice (2018-05-24): bugzilla.xamarin.com is now in read-only mode.

Please join us on Visual Studio Developer Community and in the Xamarin and Mono organizations on GitHub to continue tracking issues. Bugzilla will remain available for reference in read-only mode. We will continue to work on open Bugzilla bugs, copy them to the new locations as needed for follow-up, and add the new items under Related Links.

Our sincere thanks to everyone who has contributed on this bug tracker over the years. Thanks also for your understanding as we make these adjustments and improvements for the future.

Please create a new report for Bug 41252 on Developer Community or GitHub if you have new information to add and do not yet see a matching new report.

If the latest results still closely match this report, you can use the original description:

  • Export the original title and description: Developer Community HTML or GitHub Markdown
  • Copy the title and description into the new report. Adjust them to be up-to-date if needed.
  • Add your new information.

In special cases on GitHub you might also want the comments: GitHub Markdown with public comments

Related Links:

Description John Miller [MSFT] 2016-05-23 11:44:42 UTC
Created attachment 16070 [details]
Sample Project


   When using a ListView Grouping header, there is a ~1px separator between the cell below it. We are unable to find a way to remove or change the color of this.

**Steps to Reproduce:**

   1. Run the attached project on Android simulator

**Actual Results:**

   There are two group headers which have a blue colored separator underneath them.

**Expected Results:**

   Would like to know what this is and how to style/theme and remove it.

**Build Date & Platform:**

   XF 2.2

**Additional Information:**

   I've tried multiple Android styles/themes and I can't get it to work. I am unsure what this view actually is.
Comment 1 ray.qu 2017-02-22 03:43:32 UTC
Same to iOS. In iOS there is a light-light-gray line underneath the header view almost invisible, but if you look on real device e.g. iPhone 7 plus, you could still see it.
Comment 2 ray.qu 2017-02-22 03:49:08 UTC
Edit:Same to iOS. In iOS there is a light-light-gray line underneath the header view almost invisible. But if you make the header view to white and look on real device e.g. iPhone 7 plus, you could still see it.
Comment 3 Gerco Brandwijk 2017-05-15 11:14:14 UTC
Having the same issue.

When is this planned to be resolved?
Comment 4 LoossSS 2017-07-26 20:59:46 UTC
I'm having the same issue. iOS and Android are having the same behavior except it's not the same color. Seems like the "accent" color. I can upload screenshots and/or code if you want.

A workaround is to set the "SeparatorColor" of the ListView as the same color as the ListView BackgroundColor (even if you set the SeparatorVisibility to "None"). That makes the line disappear on Android (still there on iOS).
Comment 5 Anders Bech Mellson 2017-09-08 19:27:42 UTC
Any update on this one?
Comment 6 tarekjihad 2017-09-19 12:14:05 UTC
Hi guys.
Just change the SeparatorColor of the ListView to same color of your background (ListView Backgroundcolor).
that will solve it.
Comment 7 tarekjihad 2017-09-19 12:29:32 UTC
I forgot!
you can then add your own separator to the GroupHeaderTemplate
for example (StackLayout with height = 1)
Comment 8 John Miller [MSFT] 2017-09-19 16:59:00 UTC
Thanks for the workaround ideas tarekjihad. Unfortunately, those are not solutions for the case that prompted this bug report.
Comment 9 neil.alderson 2018-03-23 10:47:45 UTC
Created attachment 26228 [details]
Group Header seperator

This is still an issue in Xamarin Form 2.5.0 (iOS only, Droid seems to be OK) - please see attached screenshot of our App on iOS, you will notice a very thin line underneath the date group headers in our ListView
Comment 10 neil.alderson 2018-03-23 10:52:11 UTC
Created attachment 26229 [details]
Group Header seperator example

Apologies, my previous attachment was the wrong screenshot. This is the correct one
Comment 11 Iain Smith 2018-04-13 11:21:31 UTC
This still happens in