macOS title bar hides the window content in maccatalyst

[edoust]

Current behavior

See the attached screenshot, the OS drawn title bar hides parts of the content.

Also visible in this screenshot is that the navigation view does not correctly adjust to the window's size, the content overflows to the right and bottom, also the pane footer does not show and the footer items are not visible

Expected behavior

The OS drawn title bar should not hide parts of the content. In fullscreen mode the title bar is not shown, there everything looks fine

How to reproduce it (as minimally and precisely as possible)

Page Background is set to red, this is the page content:

    <NavigationView>
        <NavigationView.PaneFooter>
            <Grid
                Width="32"
                Height="32"
                Background="Green"
                CornerRadius="6" />

        </NavigationView.PaneFooter>
        <Grid Background="Blue">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="250" />
                <ColumnDefinition />

            </Grid.ColumnDefinitions>

            <Rectangle
                Margin="12"
                Fill="Gold"
                RadiusX="30"
                RadiusY="30" />
            <Rectangle
                Grid.Column="1"
                Margin="12"
                Fill="Gold"
                RadiusX="30"
                RadiusY="30" />

            <TextBlock
                Grid.ColumnSpan="2"
                FontSize="50"
                Text="I am hidden beneath the OS app window title bar" />

        </Grid>
    </NavigationView>

Workaround

No response

Works on UWP/WinUI

Yes

Environment

No response

NuGet package version(s)

4.2.0-dev.673

Affected platforms

No response

IDE

No response

IDE version

No response

Relevant plugins

No response

Anything else we need to know?

No response

[jeromelaban]

It is likely that the issue is related to the support of the safe area. Can you try adding the VisibleBoundsPadding to your app's top level control: https://platform.uno/docs/articles/features/VisibleBoundsPadding.html

VisibleBoundsPadding behavior

[edoust]

@jeromelaban

Thanks but it looks exactly the same as before, I included it like this (version 4.2.6 with Uno.Toolkit.WinUI, version=1.4.0-dev.10):

<Page xmlns:toolkit="using:Uno.WinUI.Toolkit" [...]>
    <NavigationView toolkit:VisibleBoundsPadding.PaddingMask="All" [...] />
    [...]
</Page>

Interestingly on 4.3.0-dev.7 it now looks like this (I made absolutely no code changes, just updated the Uno package version):

[lld1995]

@MartinZikmund SafeArea also has the same problem

[MartinZikmund]

@ajpinedam can you look into this one please?

[ajpinedam]

This looks good to me.

@MartinZikmund @jeromelaban please let me know if this is not who it's supposed to render.

I created a new app targeting the latest Uno Platform and using the XAML posted above.

  <Grid utu:SafeArea.Insets="VisibleBounds">
    <NavigationView>
        <NavigationView.PaneFooter>
            <Grid
                Width="32"
                Height="32"
                Background="Green"
                CornerRadius="6" />
        </NavigationView.PaneFooter>
        <Grid Background="Blue">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="250" />
                <ColumnDefinition />
            </Grid.ColumnDefinitions>
            <Rectangle
                Margin="12"
                Fill="Gold"
                RadiusX="30"
                RadiusY="30" />
            <Rectangle
                Grid.Column="1"
                Margin="12"
                Fill="Gold"
                RadiusX="30"
                RadiusY="30" />
            <TextBlock
                Grid.ColumnSpan="2"
                FontSize="50"
                Text="I am hidden beneath the OS app window title bar" />
        </Grid>
    </NavigationView>
  </Grid>

cc: @lld1995

[MartinZikmund]

@ajpinedam Without the safe area it goes underneath the title bar? I am thinking whether we should be adjusting for this scenario, as title bar is "technically" chrome, which is outside the client area, so it feels like the app content should not go beneath it by default - only in case Window.ContentExtendsIntoTitleBar is true

[jeromelaban]

@MartinZikmund isn't the title bar blurring the contents of what's under it? Maybe that's the reason for having a way to draw under it.

[MartinZikmund]

It is odd, as the docs say that the title bar should be separated from the content by a line by default, which is not what we are seeing here - https://developer.apple.com/documentation/uikit/mac_catalyst/removing_the_title_bar_in_your_mac_app_built_with_mac_catalyst