QQmlApplicationEngine failed to load component : "Type" is not a type

Question

I'm having trouble loading one qml through another.

Basically, I have created a qml type MyTabView in MyTabView.qml:

import QtQuick 2.3
import QtQuick.Controls 1.2

TabView {
    width: 360
    height: 360

    Component.onCompleted: {
        addTab("Tab 1", tab1)
  
        addTab("Tab 2", tab2)
    }

    Component {
        id: tab1
        Rectangle {color: "red"}
    }

    Component {
        id: tab2
        Rectangle {color: "blue"}
    }
}

and I am trying to use it in another qml file (main.qml), which is in the same directory:

import QtQuick 2.3
import QtQuick.Controls 1.2
import "."

ApplicationWindow {
    visible: true
    width: 640
    height: 480
    title: qsTr("Main")

    MyTabView {}
}

but when I try to run my project, I get this error:

QQmlApplicationEngine failed to load component qrc:/qml/main.qml:11 TabView is not a type

Notes:

• I have M Caps in MyTabView.qml and it's in the same directory as main.qml.

• When I replace all the code of MyTabView.qml instead of MyTabView {} inside main.qml, the program does not give any error and runs correctly.

What am I doing wrong and how to fix it ?

Answer 1

You should rename your "TabView.qml" to something like "MyTabView.qml".

Because of that import

import "."

you have conflict of TabView from "QtQuick.Controls 1.2" and local folder "."

Answer 2

For Qt 6.4 Rob Sanders solution worked for me.

1. Add the executable to your CMakeLists.txt

    set(CMAKE_AUTORCC ON)
    qt_add_executable(app015_custom_elements
        main.cpp
        resources.qrc
        MyButton.qml
    )
   

2. import it like import "qrc:/qml" (change the /qml to wherever your qml file lie)

Then you can use it. In my case

MyButton{}

Answer 3

If you have tried all the solutions mentioned by others but they don't work, you can try this one:

#  (in cmakelists)
qt_add_qml_module(appNewapp
    URI Newapp
    VERSION 1.0
    QML_FILES Main.qml
    YourQML.qml
)

This works for Qt6.4

Answer 4

Have you added the file to your Resources ?
Adding your MyTabView.qml to your project in the same directory of main.qml is not sufficient.
You have to put your QML file in the Resources (probably main.qrc/qml/) in order to have it deployed.
The editor of Qt Creator does not need this inclusion in order to find your type, therefore it displays no error.

Answer 5

Ok I have had this problem recently with QT 6.2 and QML. Using both CMake and QMake as the build systems.

The solution is to add the QML file e.g. MyTabView.qml to the resources file and make sure it is added to the CMakeLists.txt or the project file (should be done automatically for you).

Then in the top of your main.qml or wherever you are using this custom component import qrc:/. Assuming the custom qml file was added under the prefix / and therefore its resource path will be qrc:/MyTabView.qml.

Answer 6

I had a similar problem.

qrc:AGview.qml:8:15: AGraph is not a type

I solved it: my original code (in my main.cpp):

view.setSource(QUrl("qrc:AGview.qml"));

the working one:

view.setSource(QUrl("qrc:/AGview.qml"));

I think without the slash it don't search in the actual folder.

Answer 7

This error can also be caused by a component's having an error. For instance, I had this sequence of errors:

QQmlApplicationEngine failed to load component
qrc:/main.qml:6 Type MainView unavailable
qrc:/MainView.qml:27 Type ApplicationLocked unavailable
qrc:/ApplicationLocked.qml:4 MetaStateChart is not a type

It's not very clear, bu the error in MainView is caused by a problem in ApplicationLocked. When I fixed that error, everything else worked.

So contrary to the conventional wisdom of starting with the first compiler error, it may be necessary to start with the last one!