Qt Creator Manual

Developing Widget Based Applications

Widgets and forms created with Qt Designer are integrated seamlessly with programmed code by using the Qt signals and slots mechanism that allows you to easily assign behavior to graphical elements. All properties set in Qt Designer can be changed dynamically within the code. Furthermore, features such as widget promotion and custom plugins allow you to use your own widgets with Qt Designer. For more information, see Adding Qt Designer Plugins.

Qt Creator automatically opens all .ui files in the integrated Qt Designer, in Design mode.

For more information about Qt Designer, see the Qt Designer Manual.

Generally, the integrated Qt Designer contains the same functions as the standalone Qt Designer. The following sections describe the differences.

Code Editor Integration

To switch between forms (Design mode) and code (Edit mode), press Shift+F4.

You can use Qt Creator to create stub implementations of slot functions. In the Design mode, right-click a widget to open a context menu, and then select Go to Slot.... Select a signal in the list to go to an existing slot function or to create a new slot function.

Managing Image Resources

In standalone Qt Designer, image resources are created using the built-in Resource Editor. In Qt Creator, .ui files are usually part of a project, which may contain several resource files (.qrc). They are created and maintained by using the Qt Creator Resource Editor. The Qt Designer Resource Editor is de-activated and the image resources are displayed in the Qt Designer Resource Browser.

Specifying Settings for Qt Designer

To change the layout of Qt Designer user interface elements:

  1. Select Tools > Form Editor > Views > Locked.

    When this option is unchecked, you can change the layout.

  2. Click the header of an element and drag the element to a new position.

To specify settings for Qt Designer:

  • Select Tools > Options... > Designer.
  • Specify settins for generating classes and code in Class Generation.
  • Specify embedded device profiles, that determine style, font, and screen resolution, for example, in Embedded Design.
  • Specify settings for the grid and previewing forms in Forms.
  • Specify an additional folder for saving templates in Template Paths.

To preview the settings, select Tools > Form Editor > Preview, or press Alt+Shift+R.

Previewing Forms Using Device Skins

A device skin is a set of configuration files that describe a mobile device. It includes a border image that surrounds the form and depicts a mobile device with its buttons.

To preview your form using device skins:

  1. Select Tools > Options... > Designer.
  2. Select the Print/Preview Configuration check box.
  3. In the Device skin field, select a device skin.
  4. When the form is open in Design mode, press Alt+Shift+R.
  5. To end the preview, right-click the skin and select Close in the context menu.

Thank you for giving your feedback.

Make sure it is related to this specific page. For more general bugs and requests, please use the Qt Bug Tracker.

[0]; s.parentNode.insertBefore(ga, s); })();