Flyout labels are invisible after clearing custom FlyoutContent

[spadapet]

Description

On Windows only, when custom Shell.FlyoutContent is removed, the default list of labels in the flyout are invisible. Resizing the window or making other flyout changes makes the labels show up again. See the repro steps for screenshots. Seems like a layout update issue where the label's position or size are wrong.

This repro can happen through code by changing Shell.FlyoutContent or XAML hot reload.

<?xml version="1.0" encoding="UTF-8" ?>
<Shell
    x:Class="MauiApp4.AppShell"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:MauiApp4"
    Shell.FlyoutBehavior="Locked"
    FlyoutWidth="200"
    Title="MauiApp4">
    
    <!-- Here is the custom FlyoutContent -->
    <Shell.FlyoutContent>
        <Border Stroke="Red" StrokeThickness="4" Background="Blue">
            <VerticalStackLayout>
                <Label Text="Foo" TextColor="White" />
                <Label Text="Bar" TextColor="White" />
            </VerticalStackLayout>
        </Border>
    </Shell.FlyoutContent>

    <ShellContent Title="Home" ContentTemplate="{DataTemplate local:MainPage}" Route="MainPage" />
</Shell>

Steps to Reproduce

0. Use the latest release of Visual Studio 2022
1. Clone the following repo and open the solution in the FlyoutContentMissing directory:
   • https://github.com/spadapet/maui_bugs.git
2. Build and debug the solution for Windows
3. Notice the custom flyout content:
   
4. Click the button in the app, which goes back to standard flyout content. Notice the label in the flyout that should say "Home" is missing:
   
5. If you click the button again, or even resize the window, the flyout content shows:
   

Link to public reproduction project repository

https://github.com/spadapet/maui_bugs/tree/main/FlyoutContentMissing

Version with bug

8.0.3 GA

Is this a regression from previous behavior?

Not sure, did not test other versions

Last version that worked well

Unknown/Other

Affected platforms

Windows

Affected platform versions

net8.0-windows10.0.19041.0

Did you find any workaround?

Resizing the window or undo+redo of the change to FlyoutContent causes the flyout labels to show again.

Relevant log output

No response

[github-actions]

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:

• Setting Shell.FlyoutWidth causes problems on WinUI with changed values in binding context (#19496), similarity score: 0.80

Closed similar issues:

• Shell Flyout Occasionally Missing Items (#9396), similarity score: 0.82
• Flyout on Windows doesn't display programmatically created entries. (#12149), similarity score: 0.80
• When FlyoutItem is used instead of ShellContent, the menu item text is invisible (#14688), similarity score: 0.80
• Flyout is not refreshing when item visibility is changed (#10468), similarity score: 0.79

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

[RoiChen001]

Can repro this issue at Windows platform on the latest 17.10 Preview 7(8.0.21).