Tutorial: Memodernisasi aplikasi WPF

  • Artikel

Ada banyak cara untuk memodernisasi aplikasi desktop yang ada dengan mengintegrasikan fitur Windows terbaru ke dalam kode sumber yang ada alih-alih menulis ulang aplikasi dari awal. Dalam tutorial ini kita akan menjelajahi beberapa cara untuk memodernisasi aplikasi lini bisnis WPF yang ada dengan menggunakan fitur-fitur ini:

  • .NET Core 3
  • Kontrol UWP XAML dengan Kepulauan XAML
  • Kartu Adaptif dan pemberitahuan Windows
  • Penyebaran MSIX

Tutorial ini memerlukan keterampilan pengembangan berikut:

  • Pengalaman dalam mengembangkan aplikasi desktop Windows dengan WPF.
  • Pengetahuan dasar tentang C# dan XAML.
  • Pengetahuan dasar tentang UWP.

Gambaran Umum

Tutorial ini menyediakan kode untuk aplikasi lini bisnis WPF sederhana bernama Contoso Expenses. Dalam skenario fiktif tutorial, Contoso Expenses adalah aplikasi internal yang digunakan oleh manajer Contoso Corporation untuk melacak pengeluaran yang dikirimkan oleh laporan mereka. Manajer sekarang dilengkapi dengan perangkat yang mendukung sentuhan, dan mereka ingin menggunakan aplikasi Pengeluaran Contoso tanpa mouse atau keyboard. Sayangnya, versi aplikasi saat ini tidak menyentuh ramah.

Contoso ingin memodernisasi aplikasi ini dengan fitur Windows baru untuk memungkinkan karyawan membuat laporan pengeluaran secara lebih efisien. Banyak fitur dapat dengan mudah diimplementasikan dengan membangun aplikasi UWP baru. Namun, aplikasi yang ada rumit dan merupakan hasil dari pengembangan bertahun-tahun oleh tim yang berbeda. Dengan demikian, menulis ulang dari awal dengan teknologi baru bukanlah pilihan. Tim sedang mencari pendekatan terbaik untuk menambahkan fitur baru ke basis kode yang ada.

Pada awal tutorial, Contoso Expenses menargetkan .NET Framework 4.7.2 dan menggunakan pustaka pihak ke-3 berikut:

  • MVVM Light, implementasi dasar untuk pola MVVM.
  • Unity, kontainer injeksi dependensi.
  • LiteDb, solusi NoSQL yang disematkan untuk menyimpan data.
  • Bogus, alat untuk menghasilkan data palsu.

Dalam tutorial, Anda akan meningkatkan Pengeluaran Contoso dengan fitur Windows baru:

  • Migrasikan aplikasi WPF yang ada ke .NET Core 3.0. Ini akan membuka skenario baru dan penting di masa depan.
  • Gunakan Kepulauan XAML untuk menghosting kontrol terbungkus InkCanvas dan MapControl yang disediakan oleh Windows Community Toolkit.
  • Gunakan Kepulauan XAML untuk menghosting kontrol XAML UWP standar apa pun (dalam hal ini, CalendarView).
  • Integrasikan Kartu Adaptif dan pemberitahuan Windows ke dalam aplikasi.
  • Kemas aplikasi dengan MSIX dan siapkan alur CI/CD di Azure DevOps sehingga Anda dapat secara otomatis mengirimkan versi baru aplikasi kepada penguji dan pengguna segera setelah tersedia.

Prasyarat

Untuk melakukan tutorial ini, komputer pengembangan Anda harus menginstal prasyarat ini:

Pastikan Anda menginstal beban kerja berikut dan fitur opsional dengan Visual Studio 2019:

  • Pengembangan .NET Desktop
  • Pengembangan Platform Windows Universal
  • Windows SDK (10.0.18362.0 atau yang lebih baru)

Mendapatkan aplikasi sampel Pengeluaran Contoso

Sebelum Memulai tutorial, unduh kode sumber untuk aplikasi Pengeluaran Contoso dan pastikan Anda dapat membuat kode di Visual Studio.

  1. Unduh kode sumber aplikasi dari tab Rilis repositori lokakarya AppConsult WinAppsModernization. Tautan langsung adalah https://github.com/microsoft/AppConsult-WinAppsModernizationWorkshop/releases.
  2. Buka file zip dan ekstrak semua konten ke akar drive C:\Anda. Ini akan membuat folder bernama C:\WinAppsModernizationWorkshop.
  3. Buka Visual Studio 2019 dan klik dua kali pada file C:\WinAppsModernizationWorkshop\Lab\Exercise1\01-Start\ContosoExpenses\ContosoExpenses.sln untuk membuka solusi.
  4. Verifikasi bahwa Anda dapat membangun, menjalankan, dan men-debug proyek WPF Pengeluaran Contoso dengan menekan tombol Mulai atau CTRL + F5.

Mulai

Setelah Anda memiliki kode sumber untuk aplikasi sampel Pengeluaran Contoso dan Anda dapat mengonfirmasi bahwa Anda dapat membuatnya di Visual Studio, Anda siap untuk memulai tutorial:

Konsep penting

Bagian berikut menyediakan latar belakang untuk beberapa konsep utama yang dibahas dalam tutorial ini. Jika Anda sudah terbiasa dengan konsep ini, Anda dapat melewati bagian ini.

Universal Windows Platform (UWP)

Di Windows 8, Microsoft memperkenalkan set API baru sebagai bagian dari Windows Runtime (WinRT). Tidak seperti .NET Framework, WinRT adalah lapisan ASLI API yang diekspos langsung ke aplikasi. WinRT juga memperkenalkan proyeksi bahasa, yang merupakan lapisan yang ditambahkan di atas runtime untuk memungkinkan pengembang berinteraksi dengannya menggunakan bahasa seperti C# dan JavaScript selain C++. Proyeksi memungkinkan pengembang untuk membangun aplikasi di atas WinRT yang memanfaatkan pengetahuan C# dan XAML yang sama yang mereka peroleh dalam membangun aplikasi dengan .NET Framework.

Di Windows 10, Microsoft memperkenalkan Platform Windows Universal (UWP), yang dibangun di atas WinRT. Fitur terpenting dari UWP adalah ia menawarkan serangkaian API umum di setiap platform perangkat: tidak peduli apakah aplikasi berjalan di desktop, pada Xbox One atau di HoloLens, Anda dapat menggunakan API yang sama.

Ke depannya, sebagian besar fitur Windows baru diekspos melalui API WinRT, termasuk fitur seperti Timeline, Project Rome, dan Windows Hello.

Kemasan MSIX

MSIX adalah model pengemasan modern untuk aplikasi Windows. MSIX mendukung aplikasi UWP serta membangun aplikasi desktop menggunakan teknologi seperti Win32, WPF, Formulir Windows, Java, Electron, dan banyak lagi. Saat mengemas aplikasi desktop dalam paket MSIX, Anda dapat menerbitkan aplikasi ke Microsoft Store. Aplikasi desktop Anda juga mendapatkan identitas paket saat diinstal, yang memungkinkan aplikasi desktop Anda menggunakan serangkaian API WinRT yang lebih luas.

Untuk informasi selengkapnya, lihat artikel berikut ini:

Kepulauan XAML

Mulai dari Windows 10, versi 1903, Anda dapat menghosting kontrol UWP di aplikasi desktop non-UWP menggunakan fitur yang disebut Kepulauan XAML. Fitur ini memungkinkan Anda meningkatkan tampilan, nuansa, dan fungsionalitas aplikasi desktop yang ada dengan fitur UI Windows terbaru yang hanya tersedia melalui kontrol UWP. Ini berarti Anda dapat menggunakan fitur UWP seperti Windows Ink dan kontrol yang mendukung Sistem Fluent Design di aplikasi WPF, Formulir Windows, dan C++ Win32 yang ada.

Untuk informasi selengkapnya, lihat Kontrol UWP di aplikasi desktop (Kepulauan XAML). Tutorial ini memandu Anda melalui proses penggunaan dua jenis kontrol Pulau XAML yang berbeda:

  • InkCanvas dan MapControl di Toolkit Komunitas Windows. Kontrol WPF ini membungkus antarmuka dan fungsionalitas kontrol UWP yang sesuai dan dapat digunakan seperti kontrol WPF lainnya di perancang Visual Studio.

  • Kontrol tampilan Kalender UWP. Ini adalah kontrol UWP standar yang akan Anda host dengan menggunakan kontrol WindowsXamlHost di Windows Community Toolkit.

.NET Core 3

.NET Core adalah kerangka kerja sumber terbuka yang mengimplementasikan versi .NET Framework lengkap lintas platform, ringan, dan mudah diperluas. Dibandingkan dengan .NET Framework penuh, waktu startup .NET Core jauh lebih cepat dan banyak API telah dioptimalkan.

Melalui beberapa rilis pertamanya, fokus .NET Core adalah untuk mendukung aplikasi web atau back-end. Dengan .NET Core, Anda dapat dengan mudah membangun aplikasi web atau API yang dapat diskalakan yang dapat dihosting di Windows, Linux, atau dalam arsitektur layanan mikro seperti kontainer Docker.

.NET Core 3 adalah rilis terbaru .NET Core. Sorotan dari rilis ini adalah dukungan untuk aplikasi desktop Windows, termasuk aplikasi Formulir Windows dan WPF. Anda dapat menjalankan aplikasi desktop Windows baru dan yang sudah ada di .NET Core 3 dan menikmati semua manfaat yang ditawarkan .NET Core. Kontrol UWP yang dihosting di Kepulauan XAML juga dapat digunakan di aplikasi Formulir Windows dan WPF yang menargetkan .NET Core 3.

Catatan

WPF dan Formulir Windows tidak menjadi lintas platform, dan Anda tidak dapat menjalankan WPF atau Formulir Windows di Linux dan MacOS. Komponen UI WPF dan Formulir Windows masih memiliki dependensi pada sistem penyajian Windows.

Untuk informasi selengkapnya, lihat Apa yang baru di .NET Core 3.0.