Qt Quick Controls Reference Documentation

Qt Quick Controls module topics

Shadow values from Angular Material

shadow_angular_material

Basic Style

Related Information

Button Controls

Button Control

CheckBox Control

DelayButton Control

RadioButton Control

RoundButton Control

Switch Control

ToolButton Control

Related Information

Changes to Qt Quick Controls

Migrating from Qt Quick Controls 1

Type registration changes

Custom styles are now proper QML modules

Style names

Runtime and compile time style selection

Default Style

Palette

Controls

Changes to ApplicationWindow

Changes to ComboBox

Changes to Container

Changes to Dialog

Changes to Menu

Changes to ToolTip

Changes to StackView

Changes to Tumbler

Qt Quick Controls - Chat Tutorial

Qt Quick Controls - Chat Tutorial

Qt Quick Controls 2 - Chat Tutorial

Chapter 1: Setting Up

main.cpp

Main.qml

The Project File

Chapter 2: Lists

Sizing and Positioning

Model

Delegate

Chapter 3: Navigation

Navigating with StackView

Chapter 4: Models

QSqlQueryModel

QSqlTableModel

Connecting to the Database and Registering Types With QML

Using the Models in QML

Chapter 5: Styling

Summary

Qt Quick Controls Configuration File

Qt Quick Controls Configuration File

Qt Quick Controls 2 Configuration File

Controls Section

Imagine Section

Material Section

Universal Section

Font Configuration

Palette Configuration

Using the Configuration File in a Project

Using CMake

Using qmake

Related Information

Container Controls

ApplicationWindow Control

Frame Control

GroupBox Control

Page Control

Pane Control

ScrollView Control

StackView Control

SwipeView Control

TabBar Control

ToolBar Control

Customizing Qt Quick Controls

Customizing Qt Quick Controls 2

Customizing a Control

Creating a Custom Style

Definition of a Style

Previewing Custom Styles in Qt Quick Designer

Style-specific C++ Extensions

Using CMake

Using QMake

Considerations for custom styles

Avoid assigning an id to styles' implementations of item delegates

Avoid imperative assignments of custom items

Don't import QtQuick.Controls in QML implementations

Implement types used by other types

Attached properties

Customization Reference

Customizing ApplicationWindow

Customizing BusyIndicator

Customizing Button

Customizing CheckBox

Customizing CheckDelegate

Customizing ComboBox

Customizing DelayButton

Customizing Dial

Customizing Drawer

Customizing Frame

Customizing GroupBox

Customizing ItemDelegate

Customizing Label

Customizing Menu

Customizing MenuBar

Customizing PageIndicator

Customizing Pane

Customizing Popup

Customizing ProgressBar

Customizing RadioButton

Customizing RadioDelegate

Customizing RangeSlider

Customizing RoundButton

Customizing ScrollBar

Customizing ScrollIndicator

Customizing ScrollView

Customizing Slider

Customizing SpinBox

Customizing SplitView

Customizing StackView

Customizing SwipeDelegate

Customizing SwipeView

Customizing Switch

Customizing SwitchDelegate

Customizing TabBar

Customizing TabButton

Customizing TextArea

Customizing TextField

Customizing ToolBar

Customizing ToolButton

Customizing ToolSeparator

Customizing ToolTip

Customizing Tumbler

Customizing TableViewDelegate

Customizing HeaderViewDelegate

Delegate Controls

CheckDelegate Control

ItemDelegate Control

RadioDelegate Control

SwipeDelegate Control

SwitchDelegate Control

TableViewDelegate Control

TreeViewDelegate Control

Related Information

Deploying Qt Quick Controls Applications

Deploying an Application with Several Styles

Static Builds

Supported Environment Variables in Qt Quick Controls

Related Information

Using File Selectors with Qt Quick Controls

Related Information

FluentWinUI3 Style

detailed-desc-FluentWinUI3

Detailed Description

Current state

Customization

Palette

Focus Management in Qt Quick Controls

Focus Management in Qt Quick Controls 2

Focus Scope Controls

Fusion Style

Customization

Related Information

Getting Started with Qt Quick Controls

Getting Started with Qt Quick Controls 2

Setting Up Controls from C++

Using C++ Data From QML

Qt Quick Controls Guidelines

Qt Quick Controls Guidelines

Qt Quick Controls 2 Guidelines

Related Information

Icons in Qt Quick Controls

Icons in Qt Quick Controls 2

Using Icons

Icon Themes

Imagine Style

Attached Properties

Detailed Description

File Names

Element Reference

Asset Examples

9-Patch Images

Stretchable Areas

Padding Areas

Inset Areas

Exporting 9-Patch Images

Affinity Designer

Adobe Illustrator

Adobe Photoshop

Inkscape

Sketch

Fixing 9-Patch Lines

Animated Images

Customization

Path

Configuration File

Environment Variables

Palette

Font

Dependency

Attached Property Documentation

Related Information

Qt Quick Controls

Qt Quick Controls 2

Using the Module

QML API

C++ API

Building with CMake

Building with qmake

Building From Source

Controls

Button Controls

Container Controls

Delegate Controls

Indicator Controls

Input Controls

Menu Controls

Navigation Controls

Popup Controls

Separator Controls

Module Evolution

Articles and Guides

Examples

Reference

Related Modules

License and Attributions

Indicator Controls

BusyIndicator Control

PageIndicator Control

ProgressBar Control

ScrollBar Control

ScrollIndicator Control

Related Information

Input Controls

ComboBox Control

Dial Control

TextArea Control

TextField Control

Slider Control

RangeSlider Control

Tumbler Control

Related Information

iOS Style

detailed-desc-iOS

Detailed Description

Current state

Customization

Palette

macOS Style

detailed-desc-macOS

Current state

Customization

Material Style

material-roundedScale-attached-prop

material-containerStyle-attached-prop

Attached Properties

Attached Methods

Detailed Description

Customization

Configuration File

Environment Variables

Dependency

Pre-defined Material Colors

Pre-defined Shades

Variants

Control-Specific Notes

TextArea

TextField

Attached Property Documentation

Attached Method Documentation

Related Information

Menu Controls

Menu Control

MenuBar Control

Navigation Controls

StackView Control

SwipeView Control

TabBar Control

TabButton Control

Popup Controls

Drawer Control

Menu Control

Popup Control

ToolTip Control

Related Information

Separator Controls

MenuSeparator Control

ToolSeparator Control

Related Information

Styling Qt Quick Controls

Available Styles

Basic Style

Fusion Style

Imagine Style

macOS Style

iOS Style

Material Style

Universal Style

Windows Style

FluentWinUI3 Style

Using Styles in Qt Quick Controls

Default Styles

Compile-Time Style Selection

Run-Time Style Selection

Mixing Style Selection

Using QQuickStyle in C++

Command line argument

Environment variable

Configuration file

Related Information

Universal Style

Attached Properties

Attached Methods

Detailed Description

Customization

Configuration File

Environment Variables

Dependency

Pre-defined Universal Colors

Attached Property Documentation

Attached Method Documentation

Related Information

Versioning scheme

Versions

Revisions

Windows Style

detailed-desc-Windows

Current state

Customization

Qt Quick Templates 2

Module Evolution

Related Information

Qt Quick Controls - Attached Style Properties Example

Qt Quick Controls - Attached Style Properties Example

Running the Example

Qt Quick Controls - Contact List

Qt Quick Controls - Contact List

Qt Quick Controls 2 - Contact List

C++ Backend

Designer Support

Running the Example

Qt Quick Controls - Event Calendar

Qt Quick Controls - Event Calendar

Running the Example

File System Explorer

Running the Example

Modern layout and structure

Custom components

Python version

Source files

Qt Quick Controls - Flat Style

Qt Quick Controls - Flat Style

Qt Quick Controls 2 - Flat Style

QML Module for Theming

QML Module for Custom Controls

Running the Example

Qt Quick Controls - Gallery

Qt Quick Controls - Gallery

Qt Quick Controls 2 - Gallery

Running the Example

Qt Quick Controls - Imagine Style Example: Automotive

Qt Quick Controls - Imagine Style Example: Automotive

Qt Quick Controls 2 - Imagine Style Example: Automotive

Running the Example

Qt Quick Controls - To Do List

Qt Quick Controls - To Do List

Qt Quick Controls 2 - To Do List

Running the Example

Spreadsheets Example

Overview

Cell Manipulation

Data Management

Formula Support

Perform basic arithmetic operations

Calculate sum of a range of cells

Qt Quick Controls - Table of Contents

Qt Quick Controls - Table of Contents

Qt Quick Controls 2 - Table of Contents

Running the Example

Qt Quick Controls - Text Editor

Qt Quick Controls - Text Editor

Qt Quick Controls 2 - Text Editor

Desktop User Interface

Touch User Interface

Running the Example

Qt Quick Controls - Wearable Demo

Qt Quick Controls - Wearable Demo

Qt Quick Controls 2 - Wearable Demo

Structure

Styling

Launcher Page

Applications

Navigation

Weather

World Clock

Others

Running the Example

Qt 5.15: Qt Quick Controls vs Qt Quick Controls 1

Material Style: Text Field Containers

Material Style: Shape

AbstractButton

Action

ActionGroup

ApplicationWindow

Attached ApplicationWindow Properties

Safe Areas

BusyIndicator

Button

ButtonGroup

Calendar

CalendarModel

CheckBox

CheckDelegate

ComboBox

Editable ComboBox

ComboBox's Popup

ComboBox Model Roles

Container

Using Containers

Managing the Current Index

Implementing Containers

ContextMenu

Sharing context menus

Performance

Interaction with other menus

Native menu support

Control

Control Layout

Event Handling

DayOfWeekRow

DelayButton

Dial

Dialog

Dialog Title and Buttons

Modal Dialogs

Modeless Dialogs

DialogButtonBox

Drawer

Frame

GroupBox

Checkable GroupBox

HorizontalHeaderView

HorizontalHeaderViewDelegate

ItemDelegate

Label

Menu

Margins

Dynamically Generating Menu Items

Using Instantiator

Using Dynamic Object Creation

Menu types

Limitations when using native menus

API differences

Rendering differences

Supported platforms

MenuBar

Native menu bars

MenuBarItem

MenuItem

MenuSeparator

MonthGrid

Localizing days

Overlay

Page

PageIndicator

Pane

Content Sizing

Popup

Popup Layout

Popup type

Showing a popup as an item

Showing a popup as a separate window

Showing a native popup

Popup Sizing

Popup Positioning

Using the overlay

Popup Transitions

Back/Escape Event Handling

Property Propagation

Polish Behavior of Closed Popups

ProgressBar

RadioButton

RadioDelegate

RangeSlider

RoundButton

ScrollBar

Attaching ScrollBar to a Flickable

Binding the Active State of Horizontal and Vertical Scroll Bars

Non-attached Scroll Bars

Varying Delegate Sizes

ScrollIndicator

Attaching ScrollIndicator to a Flickable

Binding the Active State of Horizontal and Vertical Scroll Indicators

Non-attached Scroll Indicators

Varying Delegate Sizes

ScrollView

Sizing

Scroll Bars

Touch vs. Mouse Interaction

Varying Delegate Sizes

SearchField

SearchField Model Roles

SelectionRectangle

Slider

SpinBox

Custom Values

SplitHandle

SplitView

Serializing SplitView's State

StackView

Using StackView in an Application

Basic Navigation

Pushing Items

Popping Items

Unwinding Items via Pop

Replacing Items

Deep Linking

Finding Items

Transitions

Item Ownership

Size

SwipeDelegate

SwipeView

Switch

SwitchDelegate

TabBar

Resizing Tabs

Flickable Tabs

TabButton

TableViewDelegate

Interacting with pointers

Editing cells in the table

TextArea

Scrollable TextArea

Tab Focus

TextField

ToolBar

ToolButton

ToolSeparator

ToolTip

Attached Tool Tips

Delay and Timeout

Custom Tool Tips

TreeViewDelegate

Interacting with pointers

Editing nodes in the tree

Tumbler

VerticalHeaderView

VerticalHeaderViewDelegate

WeekNumberColumn

Qt Quick Controls Examples

Qt Quick Controls Examples

Qt Quick Controls 2 Examples

Qt Quick Controls C++ Classes

Qt Quick Controls C++ Classes

Qt Quick Controls 2 C++ Classes

Qt Quick Controls QML Types

Qt Quick Controls QML Types

Qt Quick Controls 2 QML Types

QML Types

Using Qt Quick Controls types in property declarations

Related Information

Qt Quick Templates 2 QML Types

QML Types

Related Information