Pertemuan Kesepuluh | Windows Phone | 22 November 2013

Bismillah…

Jum’at, 22 November 2013

Di episode kali ini, di pertemuan kesepuluh  ini, di hari dan waktu yang sama ini,  saya sangat ingin berbagi ilmu tentang Navigation Page. Kenapa sih mesti belajar Navigation????.. . Sebelumnya saya ingin bercerita sedikit, di pertemuan hari ini pak dosen masih seperti biasanya memberikan Pertanyaan atau keyword sebelum abesensi. Absensi hari ini “Sebutkan Alasan Kenapa Kamu Kuliah Di TEDC???”…Hmmm  bermacam  alasan yg di jawab oleh temen – temen saya. Pastinya alasan utama ya karna Allah yaa,,Karena Allah tahu mana yang terbaik buat kita, saya yakin temen – temen semua pasti punya alasan tersendiri memilih kuliah di kampus ini. Semoga kita menjadi orang yang selaluuu membahagiakan orang tua,orang2 sekitar, bermanfaat bagi orang lain dan menjadi orang yang sukses dunia akhirat… Aamiin

Langsung aja yaa ke pembahasan dan tugas praktikum saya hari ini…

Tujuan belajar Navigation page ini  agar kita mengetahui bagaimana membuat halaman lebih dari satu atau berpindah halaman dan bisa saling bertukar nilai antar halaman…

1. Buka aplikasi windows phone – new project – name dan solution name (TugasNavigationPage)
2. Kemudian Pilih platform Windows Phone 7.1
3. Buat Folder untuk menyimpan halaman baru yg akan kita buat >  Klik kanan  pada Project– Add- New Folder (Views)
4. Buat 5 halaman baru > Klik kanan pada Folder Views – Add - New Item
   
   • MainPage ( Ngak usah lg di buat karena udah default)
   • SecondPage
   • ThirdPage
   • FourthPage
   • FifthPage

 Ne contoh gambar yang sudah saya buat :

 
Detail Halaman MainPage :

• TextBox
  Name="mainTBx"
  Text=""
•         TextBlock
  Name="mainTBl"
  Text="" 
• Button1
  Name="page2"
  Content="SecondPage"
• Button2
  Name="page3"
  Content="ThirdPage”
•         Button3
  Name="page4"
  Content="FourthPage”
•          Button4
  Name="page5"
  Content="FifthPage”

Halaman MainPage.xaml.cs

//Kode ini untuk mengirimkan data di textbox ke halaman  Uri
private void page2_Click(object sender, RoutedEventArgs e)

        {

            string name = mainTBx.Text;

            NavigationService.Navigate(new Uri("/Views/SecondPage.xaml?name=" + name, UriKind.Relative));

        }

// Kode ini untuk menerima data yang dikirimkan,dan format a seperti apa
protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)

        {

            string name = "";

            if (NavigationContext.QueryString.TryGetValue("name", out name))

            {

                mainTBl.Text = string.Format("{0}", name);

            }

        }

private void page3_Click(object sender, RoutedEventArgs e)

        {

            string name = mainTBx.Text;

            NavigationService.Navigate(new Uri("/Views/ThirdPage.xaml?name=" + name, UriKind.Relative));

        }

private void page4_Click(object sender, RoutedEventArgs e)

        {

            string name = mainTBx.Text;

            NavigationService.Navigate(new Uri("/Views/FourthPage.xaml?name=" + name, UriKind.Relative));

        }

private void page5_Click(object sender, RoutedEventArgs e)

        {

            string name = mainTBx.Text;

            NavigationService.Navigate(new Uri("/Views/FifthPage.xaml?name=" + name, UriKind.Relative));

        }

Detail Halaman SecondPage :

• TextBox
  Name="secondTBx" 
  Text=""
•           TextBlock
  Name="secondTBl"
  Text="" 
• Button1
  Name="mainpage"
  Content="MainPage"
• Button2
  Name="page3"
  Content="ThirdPage”
•          Button3
  Name="page4"
  Content="FourthPage”
•          Button4
  Name="page5"
  Content="FifthPage”

Halaman SecondPage.xaml.cs

protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)

        {

            string name = "";

            if (NavigationContext.QueryString.TryGetValue("name", out name))

            {

                secondTBl.Text = string.Format("{0}", name);

            }

        }

private void mainpage_Click(object sender, RoutedEventArgs e)

        {

            string name = secondTBx.Text;

            NavigationService.Navigate(new Uri("/MainPage.xaml?name=" + name, UriKind.Relative));

        }

private void page3_Click(object sender, RoutedEventArgs e)

        {

            string name = secondTBx.Text;

            NavigationService.Navigate(new Uri("/Views/ThirdPage.xaml?name=" + name, UriKind.Relative));

        }

private void page4_Click(object sender, RoutedEventArgs e)

        {

            string name = secondTBx.Text;

            NavigationService.Navigate(new Uri("/Views/FourthPage.xaml?name=" + name, UriKind.Relative));

        }

private void page5_Click(object sender, RoutedEventArgs e)

        {

            string name = secondTBx.Text;

            NavigationService.Navigate(new Uri("/Views/FifthPage.xaml?name=" + name, UriKind.Relative));

        } 

Detail Halaman ThirdPage :

• TextBox
  Name="thirdTBx" 
  Text=""
•         TextBlock
  Name="thirdTBl"
  Text="" 
• Button1
  Name="mainpage"
  Content="MainPage"
• Button2
  Name="page2"
  Content="SecondPage”
•         Button3
  Name="page4"
  Content="FourthPage”
•          Button4
  Name="page5"
  Content="FifthPage”

Halaman ThirdPage.xaml.cs

protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)

        {

            string name = "";

            if (NavigationContext.QueryString.TryGetValue("name", out name))

            {

                thirdTBl.Text = string.Format("{0}", name);

            }

        }

private void mainpage_Click(object sender, RoutedEventArgs e)

        {

            string name = thirdTBx.Text;

            NavigationService.Navigate(new Uri("/MainPage.xaml?name=" + name, UriKind.Relative));

        }

private void page2_Click(object sender, RoutedEventArgs e)

        {

            string name = thirdTBx.Text;

            NavigationService.Navigate(new Uri("/Views/SecondPage.xaml?name=" + name, UriKind.Relative));

        }

private void page4_Click(object sender, RoutedEventArgs e)

        {

            string name = thirdTBx.Text;

            NavigationService.Navigate(new Uri("/Views/FourthPage.xaml?name=" + name, UriKind.Relative));

        }

private void page5_Click(object sender, RoutedEventArgs e)

        {

            string name = thirdTBx.Text;

            NavigationService.Navigate(new Uri("/Views/FifthPage.xaml?name=" + name, UriKind.Relative));

        }

Detail  Halaman FourthPage:

• TextBox
  Name="fourthTBx" 
  Text=""
•            TextBlock
  Name="fourthTBl"
  Text="" 
• Button1
  Name="mainpage"
  Content="MainPage"
• Button2
  Name="page3"
  Content="ThirdPage”
•            Button3
  Name="page4"
  Content="FourthPage”
•            Button4
  Name="page5"
  Content="FifthPage”

Halaman FourthPage.xaml.cs

protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)

        {

            string name = "";

            if (NavigationContext.QueryString.TryGetValue("name", out name))

            {

                fourthTBl.Text = string.Format("{0}", name);

            }

        }

private void mainpage_Click(object sender, RoutedEventArgs e)

        {

            string name = fourthTBx.Text;

            NavigationService.Navigate(new Uri("/MainPage.xaml?name=" + name, UriKind.Relative));

        }

        private void page2_Click(object sender, RoutedEventArgs e)

        {

            string name = fourthTBx.Text;

            NavigationService.Navigate(new Uri("/Views/SecondPage.xaml?name=" + name, UriKind.Relative));

        }

private void page3_Click(object sender, RoutedEventArgs e)

        {

            string name = fourthTBx.Text;

            NavigationService.Navigate(new Uri("/Views/ThirdPage.xaml?name=" + name, UriKind.Relative));

        }

private void page5_Click(object sender, RoutedEventArgs e)

        {

            string name = fourthTBx.Text;

            NavigationService.Navigate(new Uri("/Views/FifthPage.xaml?name=" + name, UriKind.Relative));

        }

Detail Halaman FifthPage :

• TextBox
  Name="fifthTBx" 
  Text=""
•         TextBlock
  Name="fifthTBl"
  Text="" 
• Button1
  Name="mainpage"
  Content="MainPage"
• Button2
  Name="page2"
  Content="SecondPage”
•         Button3
  Name="page3"
  Content="ThirdPage"
•          Button4
  Name="page4"
  Content="FourthPage"

Halaman FifthPage.xaml.cs

protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)

        {

            string name = "";

            if (NavigationContext.QueryString.TryGetValue("name", out name))

            {

                fifthTBl.Text = string.Format("{0}", name);

            }

        }

private void mainpage_Click(object sender, RoutedEventArgs e)

        {

            string name = fifthTBx.Text;

            NavigationService.Navigate(new Uri("/MainPage.xaml?name=" + name, UriKind.Relative));

        }

private void page2_Click(object sender, RoutedEventArgs e)

        {

            string name = fifthTBx.Text;

            NavigationService.Navigate(new Uri("/Views/SecondPage.xaml?name=" + name, UriKind.Relative));

        }

private void page3_Click(object sender, RoutedEventArgs e)

        {

            string name = fifthTBx.Text;

            NavigationService.Navigate(new Uri("/Views/ThirdPage.xaml?name=" + name, UriKind.Relative));

        }

private void page4_Click(object sender, RoutedEventArgs e)

        {

            string name = fifthTBx.Text;

            NavigationService.Navigate(new Uri("/Views/FourthPage.xaml?name=" + name, UriKind.Relative));

        }

Kode – kode yang di buat di atas akan saling bertukar nilai. Contoh ketika kita  membuat  kata – kata pada textbox (mainTBx ) di halaman MainPage. Ketika kita klik Button SecondPage, Maka kata – kata yang kita ketikan di textbox halaman Main Page akan tampil di TextBlock (secondTBl) Halaman SecondPage.

    



Begitu juga ketika kita mengetikan kata – kata pada textbox (secondTBx) pada halaman SecondPage, ketika kita Klik Button MainPage Maka kata – kata yang kita ketikan di textbox SecondPage, Akan tampil di TextBlock (mainTBl) pada halaman MainPage…

 

Begitu juga kalo kita ingin bertukar nilai dengan halaman lain, sama seperti yang saya contohkan prosesnya,,,

Hanya ini yg bisa saya ceritakan dan bagikan di pertemuan kali ini, Ma’af  jikalau pembahasan dan penjelasannya kurang mendetail…

Semoga Bermanfaat :)