Exposing QML Components to each other in Qt Creato

Question

I'm developing a dashboard application using Qt-Quick with PySide2 and am having trouble exposing my QML components in Qt Creator's design mode.

My folder structure looks something like this:

myapp/
├── mycomponents
│   ├── component1.qml
│   └── component2.qml
│   └── etc..
├── pages
│   ├── page1.qml
│   └── page2.qml
└── app.qml

I can use all components from myapp/mycomponents by importing the appropriate .qml files or it's parent directory using relative paths:

// inside page1.qml

import "../mycomponents"

Item {
    id:page1

    MyComponent1 {
        // some code
    }

}

The problem is that I'm unable to see the components from myapp/components in the My QML Components tab when I open up a page.qml (or any other .qml file in a sibling directory) file in Qt Creator --> Design.

All components available to app.qml

But not in page1.qml

How can I expose myapp/components to .qml files located in sibling directories without changing the folder structure of my project?

Edit 1: I've already read docs regarding designer.metainfo but they all seem to refer to plugin applications which mine isn't. So I have a hard time making these work for my use case.

Answer 1

The designer only shows components from the current directories or from used imports(which can be a c++ plugin, but also qmldir with some qml components instead). So you have to create an import and add that somehow to the loaded project - not sure what pyside uses, but maybe it is a good idea to create a myapp.qmlproject file for all the qml stuff and inside that you need:

importPaths: [ "." ]

then inside the mycomponents directory, you need a qmldir file

Component1 1.0 Component1.qml

also, you need the designer directory with the file mycomponents.metainfo

MetaInfo {
    Type {
        name: "Component1"

        ItemLibraryEntry {
            name: "a Test Component1"
            category: "mycomponents"
            version: "1.0"
            requiredImport: "mycomponents"
        }
    }
}

Unfortunately, you have to close and reopen the project to see the result.

I prepared a small example here