[Windows] The screen does not display when changing the CurrentPage of a TabbedPage.

[matomsan]

Description

When changing the CurrentPage of a TabbedPage, the screen displays as expected on Android and iOS, but it does not display on Windows. This issue started occurring from MAUI 8.0.90. Is there a solution to this problem?

I have created an example project that reproduces the issue here: https://github.com/matomsan/Maui.Sample.TabbedPage

TabMultiPage.cs :

public class TabMultiPage : TabbedPage {
    public TabMultiPage()
    {
        var page = new MainPage() { Title = "One" };
        Children.Add(page);
        CurrentPage = Children[0];
    }

    public async Task SwitchTabMultiPageAsync()
    {
        var page = new NewPage1() { Title = "Two" };
        Children.Add(page);
        CurrentPage = Children[1];
    }
}

However, there are some important notes. In my project, I am layering ContentPage elements on top of each other. I add two ContentPage elements to an ObservableCollection and use a handler to add them to the native controls. On Windows, it seems there is an issue with this handler.

MultiLayerPage.cs :

public class MultiLayerPage : ContentPage {
    public MultiLayerPage()
    {
        Children = new ObservableCollection<Page>();
        Children.CollectionChanged += Children_CollectionChanged;
    }

    public ObservableCollection<Page> Children { get; }
}

MultiLayerPageHandler.Windows.cs :

public partial class MultiLayerPageHandler : ViewHandler<Views.MultiLayerPage, ContentPanel> {

    public static PropertyMapper<Views.MultiLayerPage, MultiLayerPageHandler> PropertyMapper = new PropertyMapper<Views.MultiLayerPage, MultiLayerPageHandler>(ViewHandler.ViewMapper) {
    };

    public MultiLayerPageHandler() : base(PropertyMapper)
    {
    }

    protected override void ConnectHandler(ContentPanel platformView)
    {
        base.ConnectHandler(platformView);
        platformView.Loaded += OnLoaded;

        foreach (var child in VirtualView.Children) {
            var element = child.ToPlatform(MauiContext);
            platformView.Children.Add(element);
        }
    }
}

Steps to Reproduce

When dynamically updating the CurrentPage of a TabbedPage, a yellow screen is displayed in v8.0.82. However, in v8.0.90, nothing is displayed. In v8.0.90, resizing the window causes the yellow screen to appear.

v8.0.82	v8.0.90

Link to public reproduction project repository

https://github.com/matomsan/Maui.Sample.TabbedPage

Version with bug

8.0.90 SR9

Is this a regression from previous behavior?

Yes, this used to work in .NET MAUI

Last version that worked well

8.0.82 SR8.2

Affected platforms

Windows

Affected platform versions

No response

Did you find any workaround?

Unfortunately I haven't found any good workaround for this issue.

Relevant log output

No response

[Zhanglirong-Winnie]

This issue has been verified using Visual Studio 17.12.0 Preview 4( 8.0.92 & 8.0.90 & 8.0.82). Can repro this issue on windows platform. 8.0.82 works fine.

[PureWeen]

Fixed by https://github.com/dotnet/maui/pull/25696

[PureWeen]

@matomsan I'm not too sure if this will work for you but ContentPage works a bit unreliably if the Content property isn't set. I boiled this down to an extra "InvalidateMeasure" call happening against the root ContentPage

Because ContentPage doesn't have "Content" the platform code doesn't run the measure/arrange. I feel like the structure here is generally a little fragile against the rules of what MAUI expects for a ContentPage

For example, on your MultiLayerPage if I use an interface to define the content

public partial class MultiLayerPage : ContentPage, IContentView
{

	IView IContentView.PresentedContent { get => Children[0]; }

The code starts working again. But ContentPage generally operates with the expectation that it'll have "Content"

My recommendation would also be to try and use MultiPage as the base class. That's a structure in MAUI that's a bit more intended for this type of page that's going to host multiple pages

[matomsan]

Hi @PureWeen. Thank you for checking. I understand now that the issue was caused by the Content property of the ContentPage not being set. The workaround you provided has resolved my issue.

Fixed example project: https://github.com/matomsan/Maui.Sample.TabbedPage

[PureWeen]

Hi @PureWeen. Thank you for checking. I understand now that the issue was caused by the Content property of the ContentPage not being set. The workaround you provided has resolved my issue.

Fixed example project: https://github.com/matomsan/Maui.Sample.TabbedPage

Awesome! Thank you @matomsan for getting back to me