0

Problem

The problem is that I have some C++ code that loads a QML file called gui.qml, it compiles with no problem, but when running it doesn't display the QML app window but also doesn't give any errors.

Code

Here is the C++ code that I use to load the qml (edit: used qrc to load qml):

#include <QGuiApplication>
#include <QQmlApplicationEngine>

int main(int argc, char *argv[]) {
    QGuiApplication app(argc, argv);
    QQmlApplicationEngine engine;

    const QUrl url("qrc:/components/gui.qml");

    QObject::connect(&engine, &QQmlApplicationEngine::objectCreated, &app,
                     [url](QObject *obj, const QUrl &objUrl) {
                         if (!obj && url == objUrl)
                             QCoreApplication::exit(-1);
                     },
                     Qt::QueuedConnection);
    
    engine.load(url);

    return app.exec();
}

Here is the QML code that I want to display:

import QtQuick 6.4
import QtQuick.Controls 6.4
import QtQuick.Controls.Material 6.0
import QtQuick.Layouts 6.0

import "components"

ApplicationWindow {
    visible: true
    width: 856
    height: 482

    title: "ModVault"

    Material.theme: Material.Dark

    QtObject{
        id: funtions

        function switch_screen(screen_index) {
            stack_layout.currentIndex = screen_index
        }

        function toggle_menu() {
            menu_animation.running = true

            if (menu.width === 50) {
                menu_button.icon_source = "qrc:/menu_icons/menu_icons/menu_2.png"
            } else {
                menu_button.icon_source = "qrc:/menu_icons/menu_icons/menu.png"
            }
        }
    }

    Rectangle {
        id: main
        color: "#3d3d3d"

        anchors.fill: parent

        Rectangle {
            id: menu
            width: 50
            opacity: 0.478
            color: "#3d3d3d"
            anchors.left: parent.left
            anchors.top: parent.top
            anchors.bottom: parent.bottom
            anchors.leftMargin: 0
            anchors.bottomMargin: 0
            anchors.topMargin: 0
            clip: true

            PropertyAnimation {
                id: menu_animation
                target: menu

                property: "width"
                to: if (menu.width === 50)
                        return 300
                    else
                        return 50

                duration: 500
                easing.type: Easing.InOutQuint
            }

            MenuButton {
                id: menu_button
                onClicked: funtions.toggle_menu()
            }
        }
    }
}

Here is the qmake file that I use to build the app:

######################################################################
# Automatically generated by qmake (3.1) Wed May 3 17:38:34 2023
######################################################################

TEMPLATE = app
TARGET = ModVault
INCLUDEPATH += .

# You can make your code fail to compile if you use deprecated APIs.
# In order to do so, uncomment the following line.
# Please consult the documentation of the deprecated API in order to know
# how to port your code away from it.
# You can also select to disable deprecated APIs only up to a certain version of Qt.
#DEFINES += QT_DISABLE_DEPRECATED_UP_TO=0x060000 # disables all APIs deprecated in Qt 6.0.0 and earlier

# Input
SOURCES += src/main.cpp
QT += quick
DESTDIR = ./build
RESOURCES += src/resources.qrc

Code for the qrc:

<!DOCTYPE RCC>
<RCC version="1.0">
<qresource prefix="/components">
    <file>gui.qml</file>
    <file>components/MenuButton.qml</file>
</qresource>
<qresource prefix="/menu_icons">
    <file>menu_icons/menu.png</file>
    <file>menu_icons/menu_2.png</file>
    <file>menu_icons/home.png</file>
    <file>menu_icons/download.png</file>
    <file>menu_icons/github.png</file>
    <file>menu_icons/repository.png</file>
    <file>menu_icons/update.png</file>
    <file>menu_icons/close.png</file>
    <file>menu_icons/minimize.png</file>
    <file>menu_icons/settings.png</file>
</qresource>
</RCC>

What I Have Tried

Things that I have tried include:

  1. Use QQuickView instead but it didn't change anything
  2. Added visible: true, but no change
  3. Using qrc to load qml

Some other information: I am using make and qmake to build the app.

What should I do to fix this issue?

PyDev19
  • 33
  • 6
  • There really isn't a lot to see since the main visual component is a Rectangle with a single color. What did you expect to see? I couldn't get MenuButton to work. I didn't know if you mean ToolButton or MenuItem. In either case, you didn't set a text property, so there is really nothing interesting to see. – Stephen Quan May 04 '23 at 02:40
  • Yes there isn't much to see because this is just a base but there is enough to be able to tell that there is a window there. But in my case the window doesn't even appear I run it from the command line and it runs but no window pops up. – PyDev19 May 04 '23 at 03:02
  • Can you clarify how you're deploying `gui.qml`. Since it doesn't appear to be a resource as it is normally the case. It appears that you intentionally bundle with your executable as an external file in the same directory as your application? – Stephen Quan May 04 '23 at 03:12
  • I am deploying the qml by loading it from a qrc now, I edited the code in the question to show I did this, but this also changes nothing – PyDev19 May 04 '23 at 03:36
  • I am not sure what to suggest. Perhaps you can do some more explorative troubleshooting by starting with a new application and progressive cut and paste your code over until it breaks. – Stephen Quan May 04 '23 at 03:57
  • It doesn't display any window (i.e. app GUI doesn't start) or you get an empty white window? Start by commenting out everything from your ApplicationWindow and set its color to red, then get empty red window displayed. Then start adding stuff... note that window "visible" property must be set to true as it is your code, I don't know what your comment about "view: true" refers because I don't see such property in your example and QML items don't have such property – talamaki May 04 '23 at 06:43
  • I notice some weirdness in your .qrc file. The section that contains your qml files has a prefix of "/components", but then MenuButton is still listed with a path of components/MenuButton.qml. Is that intentional? – JarMan May 04 '23 at 17:47
  • @talamaki It doesn't display any window, and regarding the `view:true` that was just a typo, I meant `visible:true` – PyDev19 May 04 '23 at 22:56
  • @JarMan the /components is just a prefix to identify that the qml files should come under components but the path to those files still need to be the real path in your directory. So since MenuButton is located in the folder components the path for the `` still needs to be `components/MenuButton.qml`. – PyDev19 May 04 '23 at 22:58

1 Answers1

0

I finally found the answer, and it was completely my fault. Thank you to everyone who tried to help and sorry for wasting your time.

Answer: When I first ran this app I got this error:

"qt.qpa.plugin: Could not load the Qt platform plugin "xcb" in "" even though it was found."

I googled and the first answer from a github issue was to set this environment variable:

export QT_QPA_PLATFORM=offscreen

Now I realised that this also stops the app from actually displaying. So to fix this I removed the environment variable and got the same error messages as before, so I just installed libxcb-cursor by doing this:

sudo apt install libxcb-cursor

So that was it.

Again thank you to everyone who tried to help. Sorry for wasting your time.

PyDev19
  • 33
  • 6