QML and QQuickItem with QWidgets

  • I'm trying to get the mapviewer QML example application up and running in a QWidgets application.

    Having successfully got the osm plugin displaying inside a QWidget, I'm trying to set or get some simple properties of the QML map object.

    Being very, very new to QML (i.e. adventures only begun yesterday), I'm now a little stuck.

    My QML looks like this:

    import QtQuick 2.0
    import QtLocation 5.9
    import QtPositioning 5.8
    Rectangle {
        id: containter;
        width: parent.width
        height: parent.height
        property variant startPoint: QtPositioning.coordinate(53.5, -3.5)
        Plugin {
            id: osmPlugin
            name: "osm"
        Map {
            id: map
            anchors.fill: parent
            plugin: osmPlugin
            zoomLevel: 10
        MouseArea {
            id: ma
            property variant coordinate
            anchors.fill: parent
            onClicked: {
                coordinate = map.toCoordinate(Qt.point(mouse.x, mouse.y))
                map.center = coordinate
        function setCenter() {
            map.center = startPoint
        Component.onCompleted: setCenter()

    And the initialization of the QQuickView and other QWidgets in MainWindow.cpp looks like this:

    m_view = new QQuickView();
    QWidget *container = QWidget::createWindowContainer(m_view);
    // Get the root object
    QQuickItem *rect = m_view->rootObject();
    // Get the map
    QQuickItem *map = rect->childItems().at(0);
    // How do I set this property???
    //QGeoCoordinate center(0.0, 0.0);
    //map->setProperty("center", center);
    ui->centralWidget->setLayout(new QGridLayout());

    So far, so good.

    The problem now comes when I want to, say, move the center location of the map from my QWidgets application - maybe via a button press or a function. The Qt documentation seems to indicate that I can use the setProperty function to do this however:

    QGeoCoordinate center(0.0, 0.0);
    map->setProperty("center", center);

    Produces an error because there is no conversion between QGeoCoordinate and QVariant.

    A trick is being missed. Any help would be greatly received!

  • Ok, so a bit more Googling has brought me to the following function:

    QVariant::fromValue() which allows me to pass in a QGeoCoordinate into the setProperty function and this seems to work.

    The next trick is property retrieval. As an example, the supportedMapTypes property in the Map object returns a list of MapTypes for the current plugin.

    I can iterate through the supportedMapTypes list in QML:

    for (var i = 0; i < map.supportedMapTypes.length; i++) {

    And then in my QWidgets application, if I try to get the property:

    QList<QVariant> types = map->property("supportedMapTypes").toList();

    types is just an empty list.

  • Qt Champions 2018

    Why QQuickView + QWidget::createWindowContainer instead of just QQuickWidget ?

  • @GrecKo This is indeed a very good question. My searching hadn't brought me across a QQuickWidget before.

    I shall investigate. Thanks.

  • Ok, so I've sub-classed a QQuickWidget and added an instance to the ui->centralWidget->layout(). I've left a non-subclassed QQuickWidget with the same QML source in the layout for comparison.

    When I run the application, the non-subclassed QQuickWidget renders the QML perfectly but the sub-classed version shows nothing but a white canvas - nothing is showing.

  • Agreed on using QQuickWidget instead. As a side note, if you want a mapping API that supports Widgets (and thus won't require you to use classes like this to shoehorn a QML view into a Widgets app), you can check out the ArcGIS Runtime SDK for Qt - https://developers.arcgis.com/qt/

Log in to reply