Why Qt Quick examples work, while mine ask for the qml files?

ealione

Trying some of the Qts' qml examples, like photo surface, I noticed that they will work out of the box by just pressing Run.
When I tried to do something similar though, with a project including a small qml widget that just shows a red square, what I got was an empty window and a message saying that my square.qml could not be found.

Why is that I have to manually copy my qml file to the build directory while the example app does not require me to do so?
Are the qml files form the examples somehow compiled and included alongside the rest of the c++ code?

sierdzio

Maybe the examples store QML in Qt Resource Files that are being compiled into the binary. Or they use qmake's deployment to copy the data. Or they build with hardcoded paths to QML files.

There are many ways to achieve the goal. I would recommend taking a look at QRC (Qt Resource System), as this is probably the easiest and most flexible way to do it.

ealione

Storing my qml file using the resource system is exactly what I am doing. Yet it still complains that it cannot find the file.

My root directory is '/' and I try to find my qml file using

@view->setSource(QUrl("qrc:///button1.qml"));@

I doubt I am doing something wrong with the path as it is taken from the example.

sierdzio

In your original post, you have mentioned square.qml, now you are showing a snippet with button1.qml. I hope you are aware of that.

There are a few possibilities, where your code or setup might be wrong, so please post:

your .pro file (esp. the RESOURCES section)
your .rcc file (I want to see how button1.qml is added to the resource file)
please tell us what "view" is: QQuickView, QWindow, maybe the app launcher?
please post the code of button1.qml. In particular, I need to know whether this is a plain component, or a Window
please post all errors and warnings that the application is printing when you run it

Things that - from our current discussion - can be wrong:

maybe you are trying to include a component, which source file starts with lower case, instead of upper case letter like QML engine expects
you may be mixing QML Window and QQuickview in a wrong way (QQuickView expects plain QML components, not the Window)
maybe the path in QRC file is wrong and the button1.qml file is not really there
possibly you need to use different qrc scheme

ealione

That rectangle became the button :p

I do many random tests and I changed its name during the two posts.

Here is what you asked for, straight from the last iteration. Some names may not be the same but its the exact same code.

.pro file

@QT += core gui quick declarative qml
greaterThan(QT_MAJOR_VERSION, 4): QT += widgets

TARGET = QMLComponentInCpp
TEMPLATE = app

SOURCES += main.cpp
mainwindow.cpp

HEADERS += mainwindow.h

FORMS += mainwindow.ui

OTHER_FILES +=
button1.qml

RESOURCES +=
QMLComponentInCpp.qrc@

.cpp file

@QQuickView *view = new QQuickView();
QWidget *container = QWidget::createWindowContainer(view, this);
container->setMinimumSize(200, 200);
container->setMaximumSize(500, 500);
container->setFocusPolicy(Qt::TabFocus);
view->setSource(QUrl(":/QmlComponentInCpp/button1.qml")); // I've tried lots of things here
container->show();@

qrc named 'QMLComponentInCpp.qrc'

@<RCC>
<qresource prefix="/">
<file>button1.qml</file>
</qresource>
</RCC>@

qml file named 'button1.qml'

@import QtQuick 2.2
import QtQuick.Controls 1.1
import QtQuick.Window 2.0

Rectangle {
id: screen
width: 400
height: 400
color: "green"

Rectangle {
    id: redRect
    width: 200; height: 100
    color: "black"
    anchors.horizontalCenter: screen.horizontalCenter
    anchors.verticalCenter: screen.verticalCenter

    MouseArea { id: mouseArea; anchors.fill: parent; hoverEnabled: true }

    states: State {
        name: "pressed"; when: mouseArea.pressed
        PropertyChanges { target: redRect; scale: 1.2 }
    }

    transitions: Transition {
        NumberAnimation { properties: "scale"; duration: 600; easing.type: Easing.OutElastic }
    }
}

}@

This should be all

sierdzio

If your application is not widget-based, you can remove the container widget completely: QQuickView can be instantiated and shown alone

your QRC path is wrong: the resource name should not be there

both QtQuick.Window and QtQuick.Controls imports are not needed

you don't needed declarative included in your .pro file

But in general, this code looks correct. I do not know why it is not working.

ealione

Seems that I spotted the culprit.

qrc:/// is not correct, instead if I just enter qrc:/ it seems ok.

sierdzio

Ah, ok. I thought you've already tried. It's very weird, but QRC schemes are a bit magical. Every time I use them, get it wrong the first try ;-)

ealione

Me too, its that I was getting it wrong for the 20nth time that made me ask :p

ealione

Shouldn't setting

@view->setResizeMode(QQuickView::SizeRootObjectToView);@

make the qml respond when I resize My window?

What it actually does is have the correct size when the window opens but won't respond if I resize my main window.

sierdzio

Try setting a filling anchor in your main QML file:
@
anchors.fill: parent
@

Instead of giving it a width and a height. Although in principle it should work as you expect it to. Maybe the window container stuff is messing things up: I've never used it myself, but the documentation does warn about some limitations.

ealione

It must be my widget container then. I will see if I can make it appear without the container.

ealione

If anyone else somehow arrives here I can confirm that if you do as sergio suggested and don't use the container things will go as expected.