如何更改UWP的主 - 详细页面中的页面按钮样式

Question

我想在UWP中设置Page Button的样式以获取主详细信息页面。在 Live Visual Tree 的帮助下，我发现它应该是ContentTogglePane button。

<StackPanel Orientation="Horizontal" VerticalAlignment="Center" Background="{TemplateBinding ToolbarBackground}" >

    <Button Name="ContentTogglePane" Style="{ThemeResource PaneButton}" Foreground="{TemplateBinding ToolbarForeground}"  
        Visibility="{TemplateBinding ContentTogglePaneButtonVisibility}" />

    <Border Height="{ThemeResource TitleBarHeight}" Visibility="{TemplateBinding DetailTitleVisibility}">
        <TextBlock Text="{TemplateBinding DetailTitle}" VerticalAlignment="Center" Margin="10,0,0,0" Foreground="{TemplateBinding ToolbarForeground}" Style="{ThemeResource TitleTextBlockStyle}" />
    </Border>

</StackPanel>

该样式在this way中定义：

<Style TargetType="Button" x:Key="PaneButton">
        <Setter Property="FontFamily" Value="{ThemeResource SymbolThemeFontFamily}" />
        <Setter Property="FontSize" Value="20" />
        <Setter Property="Height" Value="48" />
        <Setter Property="Width" Value="48" />
        <Setter Property="Content" Value="" />
</Style>

我尝试修改default button style和除ContentTogglePane按钮以外的所有其他按钮更改。我想删除边框并更改悬停时的文本颜色以及背景。

为了实现这一目标，我必须覆盖哪种风格？理想情况下，只会覆盖ContentTogglePane按钮。

Answer 1

  

我想删除边框并更改悬停时的文字颜色以及背景。

我认为您已找到AndroidManifest.xml和MasterDetailControl的默认模板样式，然后您可以将它们复制到UWP项目的PaneButton文件中（也称为UWP的应用程序资源）应用程序）。由于您想要在悬停按钮时更改样式，我们仍需要默认Button styles and templates，请将App.xaml部分复制到<Setter Property="Template">...</Setter>的样式中。 “on hover”行为由默认按钮样式中的PaneButton控制。

现在所有需要的资源都在应用程序资源中，我们可以像在标准UWP应用程序中那样简单地修改它们。例如：

<VisualState x:Name="PointerOver">

以下是此款式的渲染图片：