CODEWITHSUNDEEP
windows-phone-7windows-phone-8pivotwindows-phone-7.1pivotitem
Ajay
Ajay

Reputation: 6590

Modify pivot item font size and font family

I am developing one windows phone app. I have added style to Pivot Item.

<phone:PhoneApplicationPage.Resources>
    <Style TargetType="phone:Pivot">
        <Setter Property="Margin" Value="0"/>
        <Setter Property="Padding" Value="0"/>
        <Setter Property="Foreground" Value="{StaticResource PhoneForegroundBrush}"/>
        <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 Background="#D62429" CacheMode="BitmapCache" Grid.RowSpan="2" />
                        <Grid Background="{TemplateBinding Background}" CacheMode="BitmapCache"
    Grid.Row="2" />
                        <ContentPresenter ContentTemplate="{TemplateBinding TitleTemplate}"
                Content="{TemplateBinding Title}" Margin="25,10,0,0" />
                        <Primitives:PivotHeadersControl x:Name="HeadersListElement"
                                      Grid.Row="1" />
                        <ItemsPresenter x:Name="PivotItemPresenter"
              Margin="{TemplateBinding Padding}" Grid.Row="2"/>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>       
</phone:PhoneApplicationPage.Resources>

It show like this

enter image description here

I am trying to change the font size and font family of Pivot Item and also Pivot Title i.e. Welcome and item 1. How can I change the font size and font family of these?

Upvotes: 2

Views: 4072

Answers (3)

Joel Joseph
Joel Joseph

Reputation: 6169

To Change the font size or font family of pivot header use this code inside the Pivot

<phone:Pivot.HeaderTemplate>                
            <DataTemplate>
                <Grid >
                    <TextBlock FontFamily="Times New Roman"  Text="{Binding}" FontSize="20" Height="auto"/>
                </Grid>                 
            </DataTemplate>
</phone:Pivot.HeaderTemplate>

Upvotes: 0

Swapnika
Swapnika

Reputation: 480

Try defining Pivot item in this way:

 <Grid x:Name="LayoutRoot" Background="Transparent">
    <!--Pivot Control-->
    <controls:Pivot Title="WELCOME" FontSize="30" FontFamily="Arial">
        <!--Pivot item one-->
        <controls:PivotItem >
            <controls:PivotItem.Header>
                <TextBlock Text="item1" FontSize="30" FontFamily="Arial" Margin="0,30,0,0"/>
            </controls:PivotItem.Header>
            <Grid/>
        </controls:PivotItem>

        <!--Pivot item two-->
        <controls:PivotItem >
            <controls:PivotItem.Header>
                <TextBlock Text="item2" FontSize="30" FontFamily="Arial" Margin="0,30,0,0"/>
            </controls:PivotItem.Header>
            <Grid/>
        </controls:PivotItem>
    </controls:Pivot>
</Grid>

Upvotes: 6

Tariq
Tariq

Reputation: 593

Sorry for some reason I cannot see your image but I answered very similar question just recently. See if this helps:

wp8 Set header's size of dynamic pivot item

Upvotes: 0

Related Questions