[Android] The footer in a CollectionView disappears when the number of items changes to an even number.

[vecalion]

Description

Android only.

When there is a CollectionView (with a Header and a Footer) that is bound to an ObservableCollection, each time when the number of items in the ObservableCollection changes to an even number, the Footer disappears and appears again when the number is changed to an odd number.

https://github.com/dotnet/maui/assets/15178829/b88bb603-4bc2-467c-b45f-2152d743c4f5

Steps to Reproduce

1) Open and run the repro project 2) Tap on the Add / Remove item buttons

Link to public reproduction project repository

https://github.com/vecalion/maui-android-collectionview-footer-issue

Version with bug

8.0.7 SR2

Is this a regression from previous behavior?

Yes, this used to work in Xamarin.Forms

Last version that worked well

Unknown/Other

Affected platforms

Android

Affected platform versions

No response

Did you find any workaround?

Option 1) Don't use an ObservableCollection. Replace the entire collection when a change is made.

Option 2) Once this is merged https://github.com/dotnet/maui/pull/22889, switch to using the templated versions of the properties

Option 3) The problem with using Footer/Header, is that when android animates the footer down a row, it wants there to be two "footers" on the screen. We don't really support having two handlers against one view so it unfortunately gets removed once the animation finishes. This is why it works every other time, because when we add another item the previous footer is no longer on the screen so it doesn't get into a confused state. You can work around this by disabling animations on the RecyclerView

var builder = MauiApp.CreateBuilder();
        builder
            .UseMauiApp<App>()
            .ConfigureFonts(fonts =>
            {
                fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
                fonts.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
            })

            #if ANDROID
            .ConfigureMauiHandlers(_=> 
            {
                CollectionViewHandler.Mapper.Add("DisableAnimation", (handler, view) =>
                {
                    handler.PlatformView.SetItemAnimator(null);
                });
            })
            #endif
            ;

Relevant log output

No response

[ghost]

We've added this issue to our backlog, and we will work to address it as time and resources allow. If you have any additional information or questions about this issue, please leave a comment. For additional info about issue management, please read our Triage Process.

[XamlTest]

Verified this on VS 17.10.0 Preview 2.0(8.0.10). Repro on Android 14.0-API34 with below Project: CollectionViewAndroidIssue.zip

[jaakkohurtta]

As a workaround, I found Option 2 to be very acceptable and worked great (VS 17.10.4, MAUI 8.0.61).

Relevant docs: Microsoft Learn