QML Item states precedence?

fcarney

I have some states that can occur at the same time. I want to ensure some states have precedence over other states. Can this be done by the order they appear in the states property?

Example:

states: [
  State { when: cond1 },
  State { when: cond2 },
  State { when: cond3 }
]

In my states cond1, cond2, and cond3 can occur at the same time under some conditions. If I want to assign precedence can that be done by the order of the states? Or is it based upon transition of state "when" property?

fcarney

It looks like there is a precedence:

import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Layouts 1.15
import QtQuick.Controls 2.15

Window {
    width: 640
    height: 480
    visible: true
    title: qsTr("State Precedence")

    Text {
        text: rect.state
    }

    RowLayout {
        anchors.fill: parent

        ColumnLayout {
            Layout.preferredWidth: 150
            Layout.fillHeight: true

            Repeater {
                id: staterepeat

                model: 5

                delegate: CheckBox {
                    text: "state %1".arg(modelData)
                }

                Component.onCompleted: {
                    for(let ind=0; ind<model; ++ind){
                        let nstate = rect.states[ind]
                        nstate.when = Qt.binding(()=>itemAt(ind).checked)
                    }
                }
            }
        }

        Rectangle {
            id: rect

            width: 200
            height: 200

            border.width: 1

            states: [
                State {
                    name: "state 0"
                    PropertyChanges {
                        target: rect
                        color: "red"
                    }
                },
                State {
                    name: "state 1"
                    PropertyChanges {
                        target: rect
                        color: "blue"
                    }
                },
                State {
                    name: "state 2"
                    PropertyChanges {
                        target: rect
                        color: "green"
                    }
                },
                State {
                    name: "state 3"
                    PropertyChanges {
                        target: rect
                        color: "yellow"
                    }
                },
                State {
                    name: "state 4"
                    PropertyChanges {
                        target: rect
                        color: "orange"
                    }
                }
            ]

            color: "black"
        }
    }
}

Items that appear first in the list have precedence vs things that appear later.