EmptyView overlaps with GlobalHeader, GlobalFooter and Content instead of going between GlobalHeader and GlobalFooter

[eth-ellis]

Currently the EmptyView overlaps with the GlobalHeader, GlobalFooter and Content.

On iOS it goes under the content.

On Android it goes over the content.

I have not been able to test this issue on Windows or Mac yet.

I believe the expected result should be that the EmptyView goes between the GlobalHeader and GlobalFooter when there are no items.

Repro link: https://github.com/eth-ellis/Issue-Repro/tree/main/VirtualListEmptyViewOverlap

Examples

iOS

Android

[Redth]

The global headers/footers are implemented as items in the list, however the empty view spans the entire area of the collection view. Without totally changing how global header/footer is implemented (and that has some question of preference too - do you want it to scroll/bounce with the content? or be fixed above/below the content always?), it's going to be very difficult to make the empty view fill the available area between the global header/footer as a list item.

I think the best path here is to simply have the global header/footer hidden when the adapter is empty, and if you want to continue to display some content like this, you can add it to the empty view template instead. You could even add the identical global header/footer content to the empty view template if you really want them to be the same (eg: use a grid with RowDefinitions="Auto,*,Auto" and stick the header/footer in row 0 and 2).