微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

如何在 2 行中显示 PivotItem

如何解决如何在 2 行中显示 PivotItem

我正在使用 Pivot 在 UWP 中工作,但我有许多 PivotItem 选项卡,它将被屏幕边缘剪切(下图)。那么我们是否有任何解决方案将 PivotItems 放在 2 行中,或者我们可能有......最后并在弹出菜单显示其他选项卡(或类似的东西)

Pivot cut by screen edge

非常感谢您的帮助

解决方法

我建议使用 NavigationView 而不是 Pivot,NavigationView 会自动适应不同的屏幕尺寸并允许进行更多的自定义。如下: enter image description here 可以参考以下代码。

MainPage.xaml:

<NavigationView x:Name="rootNavigationView" PaneDisplayMode="Top"
ItemInvoked="NavView_ItemInvoked">
            <NavigationView.MenuItems>
                <NavigationViewItem Content="Section 1" x:Name="Section1Content" />
                <NavigationViewItem Content="Section 2" x:Name="Section2Content" />
                ……                
<NavigationViewItem Content="Section 8" x:Name="Section8Content" />
                <NavigationViewItem Content="Section 9" x:Name="Section9Content" />
                <NavigationViewItem Content="Section 10" x:Name="Section10Content" />
            </NavigationView.MenuItems>
            <Frame x:Name="ContentFrame"/>
</NavigationView>

背后的代码:

private void NavView_ItemInvoked(NavigationView sender,NavigationViewItemInvokedEventArgs args)
        {          
           var item = args.InvokedItemContainer;
            switch (item.Name)
            {
                case "Section1Content":

                    ContentFrame.Navigate(typeof(Section1Page));                
                    break;

                case "Section2Content":
                    ContentFrame.Navigate(typeof(Section2Page));                
                    break;
……
            }
        }

Section1Page.xaml:

<Page
   ..>
    <Grid>
        <TextBlock Text="Content of section 1."/>
    </Grid>
</Page>

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。