Concepts and Terms
This topic describes main Qt Design Studio concepts and terms:
An asset is an image, font file, 3D model, or other supported file that you add to your project.
Assets are packaged with components for delivery to users.
Read more about assets:
At its simplest, a binding may be a reference to another property. For example, the height of a component can be bound to the height of its parent, so that when the parent height changes, the component height is adjusted automatically. Similarly, the opacity of a component can be bound to the opacity of its parent component.
Read more about bindings:
A component is a reusable building block for a UI.
Qt Design Studio comes with preset components that you can use in your UI by creating instances of them. These are similar to Symbols in Sketch or Prefab in Unity.
Some of the preset components represent simple shapes, text, or images, while others represent complex UI controls with full functionality, such as spin boxes or sliders. You can also add instances of preset 3D components to your UIs. You can find all the preset components in Components.
A component is specified within one file (with the file extension ui.qml or .qml). For example, a Button component may be defined in Button.ui.qml. Typically, the visual appearance of a component is defined in a UI file. To create component files, you can use wizard templates, or move component instances into separate component files.
Read more about components:
A connection can be created between a component and signal to determine how the UI should react to application events. Another way to create connections between components is to create bindings between the values of their properties.
Read more about connections:
An embedded device.
Read more about devices:
A mode adapts the Qt Design Studio UI to the different UI design tasks at hand. Each mode has its own view that shows only the information required for performing a particular task, and provides only the most relevant features and functions related to it. As a result, the majority of the Qt Design Studio window area is always dedicated to the actual task.
For a designer, the most important modes are Design for the actual work, Welcome for opening examples and tutorials, and Help for reading documentation. The other modes are mostly needed for application development.
The mode selector is hidden by default.
To show the mode selector, go to Views > Mode Selector Style and select Icons and Text or Icons Only.
You use templates to create different types of projects according to your needs. The templates add preset components to the project by default. For example, if you create a 3D project, preset 3D components are added to it. You can add more preset components in Components.
Read more about projects:
A property is an attribute of a component that can be assigned a static value or bound to a dynamic expression. A property's value can be read by other components. Generally, it can also be modified by another component, unless a particular component type has explicitly disallowed this for a specific property.
Read more about properties:
- Preset Components
- Specifying Component Properties
- Adding Bindings Between Properties
- Specifying Custom Properties
A signal represents an application event, such as a user clicking a button or the value of a property of a component changing. The application needs this information to perform actions or to relay it to other applications.
Components have predefined signals that are emitted when users interact with the application. For example, the Mouse Area component has a
clicked signal that is emitted whenever the mouse is clicked within the area. Since the signal name is
clicked, the signal handler for receiving this signal is named
Further, a signal is automatically emitted when the value of a property changes.
Read more about signals:
The state of a particular visual component is the set of information that describes how and where the individual parts of the component are displayed within it, and all the data associated with that state. Most visual components in a UI will have a limited number of states, each with well-defined properties.
For example, an element in a list may be either selected or not, and if selected, it may either be the currently active single selection or it may be part of a selection group. Each of those states may have certain associated visual appearance (neutral highlighted, expanded, and so forth).
Similarly, the appearance of a button can change to indicate a pressed state.
Read more about states:
When a visual component transitions from one state to another, its appearance changes. A transition is an edge between two states. It may trigger other events to occur, as other parts of the application may have behavior that is triggered when a certain state is entered or left.
Read more about transitions:
Available under certain Qt licenses.
Find out more.