Elminster_cs
Elminster_cs

Reputation: 87

QtCreator Designer how can I see custom object in QML Types?

I'm pretty new to QtCreator, my issue is that I'm not able to see QML Custom Components.

For example if you import QtQuick.Controls 1.5 you see under QML types: - Qt Quick - Controls.

So far I have created my personal set of components, here is the folder structure:

qrc folder setup the components qmldir is done in that way:

# qmldir
module components
Header 1.0 Header.qml
Footer 1.0 Footer.qml
CentralPage 1.0 CentralPage.qml
GenericButton 1.0 GenericButton.qml
ProgressBarCustom 1.0 ProgressBarCustom.qml

than for example in the LandingPageFrom.ui.qml

import QtQuick 2.6
import QtQuick.Controls 1.5
import QtQuick.Layouts 1.3

import components 1.0 as Components

Components.CentralPage {
    pageName: "landingPage"

    id: landingPage

    width: 800
    height: 1056
    property alias aButton: aButton

    Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
}

And is compiling and showing fine but inside the Designer nothing is showing as aspected, I only see .qml that are in the same directory but not the ones in components directory:

As you can see I can't see GenericButton or Footer, etc

this is what I have done in the .pro and in the main.cpp

QML_IMPORT_PATH += $$PWD/resources/common/ui
QML_DESIGNER_IMPORT_PATH += resources/common/ui

main.cpp

QQmlApplicationEngine engine;
engine.addImportPath("qrc:///ui");
engine.load(QUrl("qrc:///ui/main.qml"));

What is strange is that only the designer is not able to see the components, but the QML code is able, what I'm missing here?

Upvotes: 2

Views: 2067

Answers (1)

denjamin
denjamin

Reputation: 51

Not sure if you already solved your issue, but try steps 4 and 5 here: http://doc.qt.io/qtcreator/creator-qml-modules-with-plugins.html

That made it work for me, although I had some issues with the metainfo file. You can just use this guys metainfo file as an example(or look at the one the Qt docs referenced in the instructions above): https://forum.qt.io/topic/56207/how-to-load-custom-qml-controls-into-the-qml-designer/2

Just make sure you put the designer folder where your module qmldir is located and the metainfo file goes in there. Probably named components.metainfo judging by the module name, not sure if that matters.

Upvotes: 2

Related Questions