Rabu, 27 November 2013

Tutorial membuat halaman pada aplikasi berbasis windows phone | Windows Phone | 22 November 2013

Assalamu'alaikum warahmatullahi wabarakatuh

Teman-teman yang berbahagia, selamat membaca kembali di tutorial windows phone, untuk saat ini saya kan menjelaskan tentang bagaimana membuat halaman pada aplikasi windows phone kalian pasti tau aplikasi akan lebih menarik jika tampilannya yang dinamis tidak statis, artinya itu akan memungkinkan berganti halaman. nah kita akan belajar tentang berganti halaman, istilahnya kita sebut "link". oke tidak berlama-lama, mari kita buat new project, dan kalian beri nama "navigationPage" langkah berikutnya kalian buat page. tambah kan text box dan beri nama "input1TXT" tambahkan text block dan beri nama "output2TB" pasangkan text box diatas text block, kalau tambahkan 4 button. nah button ini adalah yang akan menghubungkan antar halaman (page). button 1 berinama "Go Page 2" button 2 berinama "Go Page 3" button 3 berinama "Go Page 4" button 4 beri nama "Go Page 5" kira-kira jadinya akan seperti ini


perlu di ingat, kita membuat 5 page, jadi yang kalian lakukan adalah buat seperti ini sampai 5 page. perlu diperhatikan juga penamaan nya jgn sampai sama dengan page sebelumnya. karna akan error. aplikasi ini akan memunculkan input user di halaman yang user inginkan, misalnya user menginput di MainPage dan menekan button "Go Page 4" nanti kata tersebut akan muncul di page 4. mudahkan? konsepnya ini mudah sekali teman-teman. misalnya kita buat koding di button "Go page 2" maka akan sama jika kita masukan di button "Go Page 3". nih kodingnya pada button:
 private void page2BT_Click(object sender, RoutedEventArgs e)
        {
            string name = input1TXT.Text;
            NavigationService.Navigate(new Uri("/views/SecondPage.xaml?name=" + name, UriKind.Relative));
        }

maksud dari koding ini text box 1 di isi berupa string, lalu string tersebut di link ke SecondPage.xaml dengan parameter name, untuk NavigationService.Navigate maksudnya yang kita inputkan akan dipindahkan kemana, jadi jangan lupa memakai ini. karna jika tidak maka tidak akan bisa. oh iya sempet lupa, tadi kalian kan sudah bikin 5 halaman (page) nah untuk penamaannya kita samakan saja yaaa page ke 2 beri nama "SecondPage" page ke 3 beri nama "PageThree" page 4 beri nama "PageFour" page ke 5 beri nama "PageFive" nah kalau udah copas koding ini ke setiap button yah.
private void page3BT_Click(object sender, RoutedEventArgs e)
        {
            string name = input1TXT.Text;
            NavigationService.Navigate(new Uri("/views/PageThree.xaml?name=" + name, UriKind.Relative));
        }

        private void page4BT_Click(object sender, RoutedEventArgs e)
        {
            string name = input1TXT.Text;
            NavigationService.Navigate(new Uri("/views/PageFour.xaml?name=" + name, UriKind.Relative));
        }

        private void page5BT_Click(object sender, RoutedEventArgs e)
        {
            string name = input1TXT.Text;
            NavigationService.Navigate(new Uri("/views/PageFive.xaml?name=" + name, UriKind.Relative));
        }

paham kan yah? jadi ini untuk link ke halaman yang akan kita tuju, nah bagaimana kodingnya menampilkan input user dihalaman lain? ini kan hanya masuk ke halaman. nah  
string name = input1TXT.Text;
koding itu menginput jenis string ke dalam text box. lalu bagaimana kodingnya merespon dari koding itu?
protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)
        {
            string name = "";
            if (NavigationContext.QueryString.TryGetValue("name", out name))
            {
                output2TB.Text = String.Format("name = {0}", name);
           
            }
        }

koding ini yang akan menampilkan yang user input, jika berhasil akan muncul seperti ini
misalkan kita mau masukan ke page 5


nah seperti ini jadi pada page ini kita masukan koding yang barusan, hanya diganti linknya.
private void page1BT_Click(object sender, RoutedEventArgs e)
        {
            string name = input5TXT.Text;
            NavigationService.Navigate(new Uri("/views/MainPage.xaml?name=" + name, UriKind.Relative));
        }

        private void page2BT_Click(object sender, RoutedEventArgs e)
        {
            string name = input5TXT.Text;
            NavigationService.Navigate(new Uri("/views/SecondPage.xaml?name=" + name, UriKind.Relative));
        }

        private void page3BT_Click(object sender, RoutedEventArgs e)
        {
            string name = input5TXT.Text;
            NavigationService.Navigate(new Uri("/views/PageThree.xaml?name=" + name, UriKind.Relative));
        }

cukup sekian tutorial kali ini, jadi intinya koding ini hanya dibalikan saja antara halaman satu dengan yang lainnya. mudahkan? yok coba :)
semoga bermanfaat, terimakasih

0 komentar:

Posting Komentar