Sur cette page

Feu de circulation SCXML (dynamique, QML)

Une application Qt Quick qui utilise une machine à états chargée dynamiquement pour mettre en œuvre un feu de circulation.

Feu de circulation avec feu vert allumé

Traffic Light QML démontre comment se connecter aux propriétés actives d'un état dans une machine à états chargée dynamiquement.

L'interface utilisateur est créée à l'aide de Qt Quick.

Exécution de l'exemple

Pour exécuter l'exemple à partir de Qt Creatorouvrir le mode Welcome et sélectionner l'exemple à partir de Examples. Pour plus d'informations, voir Qt Creator: Tutorial : Construire et exécuter.

Chargement dynamique de la machine à états

Nous établissons un lien avec le module Qt SCXML en ajoutant les lignes suivantes aux fichiers de compilation de l'exemple.

Au fichier .pro si vous utilisez qmake :

QT += qml scxml

À CMakeLists.txt si vous utilisez cmake :

find_package(Qt6 REQUIRED COMPONENTS Core Gui Qml Scxml)
target_link_libraries(trafficlight-qml-dynamic PRIVATE
    Qt6::Core
    Qt6::Gui
    Qt6::Qml
    Qt6::Scxml
)

Nous créons dynamiquement la machine à états dans le fichier QML principal :

import QtScxml
import TrafficLightApplication

Window {
    width: lights.width
    height: lights.height
    visible: true

    Lights {
        id: lights
        stateMachine: loader.stateMachine
        // Suppress qmllint warning, dynamic statemachine properties not known at compile-time
        // qmllint disable missing-property
        button.source: stateMachine.working ? "pause.png" : "play.png"
        button.onClicked: stateMachine.submitEvent(stateMachine.working ? "smash" : "repair");
        // qmllint enable missing-property
    }

    StateMachineLoader {
        id: loader
        source: Qt.resolvedUrl("statemachine.scxml")
    }
}

Connexion aux états

Dans le fichier SCXML, nous spécifions les états de chaque feu : rouge, jaune et vert. Dans l'élément <onentry>, nous spécifions l'événement à envoyer lors de l'entrée dans l'état et le délai en secondes avant l'envoi de l'événement. Dans l'élément <transition>, nous spécifions l'événement qui déclenche la transition vers l'état spécifié par l'attribut target:

        <state id="red">
            <onentry>
                <send event="startGoingGreen" delay="3s"/>
            </onentry>
            <transition event="startGoingGreen" target="redGoingGreen"/>
        </state>

        <state id="yellow" initial="greenGoingRed">
            <state id="redGoingGreen">
                <onentry>
                    <send event="goGreen" delay="1s"/>
                </onentry>
                <transition event="goGreen" target="green"/>
            </state>

            <state id="greenGoingRed">
                <onentry>
                    <send event="goRed" delay="1s"/>
                </onentry>
                <transition event="goRed" target="red"/>
            </state>
        </state>

        <state id="green">
            <onentry>
                <send event="startGoingRed" delay="3s"/>
            </onentry>
            <transition event="startGoingRed" target="greenGoingRed"/>
        </state>

Nous nous connectons aux états comme suit :

    states: [
        // Suppress qmllint warning, dynamic statemachine properties not known at compile-time
        // qmllint disable missing-property
        State {
            name: "Red"
            when: lights.stateMachine.red

            PropertyChanges { redLight.opacity: 1 }
        },
        State {
            name: "RedGoingGreen"
            when: lights.stateMachine.redGoingGreen

            PropertyChanges { redLight.opacity: 1 }
            PropertyChanges { yellowLight.opacity: 1 }
        },
        State {
            name: "Yellow"
            when: lights.stateMachine.yellow || lights.stateMachine.blinking

            PropertyChanges { yellowLight.opacity: 1 }
        },
        State {
            name: "Green"
            when: lights.stateMachine.green

            PropertyChanges { greenLight.opacity: 1 }
        }
        // qmllint enable missing-property
    ]

Exemple de projet @ code.qt.io

© 2026 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.