Not able to import custom QML components

[Ash V]

I am using Qt 6.5 and I am not able to use my custom QML components.

I have tried to make a change in my CMake file but it doesn't work.
I have also tried qt_add_qml_module but it too gives error.

ERROR:

[Axel Spoerl]

@Ash-V
The CMake file looks fine at first glance.
The error looks like a runtime error in Qt Creator’s debug mode after a successful build.
The QML engine doesn’t find the file containing the custom type. That has to be fixed either in main.qml or in main.cpp.
Please post those….

[Ash V]

@Axel-Spoerl
I am posting here both of the files that you've mentioned. Please provide me with the needed help to resolve this error. And yeah, this error really "does come after a successful build" in the Qt Creator IDE.

main.qml

main.cpp

[Axel Spoerl]

@Ash-V
Thanks for sharing.

There are two ways of adding QML files to your project.
As you said, there is qt_add_qml_module, which is the modern API we recommend to use.
You can refer to the quick gallery example and adapt the CMakeLists.txt to your needs.

This project expects QML sources to be resource files. For the QML part to be dealt with by the IDE's code model, QML files have to be known to the IDE and be part of the build. Including AudioInfoBox.qmlin the qt_add_executabledirective takes care of the former, but not of the latter. This is why the file is not installed in the build tree. main.cpp expects it at ":/", but the only file in that resource tree is quickcontrols2.conf.

=> The quick solution is to add AudioInfoBox.qml right below quickcontrols2.conf in the qt_add_resourcesdeclaration.

=> The nicer solution is to refactor the CMakeLists.txtand use qt_add_qml_module. If you use the example as a template, there shouldn't be any errors.

[Ash V]

@Axel-Spoerl
Thank you very much for answering Axel.
But the quick fix of adding AudioInfoBox.qml in the qt_add_resources isn't working.

And, for the second solution you suggested, to refractor the CMakeLists.txt to use the qt_add_qml_module (via taking reference of the quick gallery example).
In that, I'm actually not able to figure out what to provide as the URI in that module.

The version of CMakeLists.txt I'm running is 3.21.1, and the version used in the quick gallery example is 3.16. And seriously speaking, there've been a lot of changes in the file structure.

I request you to tell me what I should write as the URI.
I'm attaching the screenshot here.

The left one is my project.
On the right side, it's the suggested project.

[Axel Spoerl]

@Ash-V
The URI is the name of the app. Could be "qtTut9" in your case. You are basically free to choose.

But rather than fixing and refactoring at the same time: Let's roll back to your initial approach, which is to add AudioInfoBox.qmlas a resource.

Add the following to main.cpp

=> in include part
#include <QDirIterator>

=> After QGuiApplication app(arc, argv);

QDirIterator it(":", QDirIterator::Subdirectories);
while (it.hasNext())
    qDebug() << it.next();

This will print all resource files available. Post the output here. Then we'll see how to make AudioInfoBox.qmlknown to the QML engine.

[Ash V]

@Axel-Spoerl
Axel, the output prints a lot of files, and AudioInfoBox.qml is also really one of those.

How should we now make AudioInfoBox.qml known to the QML engine?

[Axel Spoerl]

@Ash-V
The project seems messed up:

• There is a subdirectory called "components" in Creator's project tree. I don't see it in CMakeLists.txt.
  Probably you have posted just a part of it.
  That's sad, because hiding stuff confuses those, you expect help from.

• The "components" subdirectory is imported in main.qml.

• AudioInfoBox.qml is in the root resource directory (because I told you so, in the assumption you wanted to call it from main.cpp). It should be in the "components" directory, wherever that is. In that case it would be part of the import, hence known to the QML engine.

• main.cppadds ":/qml" as an import path. That path is nowhere in CMakeLists.txt and nowhere in the project tree. Why is it added?

Maybe it's time to clean the project up and do it like documented here.

[Ash V]

@Axel-Spoerl
Thanks for your support Axel.

Finally, the issue was solved. I saw the path of main.qml and added the AudioInfoBox.qml file the same way, with the same path prefix. I added the AudioInfoBox.qml file like this.

Now it's working fine! 👏️