maui icon indicating copy to clipboard operation
maui copied to clipboard

DataTemplateSelector in CollectionView does not size/measure items properly

Open MissedSte4k opened this issue 3 years ago • 7 comments

Description

I created a sample app, that adds image of a dog/cat in one of four grid spaces based on random chance every n seconds. If the image is on the left - the top item in template is Grid, if it's on the right - it's <Frame/> <Grid>. I use DataTemplateSelector to achieve that. In Android - it usually gets sized properly, but sometimes it too sizes wrong.

https://user-images.githubusercontent.com/36638029/179478529-21d30cde-d4aa-4c20-ab33-b4730388d624.mp4

When it comes to Windows - the sizeing is pretty much never implemented (in my real app I'm developing, it's mostly correct, but usually fallback to some one template and shows everything as that one disregarding all the others (works on Android fails on Windows), but I couldn't replicate it in this sample app for now).

https://user-images.githubusercontent.com/36638029/179477866-7c0839f9-f983-4bc6-9904-d5f560d1e428.mp4

Steps to Reproduce

  1. Extract this sample project TestImages.zip
  2. Launch it on Android and try to select items in CollectionView

Expected results: CollectionView items are displayed with proper sizeing Actual results: Item sizing sometimes is not consistent, but always falls inside the measured item space. (I'm pretty sure, that <Grid ColumnDefinitions="," RowDefinitions=","> should divide everything into 4 equal size squares which it doesn't but ¯_(ツ)_/¯ )

  1. Launch an app on Windows

Expected results: Same UI as in Android Actual Results: Images in ItemTemplates are displayed without taking into account the space provided and can cover one another (in case of grid) or are cropped (in case of Frame)

Version with bug

6.0.400

Last version that worked well

Unknown/Other

Affected platforms

Android, Windows

Affected platform versions

Android 11, 6.0.400

Did you find any workaround?

You can define HeightRequest="..." in xaml for the Image/Frame/Grid to fix the sizeing issue in Windows

Relevant log output

No response

MissedSte4k avatar Jul 18 '22 09:07 MissedSte4k

Tested the app on iOS. Seems to have the same/very similar issue as in Windows platform

MissedSte4k avatar Jul 25 '22 11:07 MissedSte4k

I'm facing the same issue on iOS: 2 datatemplates with different heights, a datatemplate selector, all items are height as the tallest, ignoring the heightrequest for the small datatemplate. Different ItemSizingStrategy does not resolve

fgiacomelli avatar Apr 27 '23 14:04 fgiacomelli

Verified this on Visual Studio Enterprise 17.7.0 Preview 1.0. Repro on Windows 11, Android 13.0 and iOS 16.4 with below Project: TestImages.zip

Android: image Windows: image iOS: image

XamlTest avatar May 23 '23 07:05 XamlTest

Is there any update/workaround on this issue?

davidevosti avatar Aug 17 '23 12:08 davidevosti

Hi, I can also confirm this bug in my app. Very frustrating that this issue has been open for so long.

hwsmo avatar Nov 22 '23 13:11 hwsmo

The issue is not reproduced with the latest MAUI NuGet version (10.0.11) on all platforms (Android, Windows, iOS, and Mac).

Android Windows

BagavathiPerumal avatar Dec 09 '25 13:12 BagavathiPerumal

Hi @@MissedSte4k. We have added the "s/try-latest-version" label to this issue, which indicates that we'd like you to try and reproduce this issue on the latest available public version. This can happen because we think that this issue was fixed in a version that has just been released, or the information provided by you indicates that you might be working with an older version.

You can install the latest version by installing the latest Visual Studio (Preview) with the .NET MAUI workload installed. If the issue still persists, please let us know with any additional details and ideally a reproduction project provided through a GitHub repository.

This issue will be closed automatically in 7 days if we do not hear back from you by then - please feel free to re-open it if you come back to this issue after that time.