Qt SCXML Media Player QML Example (Static)
A Qt Quick application that sends data to and receives it from a compiled ECMAScript data model.
Media Player QML Example (Static) demonstrates how to access data from an ECMAScript data model that is compiled into a C++ class.
The UI is created using Qt Quick.
Running the Example
To run the example from Qt Creator, open the Welcome mode and select the example from Examples. For more information, visit Building and Running an Example.
Using the ECMAScript Data Model
We specify the data model as a value of the datamodel attribute of the <scxml>
element in mediaplayer-common/mediaplayer.scxml:
<scxml xmlns="http://www.w3.org/2005/07/scxml" version="1.0" name="MediaPlayerStateMachine" initial="stopped" datamodel="ecmascript" > <datamodel> <data id="media"/> </datamodel>
Compiling the State Machine
We link against the Qt SCXML module by adding the following lines to the example's build files.
.pro when using qmake:
QT += widgets scxml
We then specify the state machine to compile:
STATECHARTS = ../mediaplayer-common/mediaplayer.scxml
CMakeLists.txt when using cmake:
find_package(Qt6 COMPONENTS Core Gui Widgets Scxml) target_link_libraries(mediaplayer-widgets-static PUBLIC Qt6::Core Qt6::Gui Qt6::Scxml Qt6::Widgets )
We then specify the state machine to compile:
qt6_add_statecharts(mediaplayer-widgets-static ../mediaplayer-common/mediaplayer.scxml )
The statechart directives STATECHARTS or qt6_add_statecharts invoke the Qt SCXML Compiler, qscxmlc
, which is run automatically to generate a header and a source file, which are then added appropriately for compilation.
Instantiating the State Machine
We instantiate the generated MediaPlayerStateMachine
class in mediaplayer-qml-static.cpp:
#include "mediaplayer.h" int main(int argc, char *argv[]) { QGuiApplication app(argc, argv); qmlRegisterType<MediaPlayerStateMachine>("MediaPlayerStateMachine", 1, 0, "MediaPlayerStateMachine"); QQmlApplicationEngine engine; engine.load(QUrl(QStringLiteral("qrc:///mediaplayer-qml-static.qml"))); if (engine.rootObjects().isEmpty()) return -1; return app.exec(); }