CODEWITHSUNDEEP
qtqml
pi.314
pi.314

Reputation: 620

How to load the same QML file and pass them different properties

I have one index.qml file that consist of two rectangles that fill the screen in proportions ~ 3:1. In both of them i load the same window.qml file. What i need is to assaign different values to property ORIENT so window.qml will behaves a little different.

Look at the examle below. This ORINET is just to show what i would like to achive...

index.qml

Rectangle {
    id: rootA
    anchors.left: parent.left
    anchors.top: parent.top
    width: parent.width * 0.65

    // set some property or function so it will be seen in loaded window.qml
    // sth like:
    property ORINET: "horizontal"

    Loader {
        anchors.left: parent.left; anchors.top: parent.top;
        anchors.right: parent.right; anchors.bottom: parent.bottom
        source: "window.qml"
    }
}

Rectangle {
    id: rootB
    anchors.right: parent.right
    anchors.top: parent.top
    width: parent.width * 0.35

    // set some property or function so it will be seen in loaded window.qml
    // sth like:
    property ORINET: "vertical"

    Loader {
        anchors.left: parent.left; anchors.top: parent.top;
        anchors.right: parent.right; anchors.bottom: parent.bottom
        source: "window.qml"
    }
}

window.qml

Rectangle {
    id: windowBox
    state [
        ...
    ]
    ...
    Component.onCompleted: {
        windowBox.state = ORINET
    }
}

Upvotes: 0

Views: 327

Answers (1)

Amfasis
Amfasis

Reputation: 4168

According to this documentation you can give a property to the Loader which will be available to the loaded item as well:

Loader {
    anchors.fill: parent
    property int ORINET: "vertical
    source: "window.qml"
}

window.qml:

Rectangle {

    states: [
        ...
    ]
    state: ORINET
}

Please note that in QtCreator the state: ORINET might look italic and blue as if it doesn't exist, but this is just the editor

Upvotes: 1

Related Questions