Nominate our 2022 Qt Champions!

Insert QML in a QQuickWidget

  • Hi everyone,
    I am very new to QT5.9. I looked on the forum and QT documentation but I couldnt find a way to solve my problem.

    I am trying to set up a software which controls a Arduino with uart. This part work fine, and is written in C++. I would now like to add a visual feedback of what is happening with a usb webcam. I found this code

    which is exactly what I need to add to my software (many thanks to Alex Spataru).

    I was able to merge my code and his, but I am not sure how to put the qml code (from QCCTV project) into a widget. I my mainWindow constructor I added the lines from QCCTV project :

    /*From QCCTV*/
    QGuiApplication::setApplicationName("Awake Monitoring");//("QCCTV Camera");
    QGuiApplication::setOrganizationName("Labeo Technologies"); //("Alex Spataru");
    QGuiApplication::setOrganizationDomain(""); //(APP_WEBSITE);
    /* Set application attributes */
    QGuiApplication::setAttribute (Qt::AA_ShareOpenGLContexts);
    QGuiApplication::setAttribute (Qt::AA_EnableHighDpiScaling);
    /* Initialize application */
    QQuickStyle::setStyle ("Material");
    QCCTV_LocalCamera* qcctvCamera = new QCCTV_LocalCamera();
    bool mobile = false;    // Not on mobile device
    QQmlApplicationEngine engine;
    engine.rootContext()->setContextProperty ("isMobile", mobile);
    engine.rootContext()->setContextProperty ("AppDspName", "Awake Monitoring");
    engine.rootContext()->setContextProperty ("AppVersion", "1.0");
    engine.rootContext()->setContextProperty ("QCCTVCamera", qcctvCamera);
    /* Add QCCTV image provider */
    QCCTV_ImageProvider* provider = new QCCTV_ImageProvider (qcctvCamera);
    engine.addImageProvider ("qcctv", provider);
    /* Load QML interface */
    engine.load (QUrl(QStringLiteral ("qrc:/main_default.qml")));

    And replaced the last line with

    /*My line*/

    in which cameraFeed_qw is a quickWidget I added into Designer. This launches two screen, one with my arduino controls and one with the QCCTV project. My QuickWidget is left as a white blank square.

    I also have "QQuickWidget does not support using windows as a root item.

    If you wish to create your root window from QML, consider using QQmlApplicationEngine instead. " warning.

    Can someone help me with this ? Many thanks in advance,


  • ui->cameraFeed_qw->setSource(QUrl(QStringLiteral("qrc:/main_default.qml"))); should be fine.

    Usually, I write it like that:

    What is wrong about your code is in QML. As it says QQuickWidget does not support using windows as a root item, you probably wrote something like ApplicationWindow{Item {....}} .
    So if you read carefully, you will understand that QQuickWidget does not support ApplicationWindow as a root.

    So basically, you just need to delete it from your code.
    Now your Qml will be something like that :

    //ApplicationWindow {
    Item {

Log in to reply