Creating Projects

Creating a project enables you to:

  • Group files together
  • Include UI files (.ui.qml), component files (.qml), and assets files
  • Specify settings for previewing UIs

Setting up a new project in Qt Design Studio is aided by a wizard that guides you step-by-step through the project creation process. The wizards prompt you to enter the settings needed for that particular type of project and create the necessary files for you.

Qt Design Studio projects are useful for creating UIs. You cannot use them for application development, because they do not contain:

  • C++ code
  • Resource files (.qrc)
  • Code needed for deploying applications to devices.

Because the projects do not contain any C++ code, you do not need to build them. To test how well your designs work, you can preview the UIs on the desktop or embedded Linux devices. For more information, see Previewing.

"A list of project wizards"

You can export designs from other design tools and import them to projects or create them from scratch using the following wizards:

  • Qt for MCUs Application creates an application that uses a subset of preset components (as supported by Qt for MCUs) that you can deploy, run, and debug on MCU boards.
  • Qt Quick Application - Empty creates a project that uses default components and preset UI controls and can be run on all target platforms.
  • Qt Quick 3D Application creates a project that uses default components, UI controls, and 3D components.
  • Qt Quick Application - Scroll and Qt Quick Application - Stack create an application that uses UI controls to implement a scrollable list or a set of pages with a stack-based navigation model.
  • Qt Quick Application - Launcher creates a project that uses default components and UI controls and defines a launcher application.

For an example of creating a Qt Quick 3D Application project, watch the following video:

Using Project Wizards

  1. Select File > New File or Project.
  2. Select the type of your project, and then select Choose.
  3. In the Name field, enter a name for the project. When naming your own projects, keep in mind that they cannot be easily renamed later.
  4. In the Create in field, enter the path for the project files, and then select Next (or Continue on macOS). You can move project folders later without problems.
  5. In the Screen resolution field, select the screen resolution for previewing the UI on the desktop or on a device. You can easily change the screen size later in Properties.
  6. In the Qt Quick Controls Style field, select one of the predefined UI styles to use, and then select Finish (or Done on macOS).

Qt Design Studio creates the following files and folders:

  • .qmlproject project file defines that all component, JavaScript, and image files in the project folder belong to the project. Therefore, you do not need to individually list all the files in the project.
  • .qml file defines the functionality and appearance of a component.
  • .ui.qml file defines a visual component that you can edit in Form Editor.
  • qtquickcontrols2.conf file specifies the preferred style and some style-specific arguments.
  • fonts folder contains font files that you have added in Library > Assets.
  • imports folder contains a Constants.qml file that specifies a font loader for the Arial font and the screen resolution. The size of the default Screen.ui.qml Rectangle should be set as width: Constants.width & height: Constants.height so that it inherits the global resolution saved here.
  • qmldir module definition file declares the Constant component. For more information, see Module Definition qmldir Files.

To use JavaScript and image files in the UI, select Library > Assets > .

Adding Files to Projects

You can use wizards also to add individual files to your projects. You can create the following types of files:

  • Qt Quick Files
    • Flow Item and Flow View generate components that you can use to design the application flow.
    • Qt Quick File generates a component with one of the following default components or positioners as the root component: Item, Rectangle, Image, Border Image, Flickable, Row, Column, Flow, or Grid.
    • Qt Quick UI File generates a component file with one of the above components as the root component.
    • Qt Quick Views generates a Grid View or a List View. For more information, see List and Grid Views.
  • Qt Quick Controls create stylable versions of the components in the Qt Quick Controls module:

    For more information, see Creating Custom Controls.

  • ListModel adds a list model to the project.
  • JavaScript File generates files that you can use to write the application logic. This is useful for testing the application before the developers implement the application logic in C++, for example. For more information, see Simulating Application Logic.

Available under certain Qt licenses.
Find out more.