Empty space between elements .NET MAUI

Question

The entire page is a grid. I'm trying to position a child grid on top of the parent grid. This works on Android. On Apple up to iPhone 14 too. On iPhones 14 and 15, the space between the parent and child grids is displayed.

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:mct="clr-namespace:CommunityToolkit.Maui.Behaviors;assembly=CommunityToolkit.Maui"
             x:Class="IOSMauiAppGroupsOneApp.NewPage1"
             Shell.BackgroundColor="{AppThemeBinding Light=#3856A8, Dark=#232234}"
             Shell.NavBarIsVisible="False"
             Title="NewPage1">
    <ContentPage.Behaviors>
        <mct:StatusBarBehavior StatusBarColor="{AppThemeBinding Light=#3856A8, Dark=#232234}" />
    </ContentPage.Behaviors>
    <Grid BackgroundColor="Red">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>
        <Grid Margin="0"
              Grid.Row="0"
              ColumnSpacing="16"
              Padding="16,12,16,12"
              HorizontalOptions="Fill"
              VerticalOptions="Start"
              BackgroundColor="{AppThemeBinding Light=#3856A8, Dark=#232234}">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="Auto"/>
            </Grid.ColumnDefinitions>
            <Button
                 Grid.Column="0"
                 Text="Сохранить"
                 BorderColor="White"
                 BackgroundColor="Transparent"
                 CornerRadius="8"
                 TextColor="White"/>
            <Image
                Grid.Column="3"
                Source="icon_folder.png"
                HorizontalOptions="EndAndExpand"
                VerticalOptions="Center"
                ToolTipProperties.Text="Открыть документ">
            </Image>
            <Image
                Grid.Column="2"
                HorizontalOptions="EndAndExpand">
            </Image>
        </Grid>
    </Grid>
</ContentPage>

Expectation: The child grid will be aligned to the top edge of the parent grid.

Answer 1

This maybe caused by the status bar behaviour. Can you see the extra space when you remove that?

https://github.com/dotnet/maui/issues/16617 Link the to the same issue. It has a workaround/fix attached.

As mentioned The extra space between the views seem like an initial design by Apple.

Alternatively can you try setting the iOS safe area to false

xmlns:ios="clr-namespace:Microsoft.Maui.Controls.PlatformConfiguration.iOSSpecific;assembly=Microsoft.Maui.Controls" ios:Page.UseSafeArea="True"