Hello, WPF!

Contoh yang paling pertama dan paling klasik dalam tutorial programming apapun adalah "Hello, world!" , tapi ditutorial kali ini kita akan antimainstream dan mengubahnya menjadi "Hello, WPF!". Tujuannya adalah untuk menampilkan text ini ke layar, untuk menunjukan seberapa mudahnya untuk memulainya.

Sisa dari tutorial ini akan menganggap kamu sudah memiliki IDE yang telah terpasang, terutama Visual Studio atau Visual Studio Community (lihat artikel sebelumnya untuk cara mendapatkannya). Jika kamu menggunakan produk lain, kamu harus mengadaptasi instruksi ini ke produk yang kamu gunakan.

Di Visual Studio, mulai dengan memilih New project dari File menu. Di kiri, kamu akan melihat tiga kategori. Tutorial kali ini kita akan fokus ke C# untuk kodenya, jadi kamu harus memilih itu dari daftar templates, dan karena kita akan membuat aplikasi Windows, kamu harus memilih Windows dari bagan. Ini akan memberimu daftar tipe aplikasi Windows yang didapat, dimana kamu harus memilih WPF Application. Aku menamai projectku "HelloWPF" di kotak text Name. Pastikan sisa settingan di bagian bawah adalah benar dan tekan tombol Ok.

Project barumu akan ada beberapa file, tetapi sekarang kita hanya akan fokus ke salah satunya: MainWindox.xaml. Ini adalah jendela utama aplikasi, salah satu yang muncul pertama ketika apliaksi dibuka, kecuali kamu mengubahnya secara spesifik. Kode XAML yang dapat kita temukan (XAML dibahas dengan detil di chapter lain dari tutorial ini) akan terlihat seperti ini:

<Window x:Class="WpfApplication1.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525">
    <Grid>

    </Grid>
</Window>

Ini adalah dasar dari XAML yang Visual Studio buat untuk jendela program kita, semua bagian dari itu dijelaskan di chapter XAML dan "The Window". Kamu dapat pula menjalankan aplikasinya sekarang (pilih Debug -> Start Debugging atau tekan F5) untuk melihat jendela kosong dari aplikasi yang ada, tapi sekarang adalah saatnya untuk menampilkan pesan ke layar.

Kita akan melakukan itu dengan menambahkan kontrol TextBlock ke panel Grid, dengan yang pesan telah disebutkan diatas sebagai kontennya:

<Window x:Class="WpfApplication1.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525">
    <Grid>
        <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="72">
            Hello, WPF!
        </TextBlock>
    </Grid>
</Window>

Coba jalankan aplikasinya sekarang (pilih Debug -> Start debugging atau tekan F5) dan lihat hasil yang indah dari kerja kerasmu - aplikasi WPF mu yang pertama:

Kamu akan melihat kita menggunakan 3 atibut yang berbeda di TextBlock untuk mendapatkan baris kustom (ditengah window), termasuk properti FontSize untuk menghasilkan text yang lebih besar. Seluruh konsep ini akan dijelaskan di artikel selanjutnya.

Selamat karena telah melakukannya hingga sejauh ini. Sekarang baca lanjutan dari tutorial ini dan kamu akan menguasai WPF!