UWP XAML NavigationView - 内容面板上的 CornerRadius

Question

我是 XAML 的新手，我正在我的 UWP 应用程序中实现 NavigationView 控件。

一些细节：

• Visual Studio 2019
• Microsoft.UI.Xaml 版本 2.6.2（已安装 Nuget 包）

UWP 目标：

• 目标：通用窗口

• 目标版本： Windows 10 2004 版（10.0；内部版本 19041）

• 最低版本： Windows 10 Fall Creators Update（10.0；Build 16299）

我正在尝试查找控制“内容”部分的左上角半径的属性或样式。我希望那里没有圆角，只是直接流到顶部，但我似乎找不到正确的方法来做到这一点。附上我说的圆角图片：content frame。

这是带有导航菜单的主页的 XAML：

<Page
x:Class="NavTest.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:muxc="using:Microsoft.UI.Xaml.Controls"    
xmlns:local="using:NavTest"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">

<Grid>
    <muxc:NavigationView x:Name="NavView" Background="Gray">
        <muxc:NavigationView.MenuItems>
            <muxc:NavigationViewItem Tag="home" Icon="Home" Content="Home"/>
            <muxc:NavigationViewItemSeparator/>
            <muxc:NavigationViewItemHeader x:Name="MainPagesHeader"
                                       Content="Main pages"/>
            <muxc:NavigationViewItem Tag="apps" Content="Apps">
                <muxc:NavigationViewItem.Icon>
                    <FontIcon FontFamily="Segoe MDL2 Assets" Glyph="&#xEB3C;"/>
                </muxc:NavigationViewItem.Icon>
            </muxc:NavigationViewItem>
            <muxc:NavigationViewItem Tag="games" Content="Games">
                <muxc:NavigationViewItem.Icon>
                    <FontIcon FontFamily="Segoe MDL2 Assets" Glyph="&#xE7FC;"/>
                </muxc:NavigationViewItem.Icon>
            </muxc:NavigationViewItem>
            <muxc:NavigationViewItem Tag="music" Icon="Audio" Content="Music"/>
        </muxc:NavigationView.MenuItems>
    </muxc:NavigationView>
</Grid>

有谁知道如何控制导航菜单内容项的左上角半径使其不圆角？是否有我可以覆盖或设置的样式属性？直接在 NavigationView 上设置“CornerRadius”属性似乎没有任何区别。

谢谢

Answer 1

要更改 CornerRadius，您必须为控件创建自己的样式：

1：在 Visual Studio 中右键单击您的项目并转到“Design in Blend...”

2： 打开 Blend 后，您转到“对象和时间线”并右键单击您的 NavigationView，它会显示在列表中。在右键菜单中，您转到“编辑模板”，然后从那里转到“编辑副本”。

3：会弹出一个小窗口，您现在可以输入样式名称。

4：Visual Studio 现在将为您的 NavigationView 创建自定义样式，您可以自定义控件的每一个细节。

5：你应该完成了。如果它不起作用，请给我写评论！