Search code examples
xamlwindows-phone-7windows-phone-8pivotitem

How to Change a Pivot Items Body Default Colors


I have been using a general custom Pivot style in my app, but it is changing the header foreground as well as body foreground to the same color (Blue). I only need the header foreground to change accordingly to my specifications, but the body foreground should remain to be the default application foreground. How might I make that change in the following template?

<Style x:Key="PivotStyleBlue" TargetType="phone:Pivot">
        <Setter Property="Margin" Value="0"/>
        <Setter Property="Padding" Value="0"/>
        <!--<Setter Property="Foreground" Value="{StaticResource PhoneForegroundBrush}"/>-->
        <Setter Property="Foreground" Value="Blue"/>
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="ItemsPanel">
            <Setter.Value>
                <ItemsPanelTemplate>
                    <Grid/>
                </ItemsPanelTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="phone:Pivot">
                    <Grid HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
  VerticalAlignment="{TemplateBinding VerticalAlignment}">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="*"/>
                        </Grid.RowDefinitions>
                        <Grid CacheMode="BitmapCache" Grid.RowSpan="2" >
                            <Grid.Background>
                                <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                                    <GradientStop Color="Transparent" Offset="0.0" />
                                    <GradientStop Color="Transparent" Offset="1.0" />
                                </LinearGradientBrush>
                            </Grid.Background>
                        </Grid>
                        <Grid Background="{TemplateBinding Background}" CacheMode="BitmapCache"
    Grid.Row="2" />
                        <ContentPresenter ContentTemplate="{TemplateBinding TitleTemplate}"
                Content="{TemplateBinding Title}" Margin="24,17,0,-7"/>
                        <Primitives:PivotHeadersControl x:Name="HeadersListElement"
                                      Grid.Row="1"/>
                        <ItemsPresenter x:Name="PivotItemPresenter"
              Margin="{TemplateBinding Padding}" Grid.Row="2"/>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

Solution

  • Change Foreground of HeadersListElement only.

    <Primitives:PivotHeadersControl
        x:Name="HeadersListElement"
        Foreground="Blue"
        Grid.Row="1" />