Horizontal misalignment of CollectionView items - Content is missing when the value is set to End

[egvijayanand]

Description

I have specified the value for aligning the CollectionView items horizontally.

However, the output is not at all in line with the value provided. Refer to the screenshot.

In the sample code, I have created three CollectionView controls with templates horizontally aligned to Start, Center, and End, respectively.

But, the output is entirely different from what's expected, and the content aligned to the End is missing.

Steps to Reproduce

1. Create a new .NET MAUI App
2. Replace the contents of the MainPage with the below code
3. Adjust the x:Class attribute value according to your app name and namespace
4. Set Windows as the target platform
5. Build and run the app

<?xml version="1.0" encoding="UTF-8" ?>
<ContentPage
    x:Class="MyApp.MainPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:scg="clr-namespace:System.Collections.Generic;assembly=mscorlib">
    <ContentPage.Resources>
        <scg:List
            x:Key="Colors"
            x:TypeArguments="x:String">
            <x:String>Red</x:String>
            <x:String>Orange</x:String>
            <x:String>Yellow</x:String>
            <x:String>Green</x:String>
            <x:String>Blue</x:String>
            <x:String>Indigo</x:String>
            <x:String>Violet</x:String>
        </scg:List>
        <LinearItemsLayout
            x:Key="VerticalList"
            ItemSpacing="5"
            Orientation="Vertical" />
    </ContentPage.Resources>
    <Grid ColumnDefinitions="*,*,*">
        <CollectionView
            BackgroundColor="Yellow"
            Header="Horizontal - Start"
            HorizontalOptions="Center"
            ItemsLayout="{StaticResource VerticalList}"
            ItemsSource="{StaticResource Colors}"
            VerticalOptions="Center">
            <CollectionView.ItemTemplate>
                <DataTemplate x:DataType="x:String">
                    <Label
                        HorizontalOptions="Start"
                        Text="{Binding}"
                        VerticalOptions="Center" />
                </DataTemplate>
            </CollectionView.ItemTemplate>
        </CollectionView>
        <CollectionView
            Grid.Column="1"
            BackgroundColor="LightGrey"
            Header="Horizontal - Center"
            HorizontalOptions="Center"
            ItemsLayout="{StaticResource VerticalList}"
            ItemsSource="{StaticResource Colors}"
            VerticalOptions="Center">
            <CollectionView.ItemTemplate>
                <DataTemplate x:DataType="x:String">
                    <Label
                        HorizontalOptions="Center"
                        Text="{Binding}"
                        VerticalOptions="Center" />
                </DataTemplate>
            </CollectionView.ItemTemplate>
        </CollectionView>
        <CollectionView
            Grid.Column="2"
            BackgroundColor="Yellow"
            Header="Horizontal - End"
            HorizontalOptions="Center"
            ItemsLayout="{StaticResource VerticalList}"
            ItemsSource="{StaticResource Colors}"
            VerticalOptions="Center">
            <CollectionView.ItemTemplate>
                <DataTemplate x:DataType="x:String">
                    <Label
                        HorizontalOptions="End"
                        Text="{Binding}"
                        VerticalOptions="Center" />
                </DataTemplate>
            </CollectionView.ItemTemplate>
        </CollectionView>
    </Grid>
</ContentPage>

Link to public reproduction project repository

Project from default template along with the code snippet will help in simulating the issue.

Version with bug

9.0.21 SR2.1

Is this a regression from previous behavior?

Not sure, did not test other versions

Last version that worked well

Unknown/Other

Affected platforms

Windows, I was not able test on other platforms

Affected platform versions

Windows SDK 10.0.19041.0

Did you find any workaround?

To align to the Center, set the value to Start. To align to the End, set the value to Center. However, there is no workaround for aligning to the End.

Relevant log output

NA

[egvijayanand]

It appears that the issue is specific to the Windows platform. The same sample works correctly on Android (WSA).

Kindly validate on the other 2 platforms as well.

[RoiChen001]

I can repro this issue at Windows platform on the latest 17.13.0 Preview 2.1 (9.0.21 & 9.0.14).