如何设置 HubSection Header 样式

Question

我想更改 HubSection Header 的字体系列、字体大小和前景色。

像这样：

<Style TargetType="HubSection" x:Key="HubSection">
    <Setter Property="Header">
        <Setter.Value>
            <Setter Property="FontSize" Value="100"></Setter> 
            <Setter Property="Foreground" Value="Yellow"></Setter>
        </Setter.Value>            
    </Setter>        
</Style>


<HubSection Width="500" Header="Section Name" Style="{StaticResource HubSection}">

我该怎么做？

Answer 1

您要更改的属性不是 Header，而是 HeaderTemplate。这是我的工作示例：

<Style TargetType="HubSection">
    <Setter Property="HeaderTemplate">
        <Setter.Value>
            <DataTemplate>
                <TextBlock Text="{Binding}"
                           FontSize="100"
                           Foreground="Yellow"/>
            </DataTemplate>
        </Setter.Value>
    </Setter>
</Style>

如果您想将此样式应用于应用中的所有 Hub 控件，只需删除 Key 并将其放在 App.xaml 文件在 Resources.

Answer 2

如果您不想覆盖 header 模板，您可以覆盖默认主题资源：

    <FontWeight x:Key="HubSectionHeaderThemeFontWeight">SemiLight</FontWeight>
    <x:Double x:Key="HubSectionHeaderThemeFontSize">26.667</x:Double>

遗憾的是，没有针对 FontFamily 和 Foreground 的特殊资源。模板正在使用 Button 的默认值。所以你会影响整个应用程序。但在很多情况下这就是你想要的，对吧？

 <FontFamily x:Key="ContentControlThemeFontFamily">Segoe UI</FontFamily>
 <SolidColorBrush x:Key="ButtonForegroundThemeBrush" Color="Red" />

如何设置 HubSection Header 样式

How to set HubSection Header Style

xaml

windows-phone-7

windows-phone-8

windows-8.1