Contentpage is cut off in iOS

[inigofu]

Description

When using top tab in Maui, content page is cut off in Ios.

In Android:

In Ios:

Steps to Reproduce

The shell file configuration is:

<Shell x:Class="SutuMaui.AppShell" xmlns="http://schemas.microsoft.com/dotnet/2021/maui" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:local="clr-namespace:SutuMaui" xmlns:views="clr-namespace:SutuMaui.View" xmlns:fonts="clr-namespace:SutuMaui.Resources.Fonts" Shell.FlyoutBehavior="Disabled">

<TabBar>
   <Tab Title="MainPage" >
        <Tab.Icon>

        <FontImageSource Glyph="{x:Static fonts:IconFont.Home}" Color="Black"
                     FontFamily="materialicons"
                     />

        </Tab.Icon>

       <ShellContent Title="Cats"
                     ContentTemplate="{DataTemplate local:MainPage}" />

   </Tab>

   <Tab Title="Workouts">
        <Tab.Icon>

        <FontImageSource Glyph="{x:Static fonts:IconFont.Directions_bike}" Color="Black"
                     FontFamily="materialicons"
                     />

        </Tab.Icon>
       <ShellContent Title="Favorites" ContentTemplate="{DataTemplate local:MainPage}"/>
        <ShellContent Title="All Workouts"
                     ContentTemplate="{DataTemplate views:Workouts_All}" />
        <ShellContent Title="Free Ride"
                     ContentTemplate="{DataTemplate views:Workouts_FreeRIde}" />
   </Tab>
     <Tab Title="Plans" >
        <Tab.Icon>

        <FontImageSource Glyph="{x:Static fonts:IconFont.Calendar_month}" Color="Black"
                     FontFamily="materialicons"
                     />

        </Tab.Icon>
        <ShellContent Title="Cats"
                     ContentTemplate="{DataTemplate local:MainPage}" />
        </Tab>
    <Tab Title="Progress" >
        <Tab.Icon>

        <FontImageSource Glyph="{x:Static fonts:IconFont.Signal_cellular_alt}" Color="Black"
                     FontFamily="materialicons"
                     />

        </Tab.Icon>
        <ShellContent Title="Cats"
                     ContentTemplate="{DataTemplate local:MainPage}" />
        </Tab>

</TabBar>

Version with bug

6.0.408 (current)

Last version that worked well

Unknown/Other

Affected platforms

iOS

Affected platform versions

iOS 15

Did you find any workaround?

No response

Relevant log output

No response

[StepKie]

Would be nice if that would be fixed since that is quite the obvious bug...

[edgiardina]

Seeing this as well on iOS.

[MSicc]

Same here, but on latest .NET 7 workload.

[StepKie]

Pretty incredible that this is still the case a year after MAUI release.

Just sharing our quick workaround, adding a global implicit style:

<Style ApplyToDerivedTypes="True" TargetType="ContentPage">
    <!--  iOS gets additional top padding due to https://github.com/dotnet/maui/issues/8778 -->
    <Setter Property="Padding" Value="{OnPlatform iOS='10,50,10,0', Default='10,10,10,0'}" />
</Style>

[headintheclouds21]

I'm experiencing this on maccatalyst with .NET 7. I just upgraded and now my project UI is broken. Has anyone found a good workaround for this? Please fix this NET MAUI team

I've also had issues with the content page growing/stretching when UI changes are made. None of these issues were around before I updated. Any advice would be appreciated.

[pjcollins]

I was able to repro this issue with a .NET 7 project on an iOS 16 simulator. However, I am no longer seeing this when updating my project to target net8.0-ios using the latest .NET 8 Preview 7 builds. Would you be able to try the latest preview version to see if that improves this behavior for you?

[ghost]

Hi @inigofu. We have added the "s/needs-info" label to this issue, which indicates that we have an open question for you before we can take further action. 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.

[ghost]

This issue has been automatically marked as stale because it has been marked as requiring author feedback but has not had any activity for 4 days. It will be closed if no further activity occurs within 3 days of this comment. If it is closed, feel free to comment when you are able to provide the additional information and we will re-investigate.