QMLQT QUICK · C++ · PYTHON
Build desktop interfaces with QML components, shared tokens and practical examples you can run yourself.
QML Core is a separate product. C++ and Python hosts share the same QML screens.
QML CORE
56 of 56 components
START WITH A WORKING APP
Unzip the SDK and use a Qt kit compatible with the plugin edition.
cmake -S examples/cmake-app -B build -G Ninja -DCMAKE_BUILD_TYPE=Release -DCMAKE_PREFIX_PATH=C:/Qt/6.12.0/msvc2022_64 -DCMAKE_MSVC_DEBUG_INFORMATION_FORMAT=Embedded -DCMAKE_POLICY_DEFAULT_CMP0141=NEW
cmake --build build
build/syidax-example --license your.license.json --example workbenchUse the pure QML edition. Select your binding explicitly.
python -m venv .venv
.venv/Scripts/python -m pip install -r examples/python-app/requirements-pyside6.txt
.venv/Scripts/python examples/python-app/main.py --binding pyside6 --license your.license.json --example recordsRun with --diagnose --json to check your Qt version, import path, fonts, runtime and license. No license token is printed.
The Gallery evaluation app is available now. Paid SDK sales and downloads are coming soon. The installation examples above preview the SDK workflow.
Native window and example smoke checks cover the versions below. Qt 6.8 is a source minimum, not a promise of tested support for every Qt release. Gallery uses software rendering.
Step-by-step captures from the running Windows applications. Play, pause and inspect each state.
TRY IT YOURSELF
Browse examples, inspect properties and switch between light and dark themes in a Windows application. The Gallery is for evaluation; commercial SDK access is separate.
Download Gallery · Windows x64$24.99 / month
$249.99 / year per developer
Same regular unit price as Chart. The same price applies to first purchases, additional seats and renewals.
Documentation, runnable examples and diagnostics are included. Individual technical support, onboarding and SLAs are not provided.
View purchase and license terms →The --qml path must contain the Syidax folder. Python uses qml-pure. Run from the unzipped SDK, independently of the source repository.
Download your QML Core certificate and pass it with --license. Web Core, Chart and Grid certificates do not activate QML. Monthly use ends at expiry. Annual licenses retain only releases covered by their update period.
Check the Qt version and architecture used to build plugins. Do not mix Python Qt bindings. qml-pure removes the compiled plugin ABI dependency.
PDF requires the optional QtQuick.Pdf module. Other Core components remain usable without it. For icon packs and resource paths, read SDK docs/ICON-PACKS.md.
Examples write only to their application-data folder. Check permissions and disk space. Invalid JSON is backed up before reset. A failed save preserves your draft.
Indicate that an operation is running when its completion percentage is unknown.
import Syidax.Core.Spinner
| Type | Definition / role |
|---|---|
| Animated indicator for an operation in progress. |
Previews are images of native Qt runs. Use the buttons below each image to view a result.
SySpinner is a turning arc that says "something is loading".
import QtQuick
import Syidax.Core
Item {
implicitWidth: Math.max(360, childrenRect.width)
implicitHeight: childrenRect.height
id: story
property QtObject settings: QtObject {
id: storyArgs
property string size: "medium"
property string description: ""
property bool hidden: false
property bool inline: false
}
Rectangle {
width: 320
height: 120
color: Theme.semantic.backgroundDefault
border.width: 1
border.color: Theme.semantic.borderSubtle
radius: Foundation.borderRadiusMedium
Text {
x: 16
y: 16
width: parent.width - 32
wrapMode: Text.WordWrap
text: "The content of this area is being fetched. It stays readable until the spinner masks it."
font.family: Theme.fontFamily
font.pixelSize: 13
color: Theme.semantic.textSubtle
}
SySpinner {
anchors.centerIn: storyArgs.inline ? undefined : parent
anchors.fill: storyArgs.inline ? parent : undefined
size: storyArgs.size
description: storyArgs.description
hidden: storyArgs.hidden
inline: storyArgs.inline
}
}
}size sets the diameter of the arc: "small" 12 px, "medium" 16 px (default), "large" 20 px and "xlarge" 24 px.
import QtQuick
import Syidax.Core
pragma ComponentBehavior: Bound
Item {
implicitWidth: Math.max(360, childrenRect.width)
implicitHeight: childrenRect.height
id: story
readonly property var sizes: ["small", "medium", "large", "xlarge"]
Row {
spacing: 32
Repeater {
model: story.sizes
delegate: Column {
id: cell
required property string modelData
spacing: 8
Item {
anchors.horizontalCenter: parent.horizontalCenter
width: 24
height: 24
SySpinner { anchors.centerIn: parent; size: cell.modelData }
}
Text { anchors.horizontalCenter: parent.horizontalCenter; text: cell.modelData; font.family: Theme.fontFamily; font.pixelSize: 11; color: Theme.semantic.textSubtle }
}
}
}
}description is a line of 14 px text written 4 px under the arc, centered on it — "Loading…", "Saving your changes".
import QtQuick
import Syidax.Core
Item {
implicitWidth: Math.max(360, childrenRect.width)
implicitHeight: childrenRect.height
property QtObject settings: QtObject {
id: storyArgs
property string description: "Loading…"
}
SySpinner {
size: "large"
description: storyArgs.description
SyButton { text: "Cancel"; size: "small"; variant: "borderless" }
}
}Compare the configuration and result of inline.
import QtQuick
import Syidax.Core
Item {
implicitWidth: Math.max(360, childrenRect.width)
implicitHeight: childrenRect.height
property QtObject settings: QtObject {
id: storyArgs
property bool inline: true
}
Rectangle {
width: 320
height: 120
color: Theme.semantic.backgroundDefault
border.width: 1
border.color: Theme.semantic.borderSubtle
radius: Foundation.borderRadiusMedium
Text {
x: 16
y: 16
width: parent.width - 32
wrapMode: Text.WordWrap
text: "The content of this area is being fetched. It stays readable until the spinner masks it."
font.family: Theme.fontFamily
font.pixelSize: 13
color: Theme.semantic.textSubtle
}
SySpinner { anchors.fill: parent; inline: storyArgs.inline; description: "Loading…" }
}
}delay is the number of milliseconds the spinner stays invisible after it is created (default 0 = at once); a load that finishes sooner never shows a spinner, which avoids a distracting flash.
import QtQuick
import Syidax.Core
pragma ComponentBehavior: Bound
Item {
implicitWidth: Math.max(360, childrenRect.width)
implicitHeight: childrenRect.height
property QtObject settings: QtObject {
id: storyArgs
property int delay: 800
}
Column {
spacing: 12
SyButton {
text: "Load (2.5 s)"
variant: "primary"
loading: load.running
onClicked: load.restart()
}
Item {
width: 200
height: 56
Loader {
anchors.centerIn: parent
active: load.running
sourceComponent: SySpinner { delay: storyArgs.delay; description: "Loading…" }
}
Text {
anchors.centerIn: parent
visible: !load.running
text: "nothing loading"
font.family: Theme.fontFamily
font.pixelSize: 13
color: Theme.semantic.textSubtlest
}
}
Timer { id: load; interval: 2500 }
}
}Inline loading, configured with inline, size.
import QtQuick
import Syidax.Core
Item {
implicitWidth: Math.max(360, childrenRect.width)
implicitHeight: childrenRect.height
id: story
property QtObject settings: QtObject {
id: storyArgs
property string size: "small"
property string description: ""
property bool hidden: false
property bool inline: true
}
Rectangle {
width: 320
height: 120
color: Theme.semantic.backgroundDefault
border.width: 1
border.color: Theme.semantic.borderSubtle
radius: Foundation.borderRadiusMedium
Text {
x: 16
y: 16
width: parent.width - 32
wrapMode: Text.WordWrap
text: "The content of this area is being fetched. It stays readable until the spinner masks it."
font.family: Theme.fontFamily
font.pixelSize: 13
color: Theme.semantic.textSubtle
}
SySpinner {
anchors.centerIn: storyArgs.inline ? undefined : parent
anchors.fill: storyArgs.inline ? parent : undefined
size: storyArgs.size
description: storyArgs.description
hidden: storyArgs.hidden
inline: storyArgs.inline
}
}
}Hover or select an item for its QML example and copy button.
| Property | Type | Default | Description |
|---|---|---|---|
| list (default property) | — | Items laid out 16 px under the arc / description, centered. | |
| string | "medium" | "small" 12 · "medium" 16 · "large" 20 · "xlarge" 24 px — the arc's diameter. | |
| string | "" | 14 px text under the arc; also the accessible name. | |
| bool | false | Hide the spinner (it keeps no size while hidden). | |
| bool | false | Overlay mode: a translucent mask fills the spinner's geometry and the arc is centered on it; implicit size becomes 0. | |
| int | 0 | Milliseconds to stay invisible after creation (or after delay is re-assigned). | |
| real (read-only) | — | The arc's diameter for the current size. | |
| bool (read-only) | — | !hidden and the delay has passed; visible is bound to it. | |
| bool (read-only) | — | The arc is turning: shown, visible and Theme.reducedMotion off. |
| Item | Behavior / conditions |
|---|---|
SySpinner declares no methods — drive it with hidden, delay or by creating it per load. |
| Item | Behavior / conditions |
|---|---|
SySpinner declares no signals of its own; use the property change signals onShownChanged and onSpinningChanged. | |
SySpinner declares no signals of its own; use the property change signals onShownChanged and onSpinningChanged. |
| Item | Behavior / conditions |
|---|---|
Visibility — visible is bound to the read-only shown = !hidden and the delay has passed. Setting visible yourself replaces that binding; prefer hidden. Motion — spinning is true while shown, visible and Theme.reducedMotion is off. | |
!hidden and the delay has passed; visible is bound to it. | |
| Hide the spinner (it keeps no size while hidden). | |
Milliseconds to stay invisible after creation (or after delay is re-assigned). | |
"small" 12 · "medium" 16 · "large" 20 · "xlarge" 24 px — the arc's diameter. | |
| 14 px text under the arc; also the accessible name. | |
| Overlay mode: a translucent mask fills the spinner's geometry and the arc is centered on it; implicit size becomes 0. | |
The arc is turning: shown, visible and Theme.reducedMotion off. |
| Item | Behavior / conditions |
|---|---|
SySkeleton for layout-preserving placeholders, SyProgressBar / SyProgressCircular for known progress, SyButton (loading) for a spinner inside a button. |