Grid With Multiple Columns and Rows Does Not Properly Calculate Contents of * Row With Vertical Options Center/End

[mgr44]

Description

When I set the vertical options for content inside a grid row with proportional height (*) to "Center" or "End" the content of that grid row will take up more room in the layout than it should and will hide content in other rows that have their height set to "Auto" This only happens if there are columns with width set to Auto as well. This reproduces on iOS and Android.

The following code displays as expected:

`    <Grid
        RowDefinitions="Auto, *"
        ColumnDefinitions="*, Auto"
        BackgroundColor="LightPink">
        <Border 
            Grid.Row="0"
            Stroke="Black"
            StrokeThickness="2"
            Margin="2">
            <Label VerticalOptions="Fill" HeightRequest="250" Text="Label with height 250" BackgroundColor="LightBlue"/>
        </Border>
        <VerticalStackLayout 
            Grid.Row="1" 
            BackgroundColor="Lavender"
            Spacing="24"
            VerticalOptions="Fill">
            <Label Text="Grid row 1, column 0 with height set to *, and width set to *"/>
            <Label Text="2"/>
            <Label Text="3"/>
            <Label Text="4"/>
            <Label Text="5"/>
            <Label Text="6"/>
            <Label Text="7"/>
            <Label Text="8"/>
            <Label Text="9"/>
            <Label Text="10"/>
            <Label Text="11"/>
            <Label Text="12"/>
            <Label Text="13"/>
            <Label Text="14"/>
            <Label Text="15"/>
        </VerticalStackLayout>
        <Label Grid.Column="1" Text="Label with width set to 100" WidthRequest="100"/>
    </Grid>`

If the vertical options of the vertical stack layout is set to Center or End (instead of fill) then the layout is incorrect:

Center

End

Steps to Reproduce

1. Create a grid consisting of at least two rows and two columns where one row has height set to and one set to Auto, and one column has width set to and one set to Auto.
2. Add content to the , grid row/column
3. Set the VerticalOptions property of that content to Center or End

Expected Result The content in the , grid section fills only remaining space left over after space is apportioned to rows with Height Auto.

Observed Result The content of the grid expands and covers up content in other grid rows that it shouldn't.

Link to public reproduction project repository

https://github.com/mgr44/Maui-Grid-VerticalOptions-Layout-Issue-Sample-

Version with bug

8.0.40 SR5

Is this a regression from previous behavior?

Not sure, did not test other versions

Last version that worked well

Unknown/Other

Affected platforms

iOS, Android

Affected platform versions

Android 12, iOS 15.8.2

Did you find any workaround?

No response

Relevant log output

No response

[github-actions[bot]]

Hi I'm an AI powered bot that finds similar issues based off the issue title.

Please view the issues below to see if they solve your problem, and if the issue describes your problem please consider closing this one and thumbs upping the other issue to help us prioritize it. Thank you!

Open similar issues:

• [8.0.3] Grid can't calculate size for internal elements. (#21234), similarity score: 0.82
• Grid layout on iOS does not calculate row height correctly when a BoxView spans several rows (#21768), similarity score: 0.82
• ListView/CollectionView faulty height calculation in Grid with multiple columns (#21974), similarity score: 0.82

Closed similar issues:

• [Android] Grid with columns is not measured correctly. (#15870), similarity score: 0.82
• Grid row not sizing correctly with * when the content is a collectionview on iOS (#15092), similarity score: 0.82

Note: You can give me feedback by thumbs upping or thumbs downing this comment.

[ninachen03]

Verified this issue with Visual Studio 17.11.0 Preview 2.0 (8.0.60 & 8.0.3 ). Can repro it.