WinUI 3 C++ Controls Guide – InfoBar Message Bar
An info bar is a colored text box control. It displays different color styles to indicate success, warning, error and other types of messages. The info bar can be closed …
WinUI 3 C++ Controls Guide – Floating Popup Windows (Popup Notification)
First we demonstrate Popup In XAML, add a button to open this Popup on click. We also declare a Popup hidden by default, which will only appear after clicking the …
WinUI 3 C++ Controls Guide – Navigation & Tabs
Navigation and tab-related controls in WinUI 3 Frame Page navigation frame (hosts Page to implement page jumps)Page Independent page carrierNavigationView Sidebar navigation viewNavigationViewItem Navigation menu itemNavigationViewItemHeader Navigation group titleNavigationViewItemSeparator Navigation …
WinUI 3 C++ Controls Guide – Layout Containers
Grid Grid layout (row & column division)StackPanel Stack panel (horizontal / vertical arrangement)UniformGrid Equal-size uniform gridRelativePanel Relative positioning panel (anchor controls to each other)Canvas Absolute coordinate drawing canvasDockPanel Dock panel …
WinUI 3 C++ Controls Guide — Date & Color Selection Controls
Date selection and color selection controls ColorPicker Full color pickerColorSpectrum Color gamut panelColorSlider Single channel slider (RGB/Alpha) ColorPicker Full color pickerColorSpectrum Color gamut panelColorSlider Single channel slider (RGB/Alpha) First create …
WinUI 3 C++ Controls Guide – Sliders & Progress Bar Controls
Progress bars are widely used in projects. WinUI C++ provides several progress bar controls for us to use. Control Name Description Slider Single-value slider RangeSlider Dual thumb range slider (select …
WinUI 3 C++ Controls Guide – List & Collection Views
Next we will introduce several view controls used to display multiple items. They are commonly used to render batches of data, presenting a vertical list, grid or table layout. Control …
WinUI 3 C++ Controls Guide – Dynamically Add Items to ListBox
Now we will implement a frequently used function: dynamically add items to a ListBox. Click the button to insert a new item into the ListBox’s Items collection. This feature is …
WinUI 3 C++ Controls – Selection & Toggle Controls
In this lesson, we will learn selection and toggle controls for WinUI 3 C++. Control Name Description CheckBox Multi-select checkbox RadioButton Single-choice radio button (mutually exclusive within the same GroupName) …
WinUI 3 C++ Controls – Button Controls
We have already used button controls in previous lessons, and the most basic one is Button. Next, we will learn other types of button controls. Buttons are interactive UI elements …
WinUI 3 C++ Controls – Basic Text Controls
In this lesson, we will start learning controls for WinUI 3 C++. WinUI C++ comes with an extensive library of built-in controls, and we will begin with fundamental text input …
>Create a 3×3 grid layout to learn the Grid control
Developers with prior WPF experience will be familiar with the Grid control; its behavior in WinUI is largely identical to WPF. In this lesson, we will create a 3×3 numeric …
Click items on the left navigation bar to load different pages
In the previous lesson, we finished implementing the left sidebar with a Frame control inside. When the main window launches, this Frame loads a default blank page automatically. However, clicking …
Left sidebar menu and main window page loading setup complete
The interface after running the app is shown below
Implement Button Click & Property Binding
In the previous lesson, we added a button in XAML and generated an event. Our first implementation was changing the button’s text upon clicking the button. First go back to …
Analyze Window Class & Implement Button Click Functionality
After readers upgrade VS 2022 to version 17.9.1 or newer, newly created WinUI 3 C++ projects come with a default sample containing a button. Clicking the button triggers backend logic …
Your First WinUI C++ Program Walkthrough
In the last lesson, we finished setting up WinUI C++ and created our first working app. Today, we’ll break down every part of this starter WinUI C++ project step by step.
Install WinUI C++ and Create Your First Project
This tutorial uses Visual Studio 2022 for development. You can also use the latest Visual Studio 2026 if you have access to it. We’re using the Community edition, which can be downloaded from the link below: