[iOS/Mac] CollectionView does not respect ItemSource DataTemplate height/width constraints

[jknaudt21]

Description

A CollectionView with some items will not respect the DataTemplate's dimensions depending on the ItemsLayout of the collection view on iOS/Mac.

For example, if I have a CollectionView that flows horizontally, the CV will not respect my HeightRequest. If I have a CV that flows vertically, the CV won't respect my WidthRequest.

Steps to Reproduce

The sample code can be simplified, I was just investigating another issue and stumbled on this.

1. On the Sandbox, paste the following code for MainPage.xaml

        <Grid>
            <CollectionView ItemsLayout="HorizontalList" x:Name="cv">
                <CollectionView.ItemTemplate>
                    <DataTemplate x:DataType="local:LabeledBox">
                        <Label Text="{Binding Number}"
                                BackgroundColor="{Binding Color}"
                                WidthRequest="{Binding Width}"
                                HeightRequest="50"/>
                    </DataTemplate>
                </CollectionView.ItemTemplate>
            </CollectionView>
        </Grid>

2. On the code-behind for MainPage.xaml, paste the following:

	public partial class MainPage : ContentPage
	{
		public MainPage()
		{
			InitializeComponent();

			var items = new List<LabeledBox>();

			int max = 9;
			for (int i = 0; i < max; i++)
			{
				items.Add(new LabeledBox(GetColor(i), 50, i));
			}

			cv.ItemsSource = items;
		}

		private Color GetColor(int i)
		{
			return (i%4) switch
			{
				0 => Color.FromRgb(255, 0, 0),
				1 => Color.FromRgb(0, 255, 0),
				2 => Color.FromRgb(0, 0, 255),
				3 => Color.FromRgb(255, 255, 0),
				_ => Color.FromRgb(0, 0, 0)
			};
		}
	}

	public record LabeledBox (Color Color, int Width, int Number);

3. Observe the results

Expected (Android)	Actual (Mac)

Link to public reproduction project repository

(see code above)

Version with bug

8.0.0-preview.7.8842

Is this a regression from previous behavior?

Not sure, did not test other versions

Last version that worked well

Unknown/Other

Affected platforms

iOS, macOS

Affected platform versions

No response

Did you find any workaround?

Limit the dimensions you want in the CollectionView element rather than within the datatemplate.

Relevant log output

No response

[jknaudt21]

So I thought I had a simple fix here: 2df1f4e

However, my tentative fix causes the CV to:

• Have its ItemsLayout behave backwards (e.g. a horizontal CV suddenly stacks vertically)
• Lose scroll functionality. Instead it becomes a janky equivalent of a flex container

This needs deeper investigation :/

[XamlTest]

Verified this on Visual Studio Enterprise 17.9.0 Preview 1(8.0.3). Repro on iOS 17.0 and MacCatalyst, not repro on Windows 11 and Android 14.0-API34 with below Project:
17285.zip

[awasilik]

Issue still occurring on iOS with Maui version 8.0.14