- Qt Creator Manual
- Creating UIs
- Qt Creator Manual 4.15.2

Text Editor ◦ Creating Components

# Creating UIs

In Qt Creator, you build UIs around the behavior of components and how they connect with one another. You can use preset components available in the Library view or combine them to create your own components. You can specify values for the properties of a component to change its appearance and behavior. All components have a set of predefined properties, some of which control things that are visible to users, while others are used behind the scene.

When you drag-and-drop the preset components from the Library view to the Form Editor or Navigator view and change them to your liking by modifying their properties in the Properties view, the application code is generated for you accordingly. For more information about the code, open the developer documentation by pressing F1.

- Creating Components

  You can enhance imported designs by customizing preset components or design custom forms and shapes directly as components. You can import visual assets in various formats, such as PNG, JPG, and SVG for use in the components.

- Specifying Component Properties

  You can specify values for the properties of a component to change its appearance and behavior. All components have a set of predefined properties. Some properties, such as position, size, and visibility, are common to all components, whereas others are specific to the component. You can specify properties for your components in the Properties view.

- Positioning Components

  The position of a component in a UI can be either absolute or relative to other components. While manual positioning is efficient for a static UI, consider the other available methods, such as anchors, layouts, positioners, and property bindings, for dynamic UIs.

- Using Custom Fonts

  You can load custom fonts to Qt Creator and use them in your designs.

- Annotating Designs

  You can annotate your designs to provide reviewers or developers with additional information about them.

- Loading Placeholder Data

  You can create QML files that contain placeholder data, so that you can test grid, list, or path views, even though you don't have access to real data.

- UI Files

  Some of the wizards create projects that contain UI files (.ui.qml). You should always edit UI files in Form Editor and Properties, to avoid breaking the code.

Text Editor ◦ Creating Components