WP7 C# - 如何更改 Pivot 标头的样式答案

【问题标题】：WP7 C# - How to change style of Pivot headerWP7 C# - 如何更改 Pivot 标头的样式
【发布时间】：2013-03-21 11:31:37
【问题描述】：

我需要更改 Pivot 标题背景和填充（Pivot 控件的顶部菜单在哪里是数据透视项的标题）。

我试试这个：

    <controls:Pivot Grid.Row="1" Margin="0" Padding="0">
        <controls:Pivot.HeaderTemplate>
            <DataTemplate>
                <StackPanel Background="#666666" Margin="0" />
            </DataTemplate>
        </controls:Pivot.HeaderTemplate>

        <controls:PivotItem Background="#65006a">
            <controls:PivotItem.Header>
                <TextBlock FontSize="60" Margin="0">tasks</TextBlock>
            </controls:PivotItem.Header>
        </controls:PivotItem>

    </controls:Pivot>

但它并没有解决它。

我该怎么做？

【问题讨论】：

好的，抱歉，我添加了一些代码
你没有内容，我的意思是你的代码是正确的，但标题是空的
Change background of title and header in pivot control 的可能重复项
您可以尝试使用 Expression Blend 吗？那里的许多操作更容易。

标签： c# windows-phone-7 xaml windows-phone

【解决方案1】：

正确的做法是使用以下代码：

<controls:Pivot.HeaderTemplate>
    <DataTemplate>
        <StackPanel Background="#666666" Margin="0">
            <TextBlock FontSize="60" Margin="0" Text="{Binding}"/>
        </StackPanel>
    </DataTemplate>
</controls:Pivot.HeaderTemplate>

<controls:PivotItem Background="#65006a" Header="tasks">
</controls:PivotItem>

每个 PivotItem 都有标题文本，然后将其传递给 HeaderTemplate 中包含的数据模板。你可以看到我已经在 StackPanel 中移动了 TextBlock 并通过绑定设置了它的文本。你做错的是标题模板包含 only StackPanel 而里面什么都没有。

【讨论】：

这正是我的答案。重复正确答案没有意义。

【解决方案2】：

在这里，我修改了枢轴控件的标题。我用不同的颜色定义了不同的控件，这样你就可以很容易地识别我做了什么。根据需要修改此源以更改数据透视表头。

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
          <phone:Pivot>
            <phone:Pivot.HeaderTemplate>
                <DataTemplate>
                    <StackPanel Background="Blue"
                                Margin="15,-10,0,0">
                        <TextBlock Text="{Binding}"
                                   FontSize="20"
                                   />
                    </StackPanel>
                </DataTemplate>
            </phone:Pivot.HeaderTemplate>
            <phone:PivotItem Header="item1">
                <Grid Background="Red"></Grid>
            </phone:PivotItem>
            <phone:PivotItem Header="item2">
                <Grid Background="Green"></Grid>
            </phone:PivotItem>
        </phone:Pivot> 

    </Grid>

【讨论】：