Important: Please read the Qt Code of Conduct -

[solved] Some beginner questions

  • Hello,
    I started with the great desktop GUI of Qt. Now I will integrate some widget based on the QQickWidget. I have a lot of problems with it. It exist a much of documentation for QML for special tasks, but I found nowhere an general overview for it. The only book I found is in italian (Amazon). Exists other good overview documentation for it ?

    Here some of my base problems. I will make a simple ListView with text entries. I must set some properties from outsize with C++ (font-size, minimal-size of the list-entries and last but not least the model. I take a simple StringList-model.
    I did it by building pure qml-code without the help of the designer and it works now.
    The problem is that I will see my layout in the designer, but I can see only the empty ListView. This clear because my model in the pure QML-code is emty (and other problems).
    So my first question. How can I define a StringListModel in my QML-Code, but make it possible to overwrite with the C++ code behind?
    As well how can I set integer properties to default values in QML and overwrite it later in C++.

    Whats the best order in the C++ code:
    Set the properties and then the qml-Source or first source and then the properties.

  • Lifetime Qt Champion

    Hi, is a pretty good starting point for QML.

    If you are going to mix QML and C++, you should not try to have business logic in both. Use a C++ model if you need a special model and you'll have an easy path to update it from both the QML and C++ side.

  • Hello @SGaist,
    thank you for your answer. I found this book before, but its not really helpfull for my basic questions. QML seem to be very complicated - I am near to the point to give up.

    My simple aim is to produce a legal QML file so that I can see and control the layout in the designer. For configuration I must declare and define some variables in the QML File. When the QML file looks good I will change these values via C++ in the running app.

    Where and as what shall I declare and define these variable so that I can overwrite them with the setContextProperty("VarName", QVariant(Value)) later ???

  • Lifetime Qt Champion

    AFAIK, when you want to communicate between C++ and QML (as in update the value from C++) you will create a QObject based class with properties to automate the update through bindings on the QML side.

  • Ah, I thought it is simpler:

    Text {
    text: _aExternValue

    QQmlContext *cont=Q->rootContext();
    cont->ContextProperty("_aExternValue", "Hallo")

    This works but I cannot see it in QML-Designer because _aExternValue is undefined in the pure QML-Code.
    My idea wars
    property var _aExternValue: "Hallo" (dont know where to define it)
    and then set this property from extern after loding the qml-source.
    This is the wrong/impossible way ?

    When I take your way and define a "Property"-Class in C++, how can I prefill it in pure QML code.

  • Qt Champions 2016

    there are many examples HowTo define Q_PROPERTY
    per ex. take a look here:

  • I know how to work with properties. A C++ class would not solve the problem because I need this structure not at runtime but in pure QML.
    But I solved the problem as wanted

    import QtQuick 2.0
    //import QtQuick.Controls 1.4
    Rectangle {
        id: itsRoot
        objectName: "itsRoot"
        color: "lightgrey"
        width: 500
        height: 500
     //   anchors.fill: parent
            property variant itsModel : ["Entry 1", "Entry 2","Entry 3"]
            property int itsFontSize: 50
            property int itsMinEntryHeight: 50
            id: itsListView
            objectName: "itsListView"
            model: itsModel
            anchors.fill: parent
           // text2.bottom
            signal itemClicked(int index)
            spacing: 7
            snapMode: ListView.SnapToItem
            delegate: Rectangle
                id: delrect
                height: Math.max(itsTextView.height + 20, itsListView.itsMinEntryHeight)
                width: parent.width;
                color: "white"
                border.width: 1; radius: 5
                 //   LayoutItem.minimumSize: 100
                    //color: yellow
                    id: itsTextView
                    font.pixelSize: itsListView.itsFontSize
                    anchors.left: parent.left
                    anchors.verticalCenter: parent.verticalCenter
                    anchors.leftMargin: 10
                   // text: name + ": " + itsModel.index
                   // itsListView.bottom
                    anchors.topMargin: -6;  anchors.bottomMargin: -6
                    anchors.rightMargin: -72
    //                anchors.horizontalCenter: itsListView.horizontalCenter
    //                anchors.bottom:
    //                anchors.right: itsListView.left
                    text: modelData
                   // text: model.display
                    id: mouse_area
                    hoverEnabled: true
                    anchors.fill: parent
                        //console.log("test " + itsListView.currentIndex);

    The ListView has some properties (especaliy the filled model data) so that I can see my layout in the designer. At runtime I overwrite these properties.
    My problem was that I have tried to define the properties not in the ListView but in the root widget (Rectange). This did never work !? Why ?
    I found this link. JavaScript Environment Restriction
    Is the reason that I cannot change variables in the root element ?

  • Moderators

    @Andy314 said:

    My problem was that I have tried to define the properties not in the ListView but in the root widget (Rectange). This did never work !? Why ?

    QQmlContext *cont=Q->rootContext();
    cont->ContextProperty("_aExternValue", "Hallo")

    You tried to modify the property of your root context. However, your Rectangle is the root object. Use QQuickWidget::rootObject(), not QQuickWidget::rootContext().

    Also, you must set the source before you get your root object.

    I found this link. JavaScript Environment Restriction
    Is the reason that I cannot change variables in the root element ?

    No, that article says you cannot modify the JavaScript Global Object. This is not related to your root object.

  • Yeh, that is it !
    Now I understand the concept.
    Thank you very much.

Log in to reply