Examples: Using when in states

We have to make the state machine available
in the ui file, but now the syntax is declarative.

Change-Id: I67fafa05c6c43eeb11d0788fc6ece66c3f853f95
Reviewed-by: Ulf Hermann <ulf.hermann@qt.io>

2 files changed, 11 insertions, 13 deletions

diff --git a/examples/scxml/trafficlight-common/Lights.ui.qml b/examples/scxml/trafficlight-common/Lights.ui.qml
index 7fbadcc..8a71159 100644
--- a/examples/scxml/trafficlight-common/Lights.ui.qml
+++ b/examples/scxml/trafficlight-common/Lights.ui.qml
@@ -51,6 +51,7 @@
 
 import QtQuick 2.5
 import QtQuick.Window 2.2
+import TrafficLightStateMachine 1.0
 
 Image {
     id: lights
@@ -61,6 +62,8 @@ Image {
     property alias yellowLight: yellowLight
     property alias greenLight: greenLight
 
+    property TrafficLightStateMachine stateMachine
+
     source: "background.png"
 
     MouseArea {
@@ -103,6 +106,7 @@ Image {
     states: [
         State {
             name: "Red"
+            when: stateMachine.red
 
             PropertyChanges {
                 target: redLight
@@ -111,6 +115,8 @@ Image {
         },
         State {
             name: "RedGoingGreen"
+            when: stateMachine.redGoingGreen
+
             PropertyChanges {
                 target: redLight
                 opacity: 1
@@ -123,6 +129,7 @@ Image {
         },
         State {
             name: "Yellow"
+            when: stateMachine.yellow || stateMachine.blinking
 
             PropertyChanges {
                 target: yellowLight
@@ -131,6 +138,7 @@ Image {
         },
         State {
             name: "Green"
+            when: stateMachine.green
 
             PropertyChanges {
                 target: greenLight
diff --git a/examples/scxml/trafficlight-common/TrafficLight.qml b/examples/scxml/trafficlight-common/TrafficLight.qml
index c1f497a..6d8319d 100644
--- a/examples/scxml/trafficlight-common/TrafficLight.qml
+++ b/examples/scxml/trafficlight-common/TrafficLight.qml
@@ -54,6 +54,7 @@ import TrafficLightStateMachine 1.0
 
 Window {
     id: root
+
     property TrafficLightStateMachine stateMachine
 
     visible: true
@@ -64,6 +65,8 @@ Window {
     Lights {
         id: lights
 
+        stateMachine: root.stateMachine
+
         mouseArea.onClicked: {
             Qt.quit();
         }
@@ -77,18 +80,5 @@ Window {
         }
 
         button.source: stateMachine.working ? "pause.png" : "play.png"
-
-        state: {
-            if (stateMachine.red)
-                return "Red"
-            if (stateMachine.redGoingGreen)
-                return "RedGoingGreen"
-            if (stateMachine.green)
-                return "Green"
-            if (stateMachine.yellow || stateMachine.blinking)
-                return "Yellow"
-            return ""
-        }
-
     }
 }