Learn WinUI 3: Leverage WinUI and the Windows App SDK to create modern Windows applications with C# and XAML. 2 Ed

Learn WinUI 3....2

Contributors....5

About the author....5

About the reviewer....6

Preface....26

Who this book is for....28

What this book covers....29

To get the most out of this book....31

Download the example code files....32

Conventions used....32

Get in touch....33

Share your thoughts....34

Download a free PDF copy of this book....34

Part 1:Introduction to WinUI and Windows Applications....36

Chapter 1: Introduction to WinUI....37

Technical requirements....38

Before UWP – Windows 8 XAML applications....39

Windows application UI design....43

Windows Runtime (WinRT)....43

User backlash and the path forward to Windows 10....44

Windows 10 and UWP application development....44

Language choice with UWP development....46

Lifting app restrictions....47

UWP backward compatibility....48

What is XAML?....50

Creating an adaptive UI for any device....54

Powerful data binding....56

Styling your UI with XAML....60

Separating presentation from business logic....63

What is WinUI?....64

The first WinUI release....65

The road to WinUI 3....68

What’s new in WinUI 3?....72

Goodbye UWP?....73

New features for WinUI 3 and the Windows App SDK....74

The Windows App SDK and WinUI....74

WinUI 3 compared to other Windows development frameworks....75

WinUI versus UWP....75

WinUI versus WPF....76

WinUI versus Windows Forms (WinForms)....78

Summary....79

Questions....80

Chapter 2: Configuring the Development Environment and Creating the Project....81

Technical requirements....82

Installing Visual Studio and Windows desktop development workloads....82

Introducing the application idea....86

Reviewing the application features....86

WinUI in Desktop projects....88

Creating your first WinUI project....88

Anatomy of a WinUI in Desktop project....92

Reviewing App.xaml....92

Reviewing App.xaml.cs....93

Reviewing MainWindow.xaml....94

Reviewing MainWindow.xaml.cs....95

Reviewing the project references....96

Reviewing the project properties....96

XAML basics....97

Building the model....97

Creating sample data....102

Building the initial UI....104

Completing the data-binding initialization....107

Creating the DataTemplate and binding the UI....109

Understanding WinUI and Windows App SDK....112

Understanding the .NET app model....115

Working with WinUI controls, properties, and events....116

Adding a ListView header....116

Creating the ComboBox filter....118

Adding a new item button....124

Summary....128

Questions....129

Chapter 3: MVVM for Maintainability and Testability....130

Technical requirements....131

Understanding MVVM....131

MVVM – the big picture....132

MVVM libraries for WinUI....134

The MVVM Toolkit....135

The Prism Library....136

MVVMCross....136

Choosing a framework for WinUI applications....137

Understanding data binding in WinUI....138

What are markup extensions?....138

Binding markup extension....139

x:Bind markup extension....141

Updating View data with INotifyPropertyChanged....143

Updating collection data with INotifyCollectionChanged....143

Implementing MVVM in WinUI applications....145

Working with events and commands....149

Implementing ICommand....150

Using commands in the View Model....151

Updating the View....154

Leveraging the MVVM Toolkit....156

Summary....160

Questions....161

Chapter 4: Advanced MVVM Concepts....162

Technical requirements....162

Understanding the basics of DI....163

Using DI with ViewModel classes....166

Leveraging x:Bind with events....169

Page navigation with MVVM and DI....171

Migrating MainWindow to MainPage....171

Adding ItemDetailsPage....173

Adding new interfaces and services....177

Creating a navigation service....177

Creating a data service....180

Increasing maintainability by consuming services....184

Handling parameters in ItemDetailsPage....188

Creating the ItemDetailsViewModel class....188

Summary....193

Questions....193

Chapter 5: Exploring WinUI Controls....194

Technical requirements....195

Understanding what WinUI offers developers....195

Animated visual player (Lottie)....197

Navigation View....198

Parallax view....201

Rating control....204

Exploring the WinUI 3 Gallery app for Windows....205

Learning about the ScrollViewer control....208

Reviewing what’s new in WinUI 3 and the Windows App SDK....212

Backward compatibility....212

Fluent UI and modern look and feel....213

Visual Studio tooling....213

The WebView2 control....213

What’s new in the Windows App SDK....216

Adding some new controls to the project....219

Using the SplitButton control....220

Adding a TeachingTip control to the Save button....223

Summary....225

Questions....226

Chapter 6: Leveraging Data and Services....227

Technical requirements....227

Managing application state with app lifecycle events....228

Exploring Windows application lifecycle events....228

Lifecycle events of WinUI applications....230

Additional lifecycle events with FrameworkElement objects....232

Creating a SQLite data store....233

What is SQLite?....234

Adding SQLite as a data service....234

Leveraging a Micro ORM to simplify data access....239

Adding Dapper to the project....240

Updating the data service’s initialization....245

Retrieving data via services....248

Summary....256

Questions....256

Part 2:Extending WinUI and Modernizing Applications....258

Chapter 7: Fluent Design System for Windows Applications....259

Technical requirements....260

What is the Fluent Design System?....260

Exploring Fluent Design for Windows....262

Controls....262

Patterns....265

Layout....266

Input....267

Style....268

Incorporating Fluent Design in WinUI applications....270

Updating the title bar....271

Changing the style of MainPage....274

Changing the style of ItemDetailsPage....281

Using the Fluent XAML Theme Editor....282

Colors....287

Shapes....289

Acrylic material and the Fluent Design System....293

Use Mica in WinUI applications....295

Incorporate Mica into My Media Collection....298

Design resources and toolkits for Fluent Design....300

Summary....301

Questions....301

Chapter 8: Adding Windows Notifications to WinUI Applications....303

Technical requirements....304

Overview of push notifications in the Windows App SDK....304

Raw push notifications....304

Cloud-based app notifications....305

Local app notifications....306

Using raw push notifications in WinUI applications....307

Adding Windows app notifications with the Windows App SDK....309

Summary....330

Questions....330

Chapter 9: Enhancing Applications with Community Toolkits....332

Technical requirements....333

Introducing the WCT....333

Origins of the WCT....334

Reviewing recent toolkit releases....336

Exploring the WCT Gallery app....337

Installing and launching the app....338

Controls....340

Using controls from the toolkit....347

Creating the WinUI project....347

Referencing WCT packages....349

Adding data to the DataGrid control....352

Adding controls to the MainWindow control....354

Exploring the toolkit’s helpers, services, and extensions....357

Helpers....358

Extensions....360

.NET Community Toolkit features....361

Summary....364

Questions....364

Chapter 10: Accelerating App Development with Template Studio....366

Technical requirements....367

Overview of Template Studio for WinUI....367

Starting a new WinUI project with Template Studio....370

Exploring the code generated by Template Studio....391

Exploring the Core project....392

Exploring the main project....393

Exploring the MSTest project....397

Template Studio extensions for other UI frameworks....398

Template Studio for WPF....399

Template Studio for Uno Platform....400

Summary....404

Questions....405

Part 3:Build and Deploy on Windows and Beyond....406

Chapter 11: Debugging WinUI Applications with Visual Studio....407

Technical requirements....408

Debugging in Visual Studio....408

Debugging local applications....409

Debugging remote applications....414

Common XAML layout mistakes....418

Improving your XAML with static code analysis....420

Pinpointing data binding failures....424

Common mistakes in data binding....424

Using the XAML Binding Failures window....427

Debugging live data with Live Visual Tree and Live Property Explorer....430

Coding with XAML Hot Reload....431

Debugging with Live Visual Tree and Live Property Explorer....433

Summary....439

Questions....439

Chapter 12: Hosting a Blazor Application in WinUI....441

Technical requirements....442

Getting started with ASP.NET Core and Blazor....442

A brief history of ASP.NET and ASP.NET Core....443

What is Blazor?....444

WebAssembly and client-side .NET development....448

Creating a Blazor Wasm application....451

Building a simple application for tracking tasks....456

Exploring Blazor Wasm deployment options....463

Deployment options for Blazor Wasm projects....463

Publishing Blazor to Azure Static Web Apps hosting....466

Pushing the project to GitHub....466

Creating an Azure Static Web Apps resource....472

Publishing an application with GitHub Actions....476

Hosting your Blazor application in the WinUI WebView2....478

Summary....481

Questions....482

Chapter 13: Take Your App Cross-Platform with Uno Platform....483

Technical requirements....484

An overview of Uno Platform....484

Creating your first Uno Platform project....490

Migrating WinUI XAML markup and code to Uno Platform....496

Migrating the WinUI project code....497

Migrating the WinUI XAML views....503

Running on Android with WSA....507

Running in the browser with WebAssembly....518

Summary....520

Questions....520

Chapter 14: Packaging and Deploying WinUI Applications....522

Technical requirements....522

Discovering application packaging and MSIX basics....523

MSIX....524

Reviewing MSIX tools and resources....529

Packaged applications and application identity....530

Getting started with application packaging in Visual Studio....533

Deploying applications with Windows Package Manager....541

Adding a package to the community repository....541

Using WinGet for package management....546

Distributing applications with the Microsoft Store....549

Preparing a free application for the Microsoft Store....550

Uploading a package to the Store....557

Sideloading WinUI applications with MSIX....564

Creating an MSIX package for sideloading....565

Sideloading an MSIX package....567

Summary....571

Questions....572

Index....573

Why subscribe?....609

Other Books You May Enjoy....610

Packt is searching for authors like you....614

Share your thoughts....614

Download a free PDF copy of this book....615

WinUI 3 takes a whole new approach to delivering Windows UI components and controls and has the ability to deliver the same features across multiple versions of Windows. Learn WinUI 3 is a comprehensive introduction to WinUI and Windows apps for anyone who is new to WinUI and XAML applications.

This updated second edition begins by helping you get to grips with the latest features in WinUI and shows you how XAML is used in UI development. The next set of chapters will help you set up a new Visual Studio environment, develop a new desktop project, incorporate the Model-View-ViewModel (MVVM) pattern in a WinUI project, and develop unit tests for ViewModel commands. Next, you’ll cover the basics of data access from WinUI projects with a step-by-step approach. As you advance, you’ll discover how to leverage the Fluent Design System to design beautiful WinUI applications. You’ll also explore the contents and capabilities of the Windows Community Toolkit and learn how to create cross-platform apps with markup and code from your project using Uno Platform. The concluding chapters will teach you how to build, debug, and deploy apps to the Microsoft Store.

By the end of this book, you’ll have learned how to build WinUI applications from scratch and how to modernize existing desktop apps using WinUI 3 and the Windows App SDK.

What you will learn

• Discover the latest features of WinUI 3 and learn how to provide product feedback
• Understand the WinUI project structure and the app lifecycle
• Use the MVVM pattern in WinUI and discover open source MVVM projects
• Find out how to create a simple data store to save app data between sessions
• Get to grips with incorporating the concepts of Fluent Design into a WinUI app
• Discover how to use push notifications and app notifications in WinUI
• Reuse WinUI views and view models in a cross-platform Uno Platform app

Who this book is for

This book is for anyone looking to develop applications for Windows with a modern UI. If you’re familiar with Windows desktop app development and want to enhance your knowledge of the latest Windows development techniques, this book is for you. Whether you're starting a new project or planning to modernize your existing Windows apps, this book will provide you with guidance. Hands-on experience with C# and .NET is expected, but no prior knowledge of WinUI or the Windows App SDK is required.