Deepal Pallav Suthar
Deepal Pallav Suthar

Reputation: 41

Navigation to a Specific PivotItem

How do I navigate to a specific Pivot-item of Pivot-Page when I tap an Image on Main-Page ?

The XAML codes are following for Image on Main Page

 <Image  Source="Assets/5.jpg" Stretch="UniformToFill" Height="150" Width="150" Margin="12,12,0,0"/>

And the code for Pivot-Page is following

<phone:PivotItem Header="fifth">
    ..........         
    ..........                      
        </phone:PivotItem>

I want to navigate to the fifth Pivot-Item when I tap the Image on Main Page..

Upvotes: 4

Views: 7096

Answers (2)

pjl91
pjl91

Reputation: 865

You may want to send in your navigation args the index of the PivotItem you want to navigate to (if your Pivot HAS static PivotItems)

so you want to navigate to the FIFTH PivotItem, then you may want to pass a navigation parameter with the index of PivotItem (which is 4). In your PivotItem page, you will get the index from the passed param and select the PivotItem using the property SelectedIndex

For example, your Pivot is contained in PivotPage.xaml, then you may want to navigate to that page like so (you add the navigation call to the image tap event handler of course):

this.NavigationService.Navigate(new Uri("/PivotPage.xaml?item=4", UriKind.RelativeOrAbsolute));

item=4 is your navigation param

Then in your PivotPage.xaml code-behind, add an override to OnNavigateTo() method of PhoneApplicationPage, like so:

protected override void OnNavigatedTo(NavigationEventArgs e)
{
        base.OnNavigatedTo(e);
        if (NavigationContext.QueryString.ContainsKey("item"))
        {
            var index = NavigationContext.QueryString["item"];
            var indexParsed = int.Parse(index);
            Pivot.SelectedIndex = indexParsed;
        }
}

Upvotes: 7

AD.Net
AD.Net

Reputation: 13399

Pivot control has properties like SelectedItem or SelectedIndex which can be set to do this.

<phone:Pivot x:Name="pvControl">
<phone:PivotItem x:Name="piFive" Header="fifth">
    ..........         
    ..........                      
        </phone:PivotItem>

pvControl.SelectedItem = piFive;

Upvotes: 7

Related Questions