CMake Generator

Contents converted by CMake Generator

CMake Generator converts the contents of the .qmlproject file to CMake.

Changes tracked by CMake Generator

CMake Generator tracks all files listed in the .qmlproject file. Editing the .qmlproject file triggers a CMake generation. Adding, removing, and renaming files are tracked.

Stubb or mock QML data for Qt Design Studio

Qt Design Studio doesn't understand C++ code, so CMake Generator ignores any components or properties made with C++. If you want a similar representation in Qt Design Studio for the components or properties created with C++, add a QML mock file for Qt Design Studio. Store the mock files in a dedicated folder in your project folder. You can later add a mockImports variable in the .qmlproject file and include the folder path with mock files in the mockImports variable. CMake ignores all folders and files included in the mockImports variable. So they only stay in the Qt Design Studio space and are not converted with CMake Generator.

Example:

mockImports: [ "MockDatas" ]

Here, MockDatas is a folder in your project folder with all QML mock data files. If you include this code in the .qmlproject file, CMake Generator ignores everything inside the MockDatas folder.

Manually changing the contents of the CMakeLists.txt files

You can change the CMakeLists.txt files in the App and the Root folders of your project. The CMakeLists.txt files in other folders of your project are overwritten when CMake generator runs next time. Only the CMakeLists.txt files in the App and the Root folders of your project are not overwritten.

Changes in the project structure since Qt Design Studio 4.5

The Qt Design Studio project structure was changed in Qt Design Studio 4.5. Now, there is only a common import path (./) in the root of the project. This makes the project in line with the QML compiler and tooling. To learn more about the QML compiler, see Qt Quick Compiler.

The differences between the project structures:

Converting a project to the current Qt Design Studio project structure

To convert the structure of a project created with Qt Design Studio 4.5 or earlier to the current project structure:

1. Move the project files from ./import/ProjectName to ./ProjectName. If you have additional modules in ./import/, move them too. You do not need to adjust the URI.
2. Move the project files from ./assets_imports to ./Generated. Adjust the import URIs throughout the project.
3. Rename ./content to ./<ProjectName>Content. Adjust the import URIs throughout the project.
4. Make sure that URIs in qmldir files match the folder structure.

   Note: A qmldir defined in ./Generated/QtQuick3D/DangerArrow/qmldir should be defined as module Generated.QtQuick3D.DangerArrow. This ensures the same URIs between Qt Design Studio and the generated CMakeLists files. Ensure that import in .qml files matches these URIs.

5. Add missing filters to the .qmlproject file.
   • If a folder contains QML and JavaScript files, define QMLFiles and JavaScriptFiles in the .qmlproject file.
   • For the files that don't have dedicated keywords, such as ImageFiles or FontFiles, add them to the .qmlproject as a filter. To add WAV or MP3 files, define filters in the .qmlproject file like this:

     Files {
          filter: "*.wav;*.mp3"
      }

     To learn more about the defined file formats, see https://doc.qt.io/archives/QtForMCUs-2.5/qtul-qmlproject-reference.html#imagefiles.

6. Remove all the CMakeLists.txt files. The CMakeLists.txt files are automatically generated when you access CMake generation using File > Export Project > Enable CMake Generator.
7. In the examples/dataImports/DataModels/ folder, update the ExamplesModel.qml and ExamplesModelV2.qml files to reflect qmlFileName correctly after a successful CMake generation.
8. If the project uses shaders, add the following snippet to the .qmlproject file:

   ShaderTool {
       args: "-s --glsl \"100 es,120,150\" --hlsl 50 --msl 12"
       files: [ "UntitledProject3DContent/shaders/*" ]
       }

Importing Qt Quick Designer Components with CMake Generator

Some Qt Quick components, such as Pie, Regular Polygon, and Star, are exclucive to Qt Design Studio. For more information, see Qt Quick Studio Components.

You find these components in the Dependencies folder after the CMake generation.

In previous versions of Qt Design Studio, you had to manually include these components from a git repository after the CMake generation.