[Bug] ListView and CollectionView do not consider VerticalOption="Start"

[MaxenceSAUNIER]

Description

By default, ListView and CollectionView used FilleAndExpand VerticalOption. If you change this,
it has no effect.

Steps to Reproduce

1. Test my example

Expected Behavior

List and Collection Height adapt to the content height.

Actual Behavior

List and Collection height="*" (expand)

Reproduction Link

CollectionViewMaterialBug.zip

[samhouts]

@Moltroon ListView and CollectionView (and similar controls, like ScrollView) always vertically expand to available space unles you've specificed a HeightRequest. This is expected behavior. Thanks!

[samhouts]

You can also wrap them with a StackLayout to impose the behavior you're wanting. See #5763.

[Lelelo1]

That's not true. ScrollView adapts after content. ListView and CollectionView don't. I would expect ListView and CollectionView to do so.

Also you can't wrap ListView or CollectionView to impose that behaviour.

[JunkyXL86]

You can also wrap them with a StackLayout to impose the behavior you're wanting. See #5763.

I mean if there is the VerticalOptions property, it should take effect. If the CollectionView is meant to expand to available space, default value of VerticalOptions would be 'Fill'.
VerticalOptions=Start should be working, not forcing us to wrap in a StackPanel, though this doesn't even work.

[balazserd]

CollectionView is constantly messing up carefully calculated layout due to this BUG. It is a bug, because HeightRequests are not respected either. And the way they are not respected is full random too. Setting the same height request for an element on a page with a CollectionView below has a different height than on a page where there is no CollectionView below. Not to mention how the element has the properties Vertical and Horizontal options, yet not acting on them when they are set.

Edit: Atm CollectionView gives no flowers about the StackLayout padding that encases it. CollectionView has serious sizing issues.

Make CollectionView not derive from VisualElement if you violate its definitions.

[EvoPulseGaming]

@samhouts You closed this one referencing a duplicate, and then closed the duplicated referencing this as the duplicate. Apparently the default behavior of collectionview and listview is to take up all the space. There appears no way to disable this. Even on latest preview.

[samhouts]

Actually, I closed this as "expected behavior". I can reopen this as an enhancement request. Thanks!

[RyanGaudion]

+1 to this, it is causing really annoying effects in our applications,

[WilliamDumontRT]

+1 Having the CollectionView locked on expanding makes it very difficult and impractical to incorporate them in a page with multiples CollectionViews or complex layout.

[maexsp]

Run also into this issue. Its a major faulty behviour. Was also described long time ago here #6497

When will this be fixed?

[AbdellahMobiArchitects]

This is a serious issue, collection view is a really good view two show dynamic data in a grid like shape easily but this extra space is annoying

[ahmadalgarni]

Same in here,
I get extra spaces that I can't get rid off. hence, I can't also place two collectionviews inside a scroll, extra soace is really annoying.

lightgray is collection1 , lightblue is collection2 , why is the white spaces.

[SharpMobileCode]

I was going absolutely insane trying to figure out what I was doing wrong. This is obviously a gross oversight and certainly not expected behavior. I've been a year since reported, so I hope this gets fixed soon.

[samhouts]

I'm going to take back what I said earlier and call this a bug. We plan to fix this for CollectionView/CarouselView. Thanks for your patience!

[samhouts]

Duplicate of #8640

[jefffhaynes]

@samhouts Why isn't this a bug for ListView as well? It is definitely not "expected" behavior by any reasonable definition of the word.

[samhouts]

@jefffhaynes We're prioritizing CollectionView; we're hoping CollectionView is a more performant and easy to use version of ListView that you'll be happy to switch to.

[jefffhaynes]

@samhouts Unfortunately I've tried switching to CollectionView and it seems to over-zealously retrieve data from the source (in my case a database so not great). ListView at least gives you the (undocumented) option of defining a IReadOnlyList, forcing retrieval via the indexer of only what is visible. I'm kind of working on a bug for CollectionView but it's a complicated thing to capture. Basically, if CollectionView had better data virtualization I would consider it but until then it isn't an option. Glad to hear you're working on it though.

[samhouts]

@jefffhaynes That's great feedback! Definitely submit an issue for that. Thanks!

[jefffhaynes]

#10416

[lobbo232]

I'm going to take back what I said earlier and call this a bug. We plan to fix this for CollectionView/CarouselView. Thanks for your patience!

This is good news, but rather than enhancements should it not be prioritised and fixed as a bug? There are a lot of people stuck with it as an issue.

[stanleywailers]

I had the same problem in iOS

I resolved the bug setting VerticalItemSpacing in "0"
like this example

<CollectionView VerticalOptions="FillAndExpand" x:Name="cvProductResult" ItemSizingStrategy="MeasureAllItems" VerticalScrollBarVisibility="Never" SelectionMode="Single" BackgroundColor="White" ItemsSource="{Binding Model}" RemainingItemsThreshold="1" ItemTemplate="{StaticResource ProductSelectorList}" IsVisible="{Binding Model, Converter={StaticResource hasDataConverter}}" RemainingItemsThresholdReachedCommand="{Binding NewPaginationCommand}"> <CollectionView.ItemsLayout> <GridItemsLayout Orientation="Vertical" Span="2" VerticalItemSpacing="0" HorizontalItemSpacing="5"/> </CollectionView.ItemsLayout> </CollectionView

[Tommigun1980]

Please put collection view back in preview mode. It is not ready for prime time as there’s too many layout issues atm.

[chaosifier]

Any updates on the issue?

[tuliomarks]

Any updates on the issue?

[Kingamattack]

I don't understand why all the issues related to this bug are "Closed". We all still have it unfortunately

[rapcgutz]

Inside CollectionView, Use StackLyout instead of using Grid and it will solve your problem

[rerickson1]

Inside CollectionView, Use StackLyout instead of using Grid and it will solve your problem

Can you provide a quick example in XAML? I am trying this without success.

[volcano619]

may be enclose the collectionview inside a scrollview and disable the scroll of the collectionview using renderer, this might fix it

[njsokalski]

That might work as a workaround (although I haven't tried it yet), but it is not a true "fix"

[Tuurash]

This seems to be a very effective workaround :)
https://stackoverflow.com/questions/65767461/xamarin-forms-adjusting-height-of-collectionview-to-be-minimum-size-to-fit-chi