ListView has a unexpected top padding on iOS 15

[jfversluis]

Xamarin ios 15.0.0.6, iOS 15, listviews are a bit under their normal location. I found this issue on only iOS 15 devices/simulators. Take a look:

Originally posted by @ShadowOfPhantom in xamarin/xamarin-macios#12778 (comment)

See this SO Question for a workaround.

Repro: https://github.com/xamarin/Xamarin.Forms/files/7259501/TestApp.zip

[jdinnen]

I have a similar issue on ios15, the list view looks like its cutting off the bottom too soon.

[jfversluis]

Hm looks like something different though. If you could get a reproduction sample for that, that would be really helpful!

[jdinnen]

Hm looks like something different though. If you could get a reproduction sample for that, that would be really helpful!

I will see if I can get a standalone version of this. If I switch from ListView to CollectionView it will work on iOS and Android but blows up my navigation on UWP.

[jdinnen]

I should add, this only happens if I build using 15.0.0.x and Xcode 13 on Visual studio for Mac (not been able to set up windows yet). If I build on Xcode 12.5.1 and 14.20.0.x it is ok.

[ahoke-cr]

@jdinnen is this inside a ScrollView? I have seen intermittent issues where a portion of the bottom of a collection view inside a ScrollView viewport is cut off

[jdinnen]

@jdinnen is this inside a ScrollView? I have seen intermittent issues where a portion of the bottom of a collection view inside a ScrollView viewport is cut off

No, it is not inside a scrollview, it is inside a grid, but I do appreciate the heads up...

[jfversluis]

All very useful information, thanks! :) That reproduction will be very helpful though to see what elements are exactly at play here

[jsuarezruiz]

Thanks for all the feedback, need more time to validate #14671 but we hope to have a fix soon.

[jdinnen]

I was able to reproduce this in a standalone project. Just run the ios version with xamarin.ios-15.0.0.6, xcode 13 and the latest version of VS Mac (8.10.10). I can get the UI to behave as a CollectionView, but that causes me issues on UWP so I need to get this working as a ListView

https://www.dropbox.com/s/zr7dd58rtauywir/TestApp.zip?dl=0

[jfversluis]

Thanks @jdinnen however, I can't download the file, it needs credentials. You can upload the zip straight to GitHub as well, just drag it in the comment box here :)

[jdinnen]

I was able to reproduce this in a standalone project. Just run the ios version with xamarin.ios-15.0.0.6, xcode 13 and the latest version of VS Mac (8.10.10). I can get the UI to behave as a CollectionView, but that causes me issues on UWP so I need to get this working as a ListView

https://www.dropbox.com/s/zr7dd58rtauywir/TestApp.zip?dl=0

Ok try this link , it won't let me add the attachment, when I do it just says "is not included in the list" and comment is frayed out.
https://www.dropbox.com/s/eg7od0z8o515x5l/TestApp.zip?dl=0

[jfversluis]

Probably because of the file size :) I could download this one! Removed all bin/obj folders and reuploaded here so we don't lose it. Thanks!

TestApp.zip

[jdinnen]

Probably because of the file size :) I could download this one! Removed all bin/obj folders and reuploaded here so we don't lose it. Thanks!

TestApp.zip

Ok so I think I was able to fix my issue by saying HasUnevenRows="True" in the ListView, If I define a RowHeight and say HasUnevenRows="False" I get this problem. If I remove the RowHeight and try and define a height inside the Viewcell, eg the first frame which is 60pt, it completely ignores it from what I can tell so I need to use a RowHeight on the ListView itself.

[jfversluis]

Oh that is good information, thank you! We have a potential fix in the works, but having issues building it on our pipeline right now. As soon as we do have it, I'd like to ask you to test and and verify it fixes the issue for you.

I'll keep you updated!

[jfversluis]

@jdinnen and others, a PR for this is open now (#14671), would you be able to grab the NuGet as described here and let us know if this fixes this issue? That will greatly speed up the review process.

Besides verifying if this particular issue is fixed also be sure to check other scenarios in the same area to make sure that this fix doesn't accidentally has side-effects 🙂

Thanks!

[jdinnen]

@jdinnen and others, a PR for this is open now (#14671), would you be able to grab the NuGet as described here and let us know if this fixes this issue? That will greatly speed up the review process.

Besides verifying if this particular issue is fixed also be sure to check other scenarios in the same area to make sure that this fix doesn't accidentally has side-effects 🙂

Thanks!

Hey there, maybe Im doing something wrong... I added the nuget package as described and updated to 5.0.0.7624 and built on Xamarin iOS 15.0.0.6 and Xcode 13, it did not fix the issue with the test app when I set the HasUnevenRows="False". I also tried it on another app that was experiencing both these issues, the space at the top and the cut off bottom row. It does not seem to have made any difference.

This is how it looks when build with Xcode 12.5.1 and Xamarin.IOS 14.16 (via AppCenter) on Xamarin forms 5.0.0.1874

[AlleSchonWeg]

@jdinnen
You need Version 5.0.0.7625 not 5.0.0.7624. ;)

[jfversluis]

As pointed out by @AlleSchonWeg you'll need the exact version mentioned in the PR. Could you confirm with that one?

@AlleSchonWeg did you happen to try it?

[AlleSchonWeg]

@jfversluis
No. I don't have this problem.

[jfversluis]

Then just thanks for being helpful to others! Appreciate it!

[jdinnen]

As pointed out by @AlleSchonWeg you'll need the exact version mentioned in the PR. Could you confirm with that one?

@AlleSchonWeg did you happen to try it?

My bad, I went for the latest and greatest at the time which was showing as 5.0.0.7624...

Ok drum roll...

The list views are FIXED in my dummy app (the one posted earlier) and my two production apps! !! I used Xamarin iOS 15.0.0.6 and Xcode 13, with 5.0.0.7625.

Thank you for your hard work!

[jfversluis]

No worries! I updated the instructions a little bit to make that more clear. It's a bit of an oversight when you're working on this stuff daily that I know how it all fits together, but that doesn't mean that you all know that as well ;)

Thanks for working with us on verifying this!

[pboisso]

Following. The padding issue is still there with XF 4.8 with the latest VStudio and Xamarin.iOS. Any fixes in Xamarin.iOS rather than XF 5.x?

[jfversluis]

Following. The padding issue is still there with XF 4.8 with the latest VStudio and Xamarin.iOS. Any fixes in Xamarin.iOS rather than XF 5.x?

Unfortunately not, this will only be fixed in Forms 5. The only other option you have is write a custom renderer :)

What is the reason you won't upgrade?

[pboisso]

Hi @jfversluis, this sounds like a good candidate for a hot fix in XF4.8 also, is not it? This seems to be affecting all version of XF, why not handle the issue in Xamarin.iOS instead? Otherwise, all XF apps using listviews will be broken from now on, which is quite serious. BTW, we do not upgrade to XF5 because of #13291 still not being fixed over a year after being reported. It's getting harder and harder to develop with XF when issues are not being addressed on a timely manner.

[jfversluis]

You're the first one asking for it, so I guess it's not as pressing as you might think :) and as mentioned, it should be an easy fix with a custom renderer.

In regard to the other bug you mentioned, why use the iOS API for that? We have a Forms API to change the color of the navbar, right?

I'll be more than happy to have a look at this one if we can see to fix that so you can be unblocked to upgrade to newer versions.

Instead of focussing on supporting and hotfixing older versions I would rather focus on seeing what I can do to get you on newer versions. That will be better for everyone in the end. Could you reach out through email maybe to talk about this further? My email should be on my GitHub profile.

[pboisso]

@jfversluis, thanks again for the suggestion, we were able to fix the unexpected top padding on iOS in XF4.8 using a custom renderer. Here is the code if any other developers are following this thread.

`
public class LVRenderer : ListViewRenderer
{
public LVRenderer()
{
}

    protected override void OnElementChanged(ElementChangedEventArgs<ListView> e)
    {
        base.OnElementChanged(e);
        if (Control != null)
        {
            if (UIDevice.CurrentDevice.CheckSystemVersion(15, 0))   
                Control.SectionHeaderTopPadding = new nfloat(0);
        }
    }
}

`

[jfversluis]

Thanks for sharing!