Page Navigation in Windows Phone 7

In this article, we discuss page navigation in Windows Phone 7.

For this, first we use a TextBlock, with the help of this we can go to the next page. (Here we use another page (Page2) to show the navigation process).

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <TextBlock x:Name="txtnavsecpage" HorizontalAlignment="Center" VerticalAlignment="Center" Text="Next Page" Margin="132,114,172,466"></TextBlock>
</Grid>

Now we set an event handler ManipulationStarted="OntxtManipulationStarted" in the TextBlock. This event is used to begin the manipulation.

<TextBlock x:Name="txtnavsecpage" ManipulationStarted="OntxtManipulationStarted" HorizontalAlignment="Center" VerticalAlignment="Center" Text="Next Page" Margin="132,114,172,466"></TextBlock>

Now we write the following code in the .cs page of the application:

public partial class MainPage : PhoneApplicationPage
{
    public MainPage()
    {
        InitializeComponent();
    }
    void OntxtManipulationStarted(object Sender, ManipulationStartedEventArgs args)
    {
        this.NavigationService.Navigate(new Uri("/Page2.xaml",UriKind.Relative));
        args.Complete();
        args.Handled = true;
    }
}

Here NavigationService.Naviagte is used to navigate on the particular Page (Here Page2.aspx) and  UriKind.Relative is used to show that the path is Relative, Absolute or RelativeOrAbsolute.

Now we look at this code:

First we need to declare this:

Random rand = new Random();

And then write the code:

protected override void OnManipulationStarted(ManipulationStartedEventArgs args)
{
    ContentPanel.Background=new SolidColorBrush(Color.FromArgb(255,(byte)rand.Next(235),(byte)rand.Next(245),(byte)rand.Next(255)));
    base.OnManipulationStarted(args);
}

With the help of this code when we click anywhere on the page outside the Textblock, the background of the ContentPanel is randomly changed.  Here the Color.FromArgb property is used to set the opacity and the RGB (Red, Green, Blue) Color.

Now we take an another example in which we set the GoBack property by which we get back to the page that navigated to Page2.xaml (here MainPage.xaml). For this, first we take a TextBlock in Page2.xaml:

<TextBlock x:Name="gobackfirpage" ManipulationStarted="OnTextGoBackManipulationStarted" Text=" Go Back!!!" Margin="24,47,-24,-47"></TextBlock>

and write the following code for the ManipulationStarted Event in the .cs page. 

public partial class Page1 : PhoneApplicationPage
{
    public Page1()
    {
        InitializeComponent();
    }
    void OnTextGoBackManipulationStarted(object Sender, ManipulationStartedEventArgs args)
    {
        this.NavigationService.GoBack();
        args.Complete();
        args.Handled = true;
    }
} 

When we click on back we return to the main page (MainPage.xaml).