Membuat aplikasi WinUI

Seri tutorial ini menunjukkan cara membuat aplikasi WinUI 3 menggunakan XAML dan C#. Aplikasi yang akan Anda buat adalah aplikasi catatan, tempat pengguna dapat membuat, menyimpan, dan memuat beberapa catatan. Anda dapat mengunduh atau melihat kode untuk tutorial ini dari repositori GitHub.

Dalam tutorial ini, Anda akan belajar cara:

• Gunakan markup XAML untuk menentukan antarmuka pengguna aplikasi.
• Berinteraksi dengan elemen XAML melalui kode C#.
• Simpan dan muat file dari sistem file lokal.
• Buat tampilan dan ikat ke data.
• Gunakan navigasi untuk berpindah ke dan dari halaman di aplikasi.
• Gunakan sumber daya seperti dokumentasi dan aplikasi sampel untuk membuat aplikasi Anda sendiri.

Anda akan menggunakan Visual Studio 2022 untuk membuat aplikasi yang dapat Anda gunakan untuk memasukkan catatan dan menyimpannya ke penyimpanan aplikasi lokal. Anda dapat menemukan kode sumber untuk aplikasi ini di sini. Aplikasi ini akan memiliki dua halaman:

• NotePage - halaman untuk mengedit satu catatan.
• AllNotesPage - halaman untuk menampilkan semua catatan yang disimpan.

Aplikasi akhir ditunjukkan di bawah ini:

AllNotesPage

Halaman Catatan

Buat proyek Visual Studio

Untuk memulai tutorial ini, Anda harus membuat proyek aplikasi WinUI 3 di Visual Studio menggunakan Blank App, Packaged (WinUI 3 in Desktop) templat proyek C#. Saat membuat proyek, gunakan pengaturan berikut:

• Nama Proyek

  Ini harus diatur ke WinUINotes. Jika proyek diberi nama sesuatu yang berbeda, kode yang Anda salin dan tempel dari tutorial ini dapat mengakibatkan kesalahan build. Ini karena Visual Studio menggunakan nama proyek sebagai namespace default untuk kode aplikasi Anda.

• SDK Aplikasi Windows

  Tutorial ini menggunakan fitur baru di Windows App SDK 1.7. Anda harus memastikan paket Windows App SDK NuGet diperbarui ke versi 1.7 atau yang lebih baru.

Penting

Jika Anda belum membuat proyek WinUI 3 sebelumnya, ikuti langkah-langkah dalam Mulai mengembangkan aplikasi Windows untuk memastikan lingkungan dev dan proyek Visual Studio Anda disiapkan dengan benar.

Saat Menjalankan proyek aplikasi kosong (seperti yang diuraikan di Mulai mengembangkan aplikasi Windows), Anda akan melihat jendela kosong yang terlihat seperti ini:

Tip

Anda akan sering merujuk ke dokumen referensi API dan dokumen konseptual saat membangun aplikasi Windows. Dalam tutorial ini, Anda akan melihat tautan sebaris dalam teks, dan dalam grup berlabel, "Pelajari lebih lanjut di dokumen:". Tautan ini bersifat opsional; Anda tidak perlu mengikutinya untuk menyelesaikan tutorial. Mereka disediakan jika Anda ingin mencatat di mana menemukan informasi yang akan Anda butuhkan saat Anda mulai membuat aplikasi Anda sendiri.

Lanjutkan ke langkah 1 - Penyiapan proyek