Over a million developers have joined DZone.

Working Around Pivot SelectedIndex Limitations in Windows Phone 7

DZone's Guide to

Working Around Pivot SelectedIndex Limitations in Windows Phone 7

· Mobile Zone
Free Resource

Download this comprehensive Mobile Testing Reference Guide to help prioritize which mobile devices and OSs to test against, brought to you in partnership with Sauce Labs.

I've been working on an application with 2 pages, a main page and a content page. The content page contains a Pivot control with a few pivot items. The main page does nothing but navigate to the content page and suggest which pivot item to display. The only reason the main page exists is to display the information in the pivot item headers in a more graphical and elegant way.

For some reason I can't set the displayed pivot index to be the third item. I wanted to do this on the OnNavigatedTo event of the content page but whenever I attempt doing so an exception is thrown. Every other pivot item works fine, which I think is really weird.

To load the content page, I navigate to the page by passing some information of the pivot index I wish to be displayed. Something like this:
NavigationService.Navigate(new Uri("/ContentPage.xaml?index=" + index, UriKind.Relative));
If the value of index in the code above is set to 2 then I get an exception, any other valid value works fine. A value out of range (less than 0 or greater than 5) throws an out of range exception which is the behavior anyone would expect.

Here's the XAML definition of the content page
    mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait"  Orientation="Portrait"
  <Grid x:Name="LayoutRoot" Background="Transparent">
    <controls:Pivot Name="pivot" Title="CONTENT PAGE">
      <controls:PivotItem Header="first" />
      <controls:PivotItem Header="second" />
      <controls:PivotItem Header="third" />
      <controls:PivotItem Header="fourth" />
      <controls:PivotItem Header="fifth" />
      <controls:PivotItem Header="sixth" />

To work around this limitation, you can handle the Loaded event of the page and update the pivot selected index from there. Here's an example how to do it:
public partial class ContentPage : PhoneApplicationPage
    private int pivotIndex;
    public ContentPage()
        Loaded += delegate { pivot.SelectedIndex = pivotIndex; };
    protected override void OnNavigatedTo(NavigationEventArgs e)
        string value;
        if (NavigationContext.QueryString.TryGetValue("index", out value))
            pivotIndex = 0;
            int.TryParse(value, out pivotIndex);

I'm not sure if this limitation is by design or it's a bug in the control. Either way I managed to get it to work the way I wanted it to. Hopefully I'm not the only one who ran across this and that you found this information useful.

Analysts agree that a mix of emulators/simulators and real devices are necessary to optimize your mobile app testing - learn more in this white paper, brought to you in partnership with Sauce Labs.


Published at DZone with permission of Christian Helle, DZone MVB. See the original article here.

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}