UWP XAML NavigationView - 内容面板上的 CornerRadius

Question

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

一些细节：

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

UWP 目标：

目标： 通用 Windows
目标版本： Windows10，版本 2004（10.0；内部版本 19041）
最低版本： Windows 10 秋季创作者更新（10.0；内部版本 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:弹出一个小window，现在可以输入样式名称了。

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

5: 你应该完成了。如果它不起作用，请给我留言！

UWP XAML NavigationView - 内容面板上的 CornerRadius

UWP XAML NavigationView - CornerRadius on Content Panel

c#

xaml

uwp

winui