[Bug] ListView Group Header Height Doesn't Autosize to Content

[foehammer88]

Description

ListView Group Header height doesn't autosize to content. Unlike ListView cells and Headers, that auto size their heights to content, ListView Group Headers do not auto size, thus causing manual calculations of label height and sizes to set the height, which introduces bugs on various platforms and device sizes.

Steps to Reproduce

1. Create a Sample project with a ListView and data source
2. Make ListView data source support Item Groups
3. Populate Groups with Items, where at least one Group title is very long
4. Bind the data in ListView XAML

Expected Behavior

ListView Group Headers should auto size to content and not have any adverse visual artifacts.

Actual Behavior

ListView Group Header height stays constant and label/content spills out beneath the Group Header

Basic Information

• Version with issue: 4.3.0.991211
• Last known good version: ?
• IDE: Visual Studio for Mac 8.3.10 (build 2)
• Platform Target Frameworks:
  • iOS: iOS 13.2.2
  • Android: 10.0
• Nuget Packages:
  • Xamarin.Forms 4.3.0.991211
  • Xamarin.Essentials 1.3.1
• Affected Devices:
  • iPhone
  • Android

Screenshots

Reproduction Link

ListViewGroupHeaderHeightIssueProject.zip

[nbevans]

Duplicate of #3769 (comment)

Fix proposed in here but not dealt with by XF team yet.

PS: It only affects iOS (out of the main 3 platforms). We had no issues getting group headings to properly size on Android or UWP.

[PureWeen]

@foehammer88 @nbevans have you tried this with CollectionView?

I tried the attached sample and it looks like the group header sizes correctly

[nielscup]

Same issue here (Xamarin.Forms 4.2.0.778463): groupHeader does not auto size on iOS, Android works fine. Also when visibility of the view inside the groupHeader is set to false, the groupHeader still takes up the original space on iOS.

[nbevans]

@foehammer88 @nbevans have you tried this with CollectionView?

I tried the attached sample and it looks like the group header sizes correctly

@PureWeen No I haven't tried CollectionView - but a lot of codebases are still using ListView.

[Jeanjean]

The following workaround worked for me:

public class GroupHeaderCell : ViewCell
{
    public GroupHeaderCell()
    {
        StackLayout layout = new StackLayout
        {
            Padding = 16,
            Children =
            {
                new Label { Text = "Header Title" },
                new Label { Text = "Some dynamic description of unknown rendered height" }
            }
        };
        layout.SizeChanged += (object sender, EventArgs e) =>
        {
            Height = layout.Height;
            ForceUpdateSize();
        };

        View = new StackLayout
        {
            Children = {
                layout
            }
        };
    }
}

It uses the Layout's OnSizeChanged event, but to allow the StackLayout to properly autosize inside a ViewCell it needs to be wrapped in an outer StackLayout. Also the ListView's HasUnevenRows should be set to true.

[EnglishDave]

This is STILL a problem. I know that the team's focus is on MAUI, but we were promised quality improvement updates. Come on, this has been open for almost 2 years.

[eli191]

Still got this crash today in release only, with MAUI and .NET 7.
In XAML cross platform view, I put a StackLayout around my ListView and set HasUnevenRows to True following @Jeanjean recommendation, now I avoid the crash but still my list is empty, when it is not in debug.