Learning QML (QtQuick 2.4)

maximus

I'm trying to learn QML, I only used the QWidget approach on my project and would like to develop the new feature with QML as it seems Qt is going this way and recommends using this for new stuff.

I want to do a Browser with QWebEngine using QML instead of the QWidget I used.
I add a file to my project with "Add new, QML File", then it created "QuickBrowser.qml"
My question is this, how to I load the file and show it on screen (like .exec) when there is no .cpp file for the qml file? I'm probably missing something..`

QML Widget

import QtQuick 2.4
import QtQuick.Controls 1.2
import QtWebEngine 1.0
import QtWebChannel 1.0

ApplicationWindow {
width: 1280
height: 720
visible: true
WebEngineView {
    id: webview
    url: "http://www.qt-project.org"
    anchors.fill: parent
}

main.cpp

int main(int argc, char *argv[]) {
 //how to load and execute my qml file like QWidget?
}

TioRoy

You can use use QmlApplicationEngine:

#include <QGuiApplication>
#include <QQmlApplicationEngine>

int main(int argc, char *argv[])
{
    QGuiApplication app(argc, argv);
    QQmlApplicationEngine engine("main.qml");
    return app.exec();
}

You can check more here.

maximus

@TioRoy

Thanks
I've been checking this

Trying to run this in my main :

 QDeclarativeView view;
 view.setSource(QUrl::fromLocalFile("QuickBrowser.qml"));
 view.show();

file:///C:/Users/Calo/Desktop/MT/build-PowerVelo2-Desktop_Qt_5_4_1_MSVC2013_32bit-Release/QuickBrowser.qml: File not found

If I copy the file manually where it wants:

file:///C:/Users/Calo/Desktop/MT/build-PowerVelo2-Desktop_Qt_5_4_1_MSVC2013_32bit-    Release/QuickBrowser.qml:1:1: module "QtQuick" version 2.4 is not installed 
 import QtQuick 2.4

Have to say it's a bit strange to load the file with the fileName, not with a class, my qml file is in a sub project and if I change the file path, the project will be broken? seems really hard to maintain..

I should also mention that my project is using a standard QApplication, the mainWindow is a QWidget and not the QML type, I'm not going to change all my project so I can use the new QML approach, and so far seems too complicated to use with my project.
I see a lot of frustration and people complaining it's hard to use QML inside classic QWidget application, I can now see why and why a lot of people are not moving to the QML recommended way.

JKSH

Hi,

@maximus said:

My question is this, how to I load the file and show it on screen (like .exec) when there is no .cpp file for the qml file? I'm probably missing something..

If you are starting a new project, the easy way is to open Qt Creator and create a Qt Quick project: "File" -> "New File or Project..." -> "Application" -> "Qt Quick Application". All the code is generated for you.

Have to say it's a bit strange to load the file with the fileName, not with a class, my qml file is in a sub project and if I change the file path, the project will be broken? seems really hard to maintain..

That's the same as changing the path to a .cpp file or .h file, isn't it?

I should also mention that my project is using a standard QApplication, the mainWindow is a QWidget and not the QML type, I'm not going to change all my project so I can use the new QML approach, and so far seems too complicated to use with my project.

Agreed; replacing everything is a bad idea.

I see a lot of frustration and people complaining it's hard to use QML inside classic QWidget application

It's very easy. Create a QQuickWidget, and use it to load your QML file. Then, add the QQuickWidget to your existing layout, just like any other widget.

maximus

@JKSH said:

It's very easy. Create a QQuickWidget, and use it to load your QML file. Then, add the QQuickWidget to your existing layout, just like any other widget.

Thanks JKSH, will try the QQuickWidget approach instead. I guess I will have to bundle the .qml in resource file or something? As for the file name, you are right it's like changing the .cpp name. I just would have liked that the .qml to deploy automatically and not have to worry about putting it in resource, that adds another step that was not present with QWidget.

I have already done a browser using a QWidget but would like to learn QtQuick since I heard in the Qt conference that it's the future way of doing stuff. As for myself, I prefer UI done with Jquery/bootstrap etc., all good open-source frameworks, not sure why they redo the wheel with QML.

Have a great day,
Max