winui3 not showing content of page that renders in tabviewitem

jarno beerten 61

When i have .net5
winui3
tabview
that renders a page when adding the view but not is showing in the tabview

jarno beerten 61

code using

private void TabView_AddTabButtonClick(TabView sender, object args)
{
sender.TabItems.Add(CreateNewTab(sender.TabItems.Count));
}

    private void TabView_TabCloseRequested(TabView sender, TabViewTabCloseRequestedEventArgs args)
    {
        sender.TabItems.Remove(args.Tab);
    }

    private TabViewItem CreateNewTab(int index)
    {
        TabViewItem newItem = new TabViewItem();

        newItem.Header = $"Home";
        newItem.IconSource = new Microsoft.UI.Xaml.Controls.SymbolIconSource() { Symbol = Symbol.NewWindow };

        // The content of the tab is often a frame that contains a page, though it could be any UIElement.
        Frame frame = new Frame();

        switch (index % 3)
        {
            case 0:
                frame.Navigate(typeof(Home));
                break;
            case 1:
                frame.Navigate(typeof(Home));
                break;
            case 2:
                frame.Navigate(typeof(Home));
                break;
        }

        newItem.Content = frame;

        return newItem;
    }

    private void TabView_Loaded(object sender, RoutedEventArgs e)
    {
        for (int i = 0; i < 1; i++)
        {
            (sender as TabView).TabItems.Add(CreateNewTab(i));
        }
    }

jarno beerten 61 Reputation points

2021-08-23T13:45:25.727+00:00
mainwindow xaml

<Window
x:Class="UiTest.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:UiTest"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">

<TabView AddTabButtonClick="TabView_AddTabButtonClick" TabCloseRequested="TabView_TabCloseRequested" Loaded="TabView_Loaded"> </TabView>

</Window>
Roy Li - MSFT 31,766 Reputation points Microsoft Vendor

2021-08-24T02:15:36.937+00:00

Are you developing a WPF using winui3 or a WinUI 3 desktop app?
Roy Li - MSFT 31,766 Reputation points Microsoft Vendor

2021-08-24T02:42:54.69+00:00

I tried your code in a WinUI 3 desktop app. And created a new page with a TextBlock. It works correctly on my side.

Could you please tell me if you have added any controls to the Home Page. Is the Home Page a Winui3 Page Item?
jarno beerten 61 Reputation points

2022-01-24T16:55:12.5+00:00

I got something working now but when using winui3 0.8 because 1.0 fails to install when rendering new Tab with webview2 the content in the tab item stays black
@Roy Li - MSFT
Luís Rodrigues 1 Reputation point

2022-02-11T17:31:14.65+00:00

What happens is that the TabViewItem's content height is dependent on the content, but if you add a control who's height depends on the parent as content (say a Frame or a WebView2) this shortcircuits the height calculation on both controls and you get what appears to be an empty tab, but it's actually a tab with ActualHeight = 0 and all content hidden by it's lack of height.

To test this, try adding frame.Height = 500; and see if you can see the page then.

I'm looking for a solution to this aswell

Accepted answer

Gerard Walschlager 76 Reputation points

2022-06-11T16:21:18.38+00:00

On the TabView control, try setting the HorizontalAlignment, VerticalAlignment, HorizontalContentAlignment and VerticalContentAlignment to "Stretch". Without that, I too was getting blank content in my tabs instead of showing my WebView2 control content. This indeed fixed it. Otherwise the height of the tab is set to zero (width seemed to be fine however).
Please sign in to rate this answer.
Jimex 0 Reputation points

2023-04-01T17:24:32.78+00:00

I have the same issue when dynamic places a webview2 control into the tabviewitem, hope this bug can be fixed soon
Sign in to comment

1 additional answer

Deleted

This answer has been deleted due to a violation of our Code of Conduct. The answer was manually reported or identified through automated detection before action was taken. Please refer to our Code of Conduct for more information.

Comments have been turned off. Learn more