UWP 设置 NavigationView TogglePaneButton 颜色

Posted 2023-04-12

【中文标题】UWP 设置 NavigationView TogglePaneButton 颜色

【英文标题】：UWP Set NavigationView TogglePaneButton color

【发布时间】：2020-01-14 06:06:59

【问题描述】：

从图片中可以看出，TogglePaneButton 与其余的颜色不同。

那是因为我在其源代码VisualState Compact 中处于LeftMinimal 模式时手动将其设置为WhiteSmoke（实际上在我推送的代码中它已经是灰色的）。

我想我可以在窗格打开时通过修改它的视觉状态来改变它，如下所示：

<VisualState x:Name="Expanded">
    <VisualState.Setters>
        <Setter Target="RootSplitView.PaneBackground" Value="ThemeResource MainNavigationViewBackground" />
        <Setter Target="TogglePaneButton.Background" Value="ThemeResource MainNavigationViewBackground" />
    </VisualState.Setters>
</VisualState>

但它不起作用。我怎样才能做到这一点？

代码已超过30000个字符，所以我只能发布链接：

https://github.com/SeakyLuo/SMPlayer/blob/master/SMPlayer/Dictionaries/MainNavigationView.xaml

【参考方案1】：

这里的问题是VisualStates 对不同类型的窗格模式作出反应，但不对打开/关闭事件作出反应。

我建议给按钮本身一个Transparent 背景，并在按钮和窗格下显示一个彩色的Border。当窗格将关闭并处于最小模式时，按钮下方的边框将使它看起来好像按钮具有正确的背景颜色。当窗格打开时，它将在Border上方绘制，并且该按钮将具有与窗格相同的背景。

【讨论】：

边框的背景是什么？

Border 应该有“标签栏”的背景 - 所以WhiteSmoke

问题是，只有当NavigationView 是LeftMinimal 时，我才有WhiteSmoke 标题栏。不透明时如何使其透明？实际上，我是在模仿 Groove Music，从中你可以看到这种行为。

我认为您可以使用自适应触发器仅针对适当的窗口大小显示边框。或者，您可以使用 Pane Opening 或 Opened 事件来隐藏/显示它，但这不是仅限 XAML 的解决方案 :-)

【参考方案2】：

我找到了一个非常简单的解决方案：

只需制作另一个TogglePaneButton 并将其覆盖在原来的上面。然后让它像真正的一样工作。需要时将其可见性设置为Collapsed。