Edit

Share via


Controls for Windows apps

Controls are the UI elements that make up your Windows app—buttons, text fields, lists, pickers, and more. A control displays content or lets users interact with your app. A pattern combines multiple controls into a reusable recipe for common scenarios like forms or list-detail layouts.

Windows provides over 45 ready-to-use controls, all built on the Fluent Design System. From simple toggles to rich data views like grid and list, these controls help you build interfaces that are visually polished, accessible, and responsive across devices.

Browse the articles in this section for design guidance, code examples, and best practices for each control and pattern.

Getting started

To learn how to add controls to your app and wire up event handlers, see Add controls and handle events. To customize control appearance with reusable XAML styles, see Styling controls.

Controls

The following table lists the Windows app controls available in WinUI, with links to their documentation.

Basic input

Control Description
Buttons Buttons A control that responds to user input and raises a Click event. Includes button, drop-down button, split button, toggle button, and more.
Check boxes Check boxes A control that a user can select or clear.
Combo boxes Combo boxes A drop-down list of items a user can select from.
Hyperlinks Hyperlinks A button that appears as hyperlink text, and can navigate to a URI or handle a Click event.
Radio buttons Radio buttons A control that allows a user to select a single option from a group of options.
Rating control Rating control Rate something 1 to 5 stars.
Sliders Sliders A control that lets the user select from a range of values by moving a Thumb control along a track.
Toggle switches Toggle switches A switch that can be toggled between 2 states.

Collections

Control Description
Items view Items view A control that presents a collection of items using various layouts.
List view and grid view List view and grid view Controls that present a collection of items in a vertical list or in rows and columns.
Flip view Flip view Presents a collection of items that the user can flip through, one item at a time.
Pips pager Pips pager A control to let the user navigate through a paginated collection when the page numbers do not need to be visually known.
Tree view Tree view A hierarchical list pattern with expanding and collapsing nodes that contain nested items.
Items repeater Items repeater A flexible, primitive control for data-driven layouts.
Swipe Swipe Touch gesture for quick menu actions on items.
Pull-to-refresh Pull-to-refresh Provides the ability to pull on a collection of items in a list/grid to refresh the contents of the collection.

Dialogs and flyouts

Control Description
Dialogs Dialogs A dialog box that can be customized to contain any XAML content.
Flyouts Flyouts Shows contextual information and enables user interaction.
Teaching tip Teaching tip A content-rich flyout for guiding users and enabling teaching moments.

Forms

Control Description
Forms A pattern for collecting and submitting user input using a combination of input controls and labels.

Media, graphics, and shapes

Control Description
Icons Icons Represent icon controls that use different image types as content.
Animated icons Animated icons An element that displays and controls an icon that animates when the user interacts with the control.
Images and image brushes Images and image brushes A control to display image content.
Ink Controls for digital inking, including ink canvas and ink toolbar.
Media playback Media playback A control to display video and image content.
Shapes Shapes Draw shapes such as ellipses, rectangles, and polygons.
Control Description
Menus and context menus Menus and context menus Shows a contextual list of simple commands or options.
Command bar Command bar A toolbar for displaying application-specific commands that handles layout and resizing of its contents.
Command bar flyout Command bar flyout A mini-toolbar displaying proactive commands, and an optional menu of commands.
Menu flyout and menu bar Menu flyout and menu bar A classic menu, allowing the display of MenuItems containing MenuFlyoutItems.
Control Description
Breadcrumb bar Breadcrumb bar Shows the trail of navigation taken to the current location.
List/details A pattern that displays a list of items alongside the details of the currently selected item.
Navigation view Navigation view Common vertical layout for top-level areas of your app via a collapsible navigation menu.
Pivot Pivot Presents information from different sources in a tabbed view.
Selector bar Selector bar Presents information from a small set of different sources. The user can pick one of them.
Tab view Tab view A control that displays a collection of tabs that can be used to display several documents.

People

Control Description
Person picture Person picture Displays the picture of a person/contact.

Pickers

Control Description
Color picker Color picker A control that displays a selectable color spectrum.
Calendar date picker Calendar date picker A control that lets users pick a date value using a calendar.
Calendar view Calendar view A control that presents a calendar for a user to choose a date from.
Date picker Date picker A control that lets a user pick a date value.
Time picker Time picker A configurable control that lets a user pick a time value.

Scrolling and layout

Control Description
Expander Expander A container with a header that can be expanded to show a body with more content.
Scrolling and panning controls Scrolling and panning controls A container control that lets the user pan and zoom its content.
Annotated scrollbar Annotated scrollbar A control that extends a regular vertical scrollbar's functionality for an easy navigation through large collections.
Semantic zoom Semantic zoom Lets the user zoom between two different views of a collection, making it easier to navigate through large collections of items.
Split view Split view A container that has 2 content areas, with multiple display options for the pane.
Two-pane view Two-pane view A control with two content areas that span the available space, either side-by-side or top-bottom.

Status and information

Control Description
Progress Progress Shows the app's progress on a task using a progress bar or progress ring.
Tooltip Tooltip Displays information for an element in a pop-up window.
Info bar Info bar An inline message to display app-wide status change information.
Info badge Info badge A non-intrusive UI to display notifications or bring focus to an area.

Text

Control Description
Auto-suggest box Auto-suggest box A control to provide suggestions as a user is typing.
Text block Text block A lightweight control for displaying small amounts of text.
Rich text block Rich text block A control that displays formatted text, hyperlinks, inline images, and other rich content.
Text box Text box A single-line or multi-line plain text field.
Rich edit box Rich edit box A rich text editing control that supports formatted text, hyperlinks, and other rich content.
Password box Password box A control for entering passwords.
Number box Number box A text control used for numeric input and evaluation of algebraic equations.
Labels Guidance for adding accessible labels to input controls.

Title bar

Control Description
Title bar Title bar Customize the title bar of your app window.

The WinUI 3 Gallery app is the best way to explore these controls hands-on. It provides interactive demos of most WinUI controls, features, and Fluent Design patterns—making it an ideal companion to this documentation. Install it to try controls in real time and link directly from individual control pages.

Additional controls and resources

The Windows Community Toolkit is a collection of helpers, extensions, and additional UI controls that complement the built-in WinUI controls. It's community-driven and maintained by Microsoft, covering common scenarios like advanced layouts, converters, and animations.

For early access to experimental controls and features, check out Windows Community Toolkit Labs, where new components are developed and tested before graduating to the main toolkit.