XAML 选项卡视图在UWP Windows UI库上无法正常工作

um6iljoc  于 2023-02-01  发布在  Windows
关注(0)|答案(1)|浏览(162)

我正在Visual Studio上为UWP制作一个应用程序,该应用程序使用Windows UI库作为选项卡视图组件。我遵循the documentation,它提供了以下代码供用途:
示例:<muxc:TabView AddTabButtonClick="TabView_AddTabButtonClick" TabCloseRequested="TabView_TabCloseRequested"/>
c编号:

// Add a new Tab to the TabView
private void TabView_AddTabButtonClick(muxc.TabView sender, object args)
{
    var newTab = new muxc.TabViewItem();
    newTab.IconSource = new muxc.SymbolIconSource() { Symbol = Symbol.Document };
    newTab.Header = "New Document";

    // The Content of a TabViewItem is often a frame which hosts a page.
    Frame frame = new Frame();
    newTab.Content = frame;
    frame.Navigate(typeof(Page1));

    sender.TabItems.Add(newTab);
}

// Remove the requested tab from the TabView
private void TabView_TabCloseRequested(muxc.TabView sender, muxc.TabViewTabCloseRequestedEventArgs args)
{
    sender.TabItems.Remove(args.Tab);
}

我把这些代码添加到我的项目中,乍一看,它看起来很正常。然而,当尝试交互时,却出现了问题。我只能在“+“图标的最底部边缘单击,才能创建一个新的标签页。我也无法退出任何标签页或与它们交互。

这是我的问题

https://im7.ezgif.com/tmp/ezgif-7-565b1f0b4531.gif
有人能解决这个问题吗?
谢谢你的帮助

e4yzc0pl

e4yzc0pl1#

您需要创建一个TabStripHeader和TabStripFooter。TabStripHeader的子项是Grid,并将名称设置为ShellTitlebarInset,TabStripFooter的子项是Grid,并将名称设置为CustomDragRegion,将两者的背景设置为Transparent
使用CustomDragRegion作为标题栏。

类似示例:-

<muxc:TabView>
    <muxc:TabView.TabStripHeader>
        <Grid x:Name="ShellTitlebarInset" Background="Transparent" />
    </muxc:TabView.TabStripHeader>
    <muxc:TabView.TabStripFooter>
        <Grid Grid.Column="3" x:Name="CustomDragRegion" Background="Transparent" />
    </muxc:TabView.TabStripFooter>
</muxc:TabView>

和C#示例:-

public MainPage()
{
    this.InitializeComponent();

    var coreTitleBar = CoreApplication.GetCurrentView().TitleBar;
    coreTitleBar.ExtendViewIntoTitleBar = true;
    coreTitleBar.LayoutMetricsChanged += CoreTitleBar_LayoutMetricsChanged;

    Window.Current.SetTitleBar(CustomDragRegion);
}

private void CoreTitleBar_LayoutMetricsChanged(CoreApplicationViewTitleBar sender, object args)
{
    if (FlowDirection == FlowDirection.LeftToRight)
    {
        CustomDragRegion.MinWidth = sender.SystemOverlayRightInset;
        ShellTitlebarInset.MinWidth = sender.SystemOverlayLeftInset;
    }
    else
    {
        CustomDragRegion.MinWidth = sender.SystemOverlayLeftInset;
        ShellTitlebarInset.MinWidth = sender.SystemOverlayRightInset;
    }

    CustomDragRegion.Height = ShellTitlebarInset.Height = sender.Height;
}

***注意:***要确保标题栏中的选项卡不被 shell 内容遮挡,您必须考虑左右重叠。在LTR布局中,右插入包括标题按钮和拖动区域。在RTL中则相反。SystemOverlayLeftInsetSystemOverlayRightInset值表示物理左和右,因此在RTL中也要反转这些值。

单击此处获取***更多信息***

相关问题