Create customized PivotItem header at runtime using C#

4
votes

I'm trying to add a PivotItem to a Pivot dynamically at load time. I need some screen estate and the standard pivot item header font was too big for me. Some forum searching has lead to this solution:

<controls:PivotItem>
   <controls:PivotItem.Header>
      <TextBlock FontSize="{StaticResource PhoneFontSizeLarge} Text="MyHeaderText"/>
   </controls:PivotItem.Header>
</controls:PivotItem>

This solution works okay if I defined it within the pivotitem XAML itself, but how I can do this in C# code?

2
c#xamlwindows-phone-7pivotitem
@Heinrich I jus wanted to knoe if you experieced some sort of jumpin when the page loads. I have created the pivot header in the above mentioned method in the xaml file. I used this method since I wanted to use custom fonts. When i run the app, the headers are loaded after the pivotitem and hence the UI are pushed down.?? Any fixes? – alfah

2 Answers

4
votes

You just need to create a Pivot object and some PivotItems objects and then add those PivotItems to the Pivot. At last add this Pivot to your LayoutRoot which is likely a Grid.

Something like this,

    void PivotPage2_Loaded(object sender, RoutedEventArgs e)
    {
        var pivot = new Pivot();
        var textBlock = new TextBlock { Text = "header 1", FontSize = 32 };
        var pivotItem1 = new PivotItem { Header = textBlock };

        var textBlock2 = new TextBlock { Text = "header 2", FontSize = 32 };
        var pivotItem2 = new PivotItem { Header = textBlock2 };

        pivot.Items.Add(pivotItem1);
        pivot.Items.Add(pivotItem2);

        this.LayoutRoot.Children.Add(pivot);
    }
0
votes

The following code sets the FontSize of all existing PivotElements inside a Pivot to a given value. It also (roughly) adjusts the height of the header area.

The code dives into the Pivot's children and searches for the right items to modify: PivotHeaderItem (a single header) and PivotHeadersControl (containing all headers).

using Microsoft.Phone.Controls.Primitives;

delegate void ChildProc(DependencyObject o);
// applies the delegate proc to all children of a given type
private void DoForChildrenRecursively(DependencyObject o, Type typeFilter, ChildProc proc)
{
    // check that we got a child of right type
    if (o.GetType() == typeFilter)
    {
        proc(o);
    }

    // recursion: dive one level deeper into the child hierarchy
    for (int i = 0; i < VisualTreeHelper.GetChildrenCount(o); i++)
    {
        DoForChildrenRecursively(VisualTreeHelper.GetChild(o, i), typeFilter, proc);
    }
}

// applies the given font size to the pivot's header items and adjusts the height of the header area
private void AdjustPivotHeaderFontSize(Pivot pivot, double fontSize)
{
    double lastFontSize = fontSize;
    DoForChildrenRecursively(pivot, typeof(PivotHeaderItem), (o) => { lastFontSize = ((PivotHeaderItem)o).FontSize; ((PivotHeaderItem)o).FontSize = fontSize; });
    // adjust the header control height according to font size change
    DoForChildrenRecursively(pivot, typeof(PivotHeadersControl), (o) => { ((PivotHeadersControl)o).Height -= (lastFontSize - fontSize) * 1.33; });
}

private void button1_Click(object sender, RoutedEventArgs e)
{
    // make header items having FontSize == PhoneFontSizeLarge
    AdjustPivotHeaderFontSize(pivot, (double)Resources["PhoneFontSizeLarge"]);
}

And in case you are wondering where the *1.33 in the header height calculation comes from - it was inspired by this blog post.