[Bug] Grouped CollectionView creates blank space at bottom of each grouping on iOS

[memis1970]

Description

A grouped Collection view with GroupHeaderTemplate and GridItemLayout defined as follows

<CollectionView.ItemsLayout>

</CollectionView.ItemsLayout>

and the following ItemSizingStrategy:

ItemSizingStrategy="{OnPlatform MeasureAllItems,iOS=MeasureFirstItem, Android=MeasureAllItems}"

creates blank space at the footer of each grouping. The amount added is proportional to the number of rows created for the group collection. I.e. the spacing will be greater if there are 4 rows than if there are 2.

Additionally the VerticalItemSpacing property affects the amount of blank space. I.e. the blank space will be greater if the VerticalItemSpacing value is set to 20 than if it is set to 10.

This appears only to be an issue on iOS.

Steps to Reproduce

1. Created CollectionView with the below configuration
2. Populate CollectionView
3. View on iOS

        <CollectionView.GroupHeaderTemplate>

            <DataTemplate>

                <StackLayout>

                    <Label Text="{Binding Name, StringFormat='Feature Group: {0}'}"
                        Margin="0,20,0,0"
                        TextColor="#03045E"
                        FontAttributes="Bold"
                        FontSize="16" />

                    <BoxView WidthRequest="100" HeightRequest="1" BackgroundColor="Black" Margin="0,0,0,10" />

                </StackLayout>

            </DataTemplate>

        </CollectionView.GroupHeaderTemplate>

        <CollectionView.ItemsLayout>
            <GridItemsLayout Orientation="Vertical"
                             Span="2"
                             VerticalItemSpacing="10"
                             HorizontalItemSpacing="10" />
        </CollectionView.ItemsLayout>
        
        <CollectionView.ItemTemplate>
            <DataTemplate>

                <StackLayout HeightRequest="130" BackgroundColor="{Binding Colour}">

                    <StackLayout VerticalOptions="CenterAndExpand" Padding="10,0,10,0">

                        <Label Text="{Binding Name}"
                                TextColor="White"
                                FontAttributes="Bold"
                                VerticalTextAlignment="Center"
                                HorizontalTextAlignment="Center"
                                FontSize="16">
                        </Label>

                        <Label Text="{Binding Description}"
                                TextColor="White"
                                VerticalTextAlignment="Center"
                                HorizontalTextAlignment="Center"
                                FontSize="14"
                                LineHeight="1.15">
                        </Label>

                    </StackLayout>

                    <StackLayout.GestureRecognizers>
                        <TapGestureRecognizer Command="{Binding Path=BindingContext.FeatureCommand, Source={x:Reference Name=MainFunctionsView}}"
                            CommandParameter="{Binding .}">                                    
                        </TapGestureRecognizer>
                    </StackLayout.GestureRecognizers>

                </StackLayout>

            </DataTemplate>
        </CollectionView.ItemTemplate>
        
    </CollectionView>

Expected Behavior

No added blank space should appear on the footer of each group.

Actual Behavior

Blank space is rendered that appears to be affected by the number of rows in the group collection and the VerticalItemSpacing property value.

Basic Information

• Version with issue: Xamarin.Forms 5.0.0.2012
• Last known good version: unknown
• Platform Target Frameworks:
  • iOS: 15.2.0.17
  • Android: n/a
  • UWP: n/a
• Android Support Library / AndroidX Version: n/a
• NuGet Packages: Prism
• Affected Devices: iOS

Environment

Show/Hide Visual Studio info

=== Visual Studio Community 2019 for Mac === 

Version 8.10.13 (build 11)
Installation UUID: ca2d4cfb-16a6-45fe-9c48-dc1d557aad54
GTK+ 2.24.23 (Raleigh theme)
Xamarin.Mac 6.18.0.23 (d16-6 / 088c73638)

Package version: 612000140

=== Mono Framework MDK ===

Runtime:
Mono 6.12.0.140 (2020-02/51d876a041e) (64-bit)
Package version: 612000140

=== Roslyn (Language Service) ===

3.10.0-4.21269.26+029847714208ebe49668667c60ea5b0a294e0fcb

=== NuGet ===

Version: 5.9.0.7134

=== .NET Core SDK ===

SDK: /usr/local/share/dotnet/sdk/5.0.402/Sdks
SDK Versions:
5.0.402
5.0.301
3.1.414
3.1.410
MSBuild SDKs: /Applications/Visual Studio.app/Contents/Resources/lib/monodevelop/bin/MSBuild/Current/bin/Sdks

=== .NET Core Runtime ===

Runtime: /usr/local/share/dotnet/dotnet
Runtime Versions:
5.0.11
5.0.7
3.1.20
3.1.16

=== .NET Core 3.1 SDK ===

SDK: 3.1.414

=== Xamarin.Profiler ===

Version: 1.6.15.68
Location: /Applications/Xamarin Profiler.app/Contents/MacOS/Xamarin Profiler

=== Updater ===

Version: 11

=== Apple Developer Tools ===

Xcode 13.1 (19466)
Build 13A1030d

=== Xamarin.Mac ===

Xamarin.Mac not installed. Can't find /Library/Frameworks/Xamarin.Mac.framework/Versions/Current/Version.

=== Xamarin Designer ===

Version: 16.11.0.39
Hash: cd672761d
Branch: remotes/origin/d16-11
Build date: 2021-10-06 20:09:18 UTC

=== Xamarin.iOS ===

Version: 15.2.0.17 (Visual Studio Community)
Hash: 738fde344
Branch: xcode13.1
Build date: 2021-11-09 02:45:16-0500

=== Xamarin.Android ===

Not Installed

=== Eclipse Temurin JDK ===

Java SDK: Not Found

Android Designer EPL code available here:
https://github.com/xamarin/AndroidDesigner.EPL

=== Android SDK Manager ===

Version: 16.10.0.13
Hash: 1b81df5
Branch: remotes/origin/d16-10
Build date: 2021-09-28 20:47:12 UTC

=== Android Device Manager ===

Version: 16.10.0.15
Hash: 89dcc0b
Branch: remotes/origin/d16-10
Build date: 2021-09-28 20:47:30 UTC

=== Build Information ===

Release ID: 810130011
Git revision: 53e3946a0f6b630a1124eb7ff26c1b545d040d32
Build date: 2021-11-04 11:20:46-04
Build branch: release-8.10

=== Operating System ===

Mac OS X 10.16.0
Darwin 20.5.0 Darwin Kernel Version 20.5.0
    Sat May  8 05:10:31 PDT 2021
    root:xnu-7195.121.3~9/RELEASE_ARM64_T8101 x86_64

Build Logs

Screenshots

Reproduction Link

Workaround

[jfversluis]

I see you mention version 2012, could you try the latest one and confirm this is still an issue there?

[memis1970]

@jfversluis Hi there, I just updated to 5.0.0.2244 and I still see the same issue.

Just noticed I missed some code of for the CollectionView above:

<CollectionView ItemsSource="{Binding Groups}" 
                        IsGrouped="True"
                        ItemSizingStrategy="{OnPlatform MeasureAllItems,iOS=MeasureFirstItem, Android=MeasureAllItems}"
                        Margin="10,0,10,10">

I've noticed a weird issue with the same CollectionView on Android with ItemSizingStrategy, hence the OnPlatform difference but that's another issue.

[jfversluis]

Thanks for verifying!