如何在菜单弹出框中添加真实的拐角半径？

Question

现在看起来像这样。

我在MenuFlyout中使用MenuFlyoutPresenterStyle-

<MenuFlyout x:Name="MenuFlyout" 
            MenuFlyoutPresenterStyle="{ThemeResource MenuFlyoutAcrilickThemeResources}"
            >
                <MenuFlyoutItem Icon="Paste" Text="Вставить"  Click="MenuFlyoutItemPaste_Click" />
                <MenuFlyoutItem Icon="Copy" Text="Скопировать" Click="MenuFlyoutItemCopy_Click"  />
            </MenuFlyout>
</MenuFlyout>

样式代码

<Style x:Key="MenuFlyoutAcrilickThemeResources" TargetType="MenuFlyoutPresenter">
    <Setter Property="CornerRadius" Value="10" />
    <Setter Property="Padding" Value="0,3" />
    <Setter Property="Background" Value="{ThemeResource MenuFlyoutBackgroundAcrylicBrush}" />
</Style>

该如何解决？

Answer 1

您应该添加另一个影响默认阴影属性的 Setter，如下所示：

<Setter Property="IsDefaultShadowEnabled" Value="False" />

另外我建议使用 3 的圆角半径，因为这是 WinUI 3 使用的。

Answer 2

您可以添加另一个Setter来修改背景属性：

<Setter Property="Background" Value="Transparent" />

但是，取决于您的SDK版本，Microsoft recommends a different approach：

  

从Windows 10版本1607（SDK 14393）开始，generic.xaml包含一些资源，您可以使用这些资源来修改处于不同视觉状态的控件的颜色，而无需修改控件模板。在针对此软件开发工具包（SDK）或更高版本的应用中，与设置诸如Background和Foreground之类的属性相比，修改这些资源更为可取。有关更多信息，请参见样式控件文章的“轻型样式”部分。

Answer 3

使用 IsDefaultShadowEnabled 为 false。

<Button Content="Options">
      <Button.Flyout>
          <MenuFlyout>
              <MenuFlyout.MenuFlyoutPresenterStyle>
                  <Style TargetType="MenuFlyoutPresenter">
                      <Setter Property="CornerRadius" Value="20"/>
                      <Setter Property="IsDefaultShadowEnabled" Value="False"/>
                  </Style>
              </MenuFlyout.MenuFlyoutPresenterStyle>
              <MenuFlyoutItem Text="Reset"/>
              <MenuFlyoutSeparator/>
              <ToggleMenuFlyoutItem Text="Repeat" IsChecked="True"/>
              <ToggleMenuFlyoutItem Text="Shuffle" IsChecked="True"/>
          </MenuFlyout>
      </Button.Flyout>
</Button>