Uploaded image for project: 'Qt Design Studio'
  1. Qt Design Studio
  2. QDS-10695

Qt Design Studio tutorials are broken

    XMLWordPrintable

Details

    • QDS Berlin - 2023 Week 45/46, QDS Berlin - 2023 Week 47/48, QDS Berlin - 2023 Week 49/50

    Description

      Using Qt Creator to load and build "Loginui1" project (https://git.qt.io/public-demos/qtdesign-studio/-/blob/master/tutorial%20projects/Loginui1/CMakeLists.txt ) reveals multiple issues:

       

      1. The application cannot run

      We get this runtime error:

      QQmlApplicationEngine failed to load component
      qrc:Main/main.qml:7:1: Type App unavailable
      qrc:/content/App.qml:41:5: Type Screen01 unavailable
      qrc:/content/Screen01.ui.qml:36:5: EntryField is not a type
      

      This is because <root>/content/CMakeLists.txt are missing multiple project files.

       

      Solution
      The correct version should have:

      qt6_add_qml_module(content
          URI "content"
          VERSION 1.0
          QML_FILES
              App.qml
              EntryField.ui.qml
              PushButton.ui.qml
              Screen01.ui.qml
          RESOURCES
              fonts/TitilliumWeb-ExtraLight.ttf
              images/adventurePage.jpg
              images/qt_logo_green_128x128px.png
      
      )
      

       

      2. Invalid code in EntryField.ui.qml

      After fixing #1, the application can run. However, clicking on the entry fields or the buttons produces runtime errors:

      qrc:/content/EntryField.ui.qml:67:13: QML PropertyChanges: Cannot assign to non-existent property "border.color"
      qrc:/content/PushButton.ui.qml:69:13: QML PropertyChanges: Cannot assign to non-existent property "border.color"
      

       

      Indeed, the Text QML type does not have a property called "border".

       

      3. Project does not cooperate well with QML tooling

      Building the project produces many qmlsc warnings:

      [45/90 26.9/sec] Generating .rcc/qmlcache/content_App_qml.cpp
      Warning: App.qml:32:1: Warnings occurred while importing module "Loginui1": [import]
      import Loginui1
      ^^^^^^
      ---
      Warning: Failed to import Loginui1. Are your import paths set up properly? [import]
      ---
      
      Warning: App.qml:35:12: Unqualified access [unqualified]
          width: Constants.width
                 ^^^^^^^^^
      Warning: App.qml:35:12: Could not compile binding for width: Cannot access value for name Constants [compiler]
          width: Constants.width
                 ^^^^^^^^^
      Warning: App.qml:36:13: Unqualified access [unqualified]
          height: Constants.height
                  ^^^^^^^^^
      Warning: App.qml:36:13: Could not compile binding for height: Cannot access value for name Constants [compiler]
          height: Constants.height
                  ^^^^^^^^^
      [46/90 27.4/sec] Generating .rcc/qmlcache/content_Screen01.ui_qml.cpp
      Warning: Screen01.ui.qml:2:1: Warnings occurred while importing module "QtQuick.Controls": [import]
      import QtQuick.Controls
      ^^^^^^
      ---
      Warning: QtQuick.Controls uses optional imports which are not supported. Some types might not be found. [import]
      ---
      
      Warning: Screen01.ui.qml:3:1: Warnings occurred while importing module "Loginui1": [import]
      import Loginui1
      ^^^^^^
      ---
      Warning: Failed to import Loginui1. Are your import paths set up properly? [import]
      ---
      
      Warning: Screen01.ui.qml:36:5: EntryField was not found. Did you add all import paths? [import]
          EntryField {
          ^^^^^^^^^^
      ...
      

       

      Solution
      Many of these can be quickly fixed by adding the following line to the top-level CMakeLists.txt file:

      set(QT_QML_OUTPUT_DIRECTORY ${CMAKE_BINARY_DIR}/qml)
      set(QML_IMPORT_PATH ${QT_QML_OUTPUT_DIRECTORY}
          CACHE STRING "Import paths for Qt Creator's code model"
          FORCE
      )
      

       

      See also https://www.qt.io/blog/compiling-qml-to-c-qtquick-controls-and-optional-imports regarding the warning about "import QtQuick.Controls".

       

      However, several other warnings remain and should be fixed.

      Attachments

        Issue Links

          No reviews matched the request. Check your Options in the drop-down menu of this sections header.

          Activity

            People

              thohartm Thomas Hartmann
              skoh-qt Sze Howe Koh
              Votes:
              0 Vote for this issue
              Watchers:
              1 Start watching this issue

              Dates

                Created:
                Updated:
                Resolved:

                Gerrit Reviews

                  There are no open Gerrit changes