I have defined my own component called "StatusLed.qml"
File StatusLed.qml
Rectangle
{
id: root
width: 20
height: 20
color: "#008b30"
radius: 10
border.color: "#00000000"
function changeColor()
{
root.color = "yellow"
root.radius = 0
}
MouseArea
{
id: clickArea
anchors.fill: parent
}
states:
[
State {
name: "GO"
PropertyChanges { target: root; color: "green" }
},
State {
name: "NOGO"
PropertyChanges { target: root; color: "red" }
},
State {
name: "SELECTABLE"
PropertyChanges { target: root; color: "green" }
PropertyChanges { target: clickArea; onClicked: changeColor() }
}
]
}
I used this component in my main UI-File / window
File main.qml
import QtQuick
import QtQuick.Controls 6.2
import "./content"
Window
{
id: root
width: 1500
height: 900
function controlLeds()
{
if(standby_led1.state == "GO")
{
standby_led2.state = "SELECTABLE"
standby_led3.state = "SELECTABLE"
}
else
{
standby_led2.state = "NOGO"
standby_led3.state = "NOGO"
}
}
StatusLed {
id: standby_led1
state: "NOGO"
onStatesChanged: controlLeds()
}
StatusLed {
id: standby_led2
state: "NOGO"
onStatesChanged: controlLeds()
}
StatusLed {
id: standby_led3
state: "NOGO"
onStatesChanged: controlLeds()
}
}
So far so good. What I'm trying to do is:
I want to execute the JavaScript funtion controlLeds() every time if one of the 3 LEDs have changed his state. This function checks the current state of LED1 and would change the state of the other 2 LEDs (LED2 and LED3) depending on it. I wrongly assumed that a corresponding signal would be triggered so that I could call the function through the onStatesChanged() slot. Since this is not working now, I would like to know how I can solve this? How do I trigger the controlLeds() function?
Many thanks and best regards
You are confusing the two properties state and states. The property state is the name of the current state, whereas the property states is the collection of State objects as defined in StatusLED.qml. You have bound the controlLeds function to the latter, which doesn't change since no states are added/deleted (note that the triggering of a State does not mean the collection states changes)
What you are after is to bind to onStateChanged.
However, I see a binding loop coming, so I propose the following solution:
StatusLed {
id: standby_led1
state: "NOGO" #I assume this is altered from logic not in the question
}
StatusLed {
id: standby_led2
state: standby_led1.state == "GO" ? "SELECTABLE" : "NOGO"
}
StatusLed {
id: standby_led3
state: standby_led1.state == "GO" ? "SELECTABLE" : "NOGO"
}