Navigasi Pada Windows Phone

Navigasi pada Windows Phone menggunakan model navigasi yang diperkenalkan pertama kali pada Silverlight 3 (http://www.silverlight.net/learn/videos/silverlight-videos/navigation-framework/). Terdapat dua elemen penting yaitu Frame dan Page.


Frame,terintegrasi dengan keseluruhan tampilan aplikasi pada Windows Phone dan hanya satu frame yang boleh digunakan sepanjang aplikasi. Beberapa karakteristik yang berhubungan dengan frame adalah properti yang dapat digunakan (full screen, orientasi), dapat mengekspose area halaman yang berada di dalamnya dan menyediakan lokasi yang disediakan untuk system tray dan application bar. System tray merupakan suatu area yang menampilkan informasi status dari keadaan sistem, seperti baterai , sinyal dan lain-lain. Sementara application bar menyediakan tempat untuk suatu task yang paling sering digunakan.

Page,sebuah page akan mengisi seluruh bagian isi dari sebuah frame. Karakteristik utama dari sebuah page adalah mengandung sebuah title, dan dapat menampilkan application bar secara spesifik pada halaman tertentu.


Untuk melakukan navigasi dapat memanfaatkan sepenuhnya kelas NavigationService . Kelas ini bersifat static, dan cukup dengan memberikan halaman yang dituju sebagai parameter. Sebagai contoh dibawah ini telah dibuat terlebih dahulu dua buah halaman, dan kita akan melakukan navigasi ketika tombol di tekan.


   1: private void button1_Click(object sender, RoutedEventArgs e)

   2:         {

   3:             NavigationService.Navigate(new Uri("/SecondPage.xaml",UriKind.Relative));

   4:         }

Selanjutnya, terkadang kita membutuhkan passing parameter ketika melakukan navigasi dari satu halaman ke halaman lainnya. Apabila data yang ingin di-share cukup besar sebaiknya variabel tersebut ditempatkan di App resources namun jika cukup kecil misalnya untuk mengirimkan id dari suatu produk untuk keperluan retrieve produk detail pada halaman selanjutnya, query string bisa dijadikan alternatif yang baik.

Konsep dari query string persis sama dengan method GET saat kita coding di PHP. Yang perlu dilakukan adalah melekatkan pasangan key dan value pada saat berpindah dari satu halaman ke halaman lainnya. Pada contoh dibawah dilempar sebuah nilai dengan key msg dan value title dari page title.

   1: private void button1_Click(object sender, RoutedEventArgs e)

   2:        {

   3:            NavigationService.Navigate(new Uri("/SecondPage.xaml?msg="+this.PageTitle.Text,UriKind.Relative));

   4:        }

Selanjutnya pada halaman yang dituju, kita perlu meng-override method OnNavigatedTo.Method ini adalah method yang dieksekusi ketika halaman berpindah dari satu ke yang lainnya. Lakukan retrieve value yang diperlukan lalu proses sesuai dengan keinginan.

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

   2:        {

   3:            base.OnNavigatedTo(e);

   4:

   5:            string msg = "";

   6:

   7:            if (NavigationContext.QueryString.TryGetValue("msg", out msg))

   8:

   9:                textBlock1.Text = "Dari halaman"+msg;

  10:        }

Jika Anda membuat project dengan template DataBound maka kode ini segera langsung anda dapatkan karena skenario template tersebut adalah untuk membangun aplikasi master/detail dimana terdapat kebutuhan menampilkan data-data detail berdasarkan daftar pada halaman master.

Contoh program kecilnya dapat diunduh disini.
http://cid-3543a916eed05fb8.office.live.com/embedicon.aspx/Code/NavigationApps.zip

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s