Postingan kali ini, membuat aplikasi sederhana windows phone, yaitu : aplikasi "hello world".
yang harus kita lakukan adalah :
1. Jalankan Visual Studio 2012 Anda (selanjutnya disebut Visual Studio)
2. Pilih File > New Project
Kotak New Project akan muncul. Panel disebelah kiri akan menyediakan pilihan template yang dapat digunakan
3. Pada panel kiri, klik Installed sehingga akan menampilkan Visual Basic atau Visual C# dan pilih Windows Store.
4. Pilih template Blank App
5. Pada kotak Nama masukkan “HelloWorld”
6. Klik OK untuk membuat project.
Meskipun template Blank App merupakan template yang paling minimum, namun pembuatan proyek aplikasi dengan tipe ini akan menyediakan beberapa file standar yaitu :
· Berkas manifest , yang berisikan deskripsi aplikasi
· Berkas gambar untuk logo pada start screen
· Sebuah gambar (storelogo.png) yang akan menjadi logo aplikasi di Windows Store
· Sebuah gambar yang akan menjadi splash screen ketika aplikasi dijalankan
· File XAML dan berkas kode (App.xaml dan App.xaml.cs)
· Sebuah berkas MainPage.xaml dan berkas kode untuk yang akan dieksekusi ketika aplikasi dijalankan
Berkas MainPage pada template Blank App didasarkan pada template Blank Page yang hanya terdiri dari sedikit kode untuk instansiasi sebuah halaman. Template
proyek lainnya yang tersedia pada Visual Studio menyediakan sejumlah
kode tambahan dan beberapa berkas pembantu untuk membuat aplikasi
berbasis Windows 8-style UI. Pada contoh kali ini kita akan mengganti
halaman Main Page menggunakan template lain yang tersedia sehingga kita dapat memanfaatkan sejumlah kode tambahan dan berkas bantuan untuk memulai aplikasi kita.
Untuk mengganti MainPage berikut adalah langkah-langkah yang dilakukan :
1. Pada Solution Explorer , klik kanan MainPage.xaml dan pilih Delete . Klik OK untuk konfirmasi
2. Pilih Project > Add New Item lalu pilih Visual C# dan Windows Store.
3. Pada panel ditengah pilih Basic Page dan berikan nama,misalnya “MainPage”
4. Pilih Add. Jika kita pertama kali menambahkan sebuah halaman pada proyek dengan template Blank App
maka Visual Studio akan menambahkan dialog untuk menambahkan secara
otomatis berkas-berkas terkait yang diperlukan ke dalam proyek tersebut.
Pilih Yes untuk menambahkan berkas tersebut. Berkas akan berada pada direktori Common di dalam proyek.
Kita akan lihat beberapa berkas yang otomatis ditambahkan ketika membuat proyek menggunakan template.
App.xaml adalah tempat dimana kita mendefinisikan berbagai hal yang
akan digunakan oleh aplikasi. Berkas ini mengandung sebuah Resource Dictionary
yang didalamnya mengandung referensi ke berkas StandardStyles.xaml.
Berkas ini mengandung berbagai properti standar untuk membuat tampilan
ala Windows 8-style UI. Bagi yang akrab dengan pemrograman web, dapat
kita anggal berkas ini sebagai berkas CSS untuk mengatur tampilan dari
aplikasi. Seperti berkas kode lainnya, disini terdapat fungsi
InitializeComponen, yang dihasilkan otomatis oleh Visual Studio.
MainPage.xaml adalah tempat kita mendefinisikan antarmuka dari
aplikasi. Kita dapat menambahkan secara langsung melalui XAML atau
secara drag and drop melalui antarmuka Visual Studio. Template Basic Page menggunakan LayoutAwarePage. Kelas ini merupakan kelas turuan dari kelas Page yang sudah menyediakan fungsi navigasi,manajemen state dan manajemen tampilan (view management). Basic Page juga menyediakan beberapa konten seperti tombol Back dan teks Title.
Sekarang kita tambahkan konten MainPage.xaml.
1. Pada Solution Explorer , klik dua kali berkas MainPage.xaml
2. Cari resource ApName pada bagian atas halaman, dan ubah nilainya menjadi “Hello, world!”.
<x:String x:Key="AppName">Hello, World!</x:String>
3. Pada root Grid, sebelum tag
<VisualStateManager.VisualStateGroups> tambahkan sebuah StackPanel
dengan TextBlock untuk meminta nama pada pengguna, dan sebuah TextBox
untuk menerima masukan pengguna, sebuah Button. Penjelasan kontrol yang
digunakan akan dijelaskan kemudian. Listing kode nya adalah sebagai
berikut :
<StackPanel Grid.Row="1" Margin="120,30,0,0">
<TextBlock Text="What's your name?"/>
<StackPanel Orientation="Horizontal" Margin="0,20,0,20">
<TextBox x:Name="nameInput"
Width="300" HorizontalAlignment="Left"/>
<Button Content="say hello"/>
</StackPanel>
<TextBlock x:Name="greetingOutput"/>
</StackPanel>
4. Pilih Button yang sudah ditambahkan di MainPage.xaml
5. Pada jendela Properties, pilih tombol Events (disebelah kanan pojok atas, yang menyerupai petir), pilih event
Click dan tempatkan sebuah nama fungsi yang akan dipanggil,ketika
Button tersebut diklik. Pada contoh ini, berikan nama Button_Click
6. Tambahkan kode berikut ini di berkas kode sumber untuk halaman tersebut. Event handler adalah mekanisme memberikan sebuah aksi yang akan dilakukan aplikasi terkait dengan event yang dibangkitkan oleh pengguna,dalam contoh ini adalah meng-klik Button.
private void Button_Click(object sender, RoutedEventArgs e)
{
greetingOutput.Text = “Hello, ” + nameInput.Text + “!”;
} |
7. Tekan F5 dan jalankan aplikasi. Ketikkan nama Anda dan klik Button untuk menampilkan hasilnya.
Selamat, pada tahap ini , Anda sudah berhasil membuat aplikasi Windows 8-style UI pertama Anda J . Nah,
sebelum membahas lebih dalam mengenai konsep-konsep baru pada
pengembangan aplikasi Windows 8-style UI, pada bagian-bagian selanjutnya
kita akan berkenalan dengan hal-hal mendasar yang baru dan wajib
diketahui pemrogram yang sudah biasa dengan dunia .NET seperti Visual
Studio 2012, XAML, pemrograman asinkronus dan kontrol-kontrol yang dapat
digunakan untuk membangun antarmuka aplikasi.
Developer License
Apabila Anda menggunakan Visual Studio untuk pertama kalinya maka
Visual Studio akan meminta developer license ketika kita ingin
mengembangkan aplikasi Windows 8-style UI. License ini diperoleh secara
gratis,pastikan komputer Anda terhubung ke internet dan masukkan akun
Windows Live Anda dan license akan diperoleh.
Terimakasih untuk para master yang telah berbagi ilmunya..
Sumber : http://pujalabs.net/2013/08/hello-world-windows-8/
