Xamarin.forms: Shell: CollectionView or ListView content in a top tab ShellContent page is obscured behind top tabs on iOS

Created on 6 Jun 2019  路  6Comments  路  Source: xamarin/Xamarin.Forms

Description

CollectionView or ListView content in a ShellContent's page is obscured behind the tabs on iOS. It appears that perhaps the top insets are incorrect. Video of the behavior: https://www.youtube.com/watch?v=_NuOoiVpHrw

Issue exists only in iOS, not Android.

Wrapping the CollectionView or ListView in a ScrollView appears to fix the insets problem, but then pull-to-refresh doesn't work because the ScrollView receives the gestures, not the nested ListView. (Not an issue for CollectionView yet, of course, because CollectionView doesn't yet support pull-to-refresh.)

I only included CollectionView in my repro sample.

Steps to Reproduce

Build and run this sample repo:
https://github.com/jsauve/Xamarin.Forms.4.0.0.482894_TopTabs-CollectionView-Insets-Bug

Expected Behavior

The top of the CollectionView or ListView is not obscured behind the top tabs.

Actual Behavior

The top of the CollectionView or ListView is obscured behind the top tabs.

Basic Information

My local dev environment details:
https://gist.github.com/jsauve/6eb67803db786def5d8f8c74b308f95d

Screenshots

Video:
https://www.youtube.com/watch?v=_NuOoiVpHrw

Reproduction Link

Build and run this sample repo:
https://github.com/jsauve/Xamarin.Forms.4.0.0.482894_TopTabs-CollectionView-Insets-Bug

collectionview listview shell 3 iOS 馃崕 bug

Most helpful comment

@jsauve your issue should be resolved by this PR

https://github.com/xamarin/Xamarin.Forms/pull/6457

I've attached a nuget you can test.
Insets.zip

All 6 comments

Duplicate of #6238

Hi @samhouts, I'm not entirely sure that my issue is the same as #6238. I have used Page.UseSafeArea="true" as mentioned in #6238, but I'm still seeing the same results with the top of a CollectionView or ListView being obscured by the top tabs. My issue certainly seems similar, but I'm seeing the issue on iPhone X and greater device form factors as well as older non-notched device form factors, like iPhone 8. My layout is a little different than those described in #6238 because I have ONLY top tabs, not bottom tabs. And I'm seeing it on each of my pages that is a ShellContent, not on subsequent navigations from those ShellContent pages. So, while it seems very similar, I am unable to resolve by marking my ContentPage XAML with xmlns:ios="clr-namespace:Xamarin.Forms.PlatformConfiguration.iOSSpecific;assembly=Xamarin.Forms.Core" ios:Page.UseSafeArea="true". I had actually considered and tried that prior to submitting my bug report, but to no avail.

Please take a look at my sample repo when you have a chance. Thanks!

@samhouts, Hi Sam, just trying to reach out again to clarify that I do not believe my issue is the same as #6238. If it is, then what have gleaned is that usingUseSafeArea="true ought to solve my issue, but it does not. Any advice here would be greatly appreciated. Again, please check out my sample repo, which is based largely on the default Shell project template and the data from the CollectionView sample.

@jsauve your issue should be resolved by this PR

https://github.com/xamarin/Xamarin.Forms/pull/6457

I've attached a nuget you can test.
Insets.zip

@jsauve Sorry for the delayed response, by the way. I did notice your reply and thought I had taken action. Thank you for the reminder!

No worries! Thanks @samhouts & @PureWeen! You guys rock!

Was this page helpful?
0 / 5 - 0 ratings