zui 0.0.1

data/Components/Builtins/Support/ModelView3dScene.qml

@@ -0,0 +1,292 @@
+import QtQuick
+import QtQuick3D
+import QtQuick3D.AssetUtils
+
+Item {
+    id: modelViewRoot
+
+    required property var renderer
+    property real currentPitch: Number(renderer.prop("rotation_x", 0))
+    property real currentYaw: Number(renderer.prop("rotation_y", 0))
+    property real currentRoll: Number(renderer.prop("rotation_z", 0))
+    property real currentZoom: clampZoom(Number(renderer.prop("zoom", 1)))
+    property real automaticYaw: 0
+    property real fittedScale: 1
+    property real boundsDiameter: 0
+    property vector3d modelCenter: Qt.vector3d(0, 0, 0)
+    property real observedResetRevision: Number(renderer.prop("reset_revision", 0))
+    property bool ready: false
+    property string loadedModelSource: ""
+
+    function clampZoom(value) {
+        return Math.max(Number(renderer.prop("minimum_zoom", 0.65)), Math.min(Number(renderer.prop("maximum_zoom", 3.2)), Number(value)));
+    }
+
+    function event(name, payload) {
+        if (renderer.subscribed(name))
+            renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, name, payload || {
+        });
+
+    }
+
+    function sendRotation() {
+        event("rotation_change", {
+            "x": currentPitch,
+            "y": currentYaw,
+            "z": currentRoll
+        });
+    }
+
+    function setZoom(value, notify) {
+        currentZoom = clampZoom(value);
+        if (notify)
+            event("zoom_change", {
+            "value": currentZoom
+        });
+
+    }
+
+    function resetView(notify) {
+        currentPitch = Number(renderer.prop("rotation_x", 0));
+        currentYaw = Number(renderer.prop("rotation_y", 0));
+        currentRoll = Number(renderer.prop("rotation_z", 0));
+        setZoom(Number(renderer.prop("zoom", 1)), notify);
+        if (notify)
+            sendRotation();
+
+    }
+
+    function updateBounds() {
+        var bounds = runtimeModel.bounds;
+        var size = Qt.vector3d(bounds.maximum.x - bounds.minimum.x, bounds.maximum.y - bounds.minimum.y, bounds.maximum.z - bounds.minimum.z);
+        var diameter = Math.max(size.x, size.y, size.z);
+        boundsDiameter = diameter;
+        if (!isFinite(diameter) || diameter <= 0) {
+            fittedScale = Number(renderer.prop("model_scale", 1));
+            modelCenter = Qt.vector3d(Number(renderer.prop("center_x", 0)), Number(renderer.prop("center_y", 0)), Number(renderer.prop("center_z", 0)));
+            return ;
+        }
+        modelCenter = Qt.vector3d((bounds.maximum.x + bounds.minimum.x) / 2, (bounds.maximum.y + bounds.minimum.y) / 2, (bounds.maximum.z + bounds.minimum.z) / 2);
+        var requestedScale = Number(renderer.prop("model_scale", 0));
+        fittedScale = requestedScale > 0 ? requestedScale : Number(renderer.prop("fit_size", 230)) / diameter;
+    }
+
+    function syncFromRenderer() {
+        var revision = Number(renderer.prop("reset_revision", 0));
+        if (revision !== observedResetRevision) {
+            observedResetRevision = revision;
+            resetView(false);
+            return ;
+        }
+        if (!orbitDrag.active) {
+            currentPitch = Number(renderer.prop("rotation_x", currentPitch));
+            currentYaw = Number(renderer.prop("rotation_y", currentYaw));
+            currentRoll = Number(renderer.prop("rotation_z", currentRoll));
+        }
+        if (!zoomPinch.active)
+            setZoom(Number(renderer.prop("zoom", currentZoom)), false);
+
+    }
+
+    function synchronizeModelSource() {
+        var requestedSource = String(renderer.assetUrl(renderer.prop("source", "")));
+        if (requestedSource === loadedModelSource)
+            return ;
+
+        ready = false;
+        loadedModelSource = requestedSource;
+        runtimeModel.source = requestedSource;
+    }
+
+    implicitWidth: Number(renderer.prop("width", 420))
+    implicitHeight: Number(renderer.prop("height", 420))
+    clip: true
+    Component.onCompleted: {
+        synchronizeModelSource();
+        syncFromRenderer();
+    }
+
+    Rectangle {
+        anchors.fill: parent
+        color: renderer.prop("background", "transparent")
+    }
+
+    View3D {
+        id: scene
+
+        anchors.fill: parent
+
+        PerspectiveCamera {
+            id: camera
+
+            z: Number(renderer.prop("camera_distance", 460))
+            fieldOfView: Number(renderer.prop("field_of_view", 36))
+            clipNear: 0.5
+            clipFar: 5000
+        }
+
+        DirectionalLight {
+            eulerRotation: Qt.vector3d(-28, -34, 0)
+            color: renderer.prop("key_light_color", "#ffffff")
+            brightness: Number(renderer.prop("light_brightness", 1.35))
+            castsShadow: true
+            shadowFactor: 70
+            shadowMapQuality: Light.ShadowMapQualityHigh
+        }
+
+        PointLight {
+            position: Qt.vector3d(-180, 90, 240)
+            color: renderer.prop("fill_light_color", "#ffffff")
+            brightness: Number(renderer.prop("light_brightness", 1.35)) * 5
+            quadraticFade: 2e-05
+            linearFade: 0.003
+        }
+
+        Node {
+            id: orbitNode
+
+            eulerRotation: Qt.vector3d(modelViewRoot.currentPitch, modelViewRoot.currentYaw + modelViewRoot.automaticYaw, modelViewRoot.currentRoll)
+            scale: Qt.vector3d(modelViewRoot.fittedScale * modelViewRoot.currentZoom, modelViewRoot.fittedScale * modelViewRoot.currentZoom, modelViewRoot.fittedScale * modelViewRoot.currentZoom)
+
+            RuntimeLoader {
+                id: runtimeModel
+
+                source: ""
+                position: Qt.vector3d(-modelViewRoot.modelCenter.x, -modelViewRoot.modelCenter.y, -modelViewRoot.modelCenter.z)
+                onBoundsChanged: modelViewRoot.updateBounds()
+                onStatusChanged: {
+                    modelViewRoot.event("status", {
+                        "value": status,
+                        "error": errorString
+                    });
+                    if (status === RuntimeLoader.Success) {
+                        modelViewRoot.ready = true;
+                        modelViewRoot.updateBounds();
+                        modelViewRoot.event("loaded", {
+                            "source": source,
+                            "width": bounds.maximum.x - bounds.minimum.x,
+                            "height": bounds.maximum.y - bounds.minimum.y,
+                            "depth": bounds.maximum.z - bounds.minimum.z
+                        });
+                    } else if (status === RuntimeLoader.Error) {
+                        modelViewRoot.ready = false;
+                        renderer.componentError("model_load_failed", errorString, {
+                            "source": source,
+                            "status": status
+                        });
+                    }
+                }
+            }
+
+        }
+
+        environment: SceneEnvironment {
+            backgroundMode: SceneEnvironment.Transparent
+            antialiasingMode: String(renderer.prop("antialiasing", "msaa")) === "none" ? SceneEnvironment.NoAA : SceneEnvironment.MSAA
+            antialiasingQuality: SceneEnvironment.VeryHigh
+            temporalAAEnabled: false
+            aoStrength: 45
+            aoDistance: 12
+            tonemapMode: SceneEnvironment.TonemapModeAces
+        }
+
+    }
+
+    DragHandler {
+        id: orbitDrag
+
+        property real startingPitch: 0
+        property real startingYaw: 0
+
+        enabled: renderer.prop("interactive", true) !== false
+        target: null
+        acceptedButtons: Qt.LeftButton
+        onActiveChanged: {
+            if (active) {
+                startingPitch = modelViewRoot.currentPitch;
+                startingYaw = modelViewRoot.currentYaw;
+            } else {
+                modelViewRoot.sendRotation();
+            }
+        }
+        onTranslationChanged: {
+            if (!active)
+                return ;
+
+            modelViewRoot.currentYaw = startingYaw + translation.x * 0.48;
+            modelViewRoot.currentPitch = Math.max(-88, Math.min(88, startingPitch - translation.y * 0.42));
+        }
+    }
+
+    PinchHandler {
+        id: zoomPinch
+
+        property real startingZoom: 1
+
+        enabled: renderer.prop("interactive", true) !== false
+        target: null
+        minimumScale: Number(renderer.prop("minimum_zoom", 0.65))
+        maximumScale: Number(renderer.prop("maximum_zoom", 3.2))
+        onActiveChanged: {
+            if (active)
+                startingZoom = modelViewRoot.currentZoom;
+            else
+                modelViewRoot.event("zoom_change", {
+                "value": modelViewRoot.currentZoom
+            });
+        }
+        onActiveScaleChanged: {
+            if (active)
+                modelViewRoot.setZoom(startingZoom * activeScale, false);
+
+        }
+    }
+
+    WheelHandler {
+        id: zoomWheel
+
+        enabled: renderer.prop("interactive", true) !== false
+        acceptedDevices: PointerDevice.Mouse | PointerDevice.TouchPad
+        onWheel: function(event) {
+            modelViewRoot.setZoom(modelViewRoot.currentZoom * Math.exp(event.angleDelta.y / 900), true);
+            event.accepted = true;
+        }
+    }
+
+    TapHandler {
+        acceptedButtons: Qt.LeftButton
+        gesturePolicy: TapHandler.DragThreshold
+        onTapped: function(eventPoint) {
+            modelViewRoot.event("click", {
+                "x": eventPoint.position.x,
+                "y": eventPoint.position.y
+            });
+        }
+        onDoubleTapped: function(eventPoint) {
+            modelViewRoot.setZoom(modelViewRoot.currentZoom + 0.55, true);
+            modelViewRoot.event("double_click", {
+                "x": eventPoint.position.x,
+                "y": eventPoint.position.y,
+                "zoom": modelViewRoot.currentZoom
+            });
+        }
+    }
+
+    Connections {
+        function onNodeChanged() {
+            modelViewRoot.synchronizeModelSource();
+            modelViewRoot.syncFromRenderer();
+        }
+
+        target: renderer
+    }
+
+    NumberAnimation on automaticYaw {
+        from: 0
+        to: 360
+        duration: Math.max(1000, Math.round(360000 / Math.max(0.1, Number(renderer.prop("auto_rotate_speed", 4)))))
+        loops: Animation.Infinite
+        running: renderer.prop("auto_rotate", false) === true && !orbitDrag.active
+    }
+
+}

data/Components/Builtins/Support/OptionalModuleState.js

@@ -0,0 +1,5 @@
+.pragma library
+
+// Optional QML modules are probed lazily. Remember a failed probe so state patches do not
+// repeatedly ask the engine to import the same unavailable module.
+var quick3dUnavailable = false

data/Components/Builtins/SwipeDelegate.qml

@@ -0,0 +1,231 @@
+import QtQuick
+import QtQuick.Controls as QQC
+import QtQuick.Layouts
+import "../../Theme"
+
+QQC.SwipeDelegate {
+  id: swipeRoot
+
+  required property var renderer
+  readonly property bool selected: renderer.prop("selected", false) === true
+  readonly property bool hasLeftAction: String(renderer.prop("left_action", "")).length > 0
+    || String(renderer.prop("left_icon", "")).length > 0
+  readonly property bool hasRightAction: String(renderer.prop("right_action", "")).length > 0
+    || String(renderer.prop("right_icon", "")).length > 0
+  readonly property string requestedSide: String(renderer.prop("opened_side", "none"))
+
+  function eventPayload() {
+    return {
+      text: text,
+      value: renderer.prop("value", text),
+      selected: selected
+    }
+  }
+
+  function actionPayload(side) {
+    var isLeft = side === "left"
+    return {
+      side: side,
+      action: String(renderer.prop(isLeft ? "left_action" : "right_action", "")),
+      value: renderer.prop(isLeft ? "left_value" : "right_value",
+        renderer.prop("value", text)),
+      item_value: renderer.prop("value", text)
+    }
+  }
+
+  function triggerAction(side) {
+    renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId,
+      side === "left" ? "left_action" : "right_action", actionPayload(side))
+    if (renderer.prop("close_on_action", true) !== false) swipe.close()
+  }
+
+  function syncOpenedSide() {
+    if (!swipe.enabled) return
+    if (requestedSide === "left" && hasLeftAction) swipe.open(QQC.SwipeDelegate.Left)
+    else if (requestedSide === "right" && hasRightAction) swipe.open(QQC.SwipeDelegate.Right)
+    else if (requestedSide === "none" || requestedSide === "closed") swipe.close()
+  }
+
+  text: String(renderer.prop("text", ""))
+  highlighted: renderer.prop("highlighted", selected) === true
+  enabled: renderer.prop("enabled", true) !== false
+  visible: renderer.prop("visible", true) !== false
+  hoverEnabled: true
+  implicitWidth: Number(renderer.prop("width", 360))
+  implicitHeight: Number(renderer.prop("height", 60))
+  padding: Number(renderer.prop("padding", Style.spacing.md))
+  font.family: String(renderer.prop("font_family", renderer.fontFamily))
+  font.pixelSize: Number(renderer.prop("font_size", Style.font.body))
+  Accessible.name: String(renderer.prop("accessible_name", text))
+
+  swipe.enabled: renderer.prop("swipe_enabled", true) !== false
+  swipe.left: hasLeftAction ? leftActionComponent : null
+  swipe.right: hasRightAction ? rightActionComponent : null
+  swipe.transition: Transition {
+    NumberAnimation {
+      properties: "x"
+      duration: renderer.prop("animated", true) !== false
+        ? Number(renderer.prop("duration", 180)) : 0
+      easing.type: Easing.InOutCubic
+    }
+  }
+
+  background: Rectangle {
+    color: swipeRoot.highlighted
+      ? renderer.prop("highlighted_background", renderer.prop("selected_background", Color.popups.background))
+      : (swipeRoot.selected
+        ? renderer.prop("selected_background", Color.popups.background)
+        : renderer.prop("background", Color.background))
+    radius: Number(renderer.prop("radius", Style.cornerRadius))
+    border.width: Number(renderer.prop("border_width",
+      String(renderer.prop("border_color", "")).length > 0 ? Style.normalBorderWidth : 0))
+    border.color: renderer.prop("border_color", "transparent")
+  }
+
+  contentItem: RowLayout {
+    spacing: Number(renderer.prop("spacing", Style.spacing.md))
+
+    Image {
+      Layout.preferredWidth: Number(renderer.prop("icon_size", 22))
+      Layout.preferredHeight: Number(renderer.prop("icon_size", 22))
+      Layout.alignment: Qt.AlignVCenter
+      visible: source.toString().length > 0
+      source: String(renderer.prop("icon_source", ""))
+      fillMode: Image.PreserveAspectFit
+      onStatusChanged: {
+        if (status === Image.Error)
+          renderer.componentError("swipe_delegate_icon_failed",
+            "Unable to load the declared swipe delegate icon image", { source: String(source) })
+      }
+    }
+
+    Text {
+      Layout.preferredWidth: Number(renderer.prop("icon_size", 22))
+      Layout.alignment: Qt.AlignVCenter
+      visible: text.length > 0 && String(renderer.prop("icon_source", "")).length === 0
+      text: String(renderer.prop("icon", "")).length > 0
+        ? renderer.iconGlyph(renderer.prop("icon", "")) : ""
+      color: renderer.prop("icon_color", renderer.prop("foreground", renderer.foreground))
+      font.family: renderer.fontFamily
+      font.pixelSize: Number(renderer.prop("icon_size", 22))
+      horizontalAlignment: Text.AlignHCenter
+    }
+
+    ColumnLayout {
+      Layout.fillWidth: true
+      spacing: Style.spacing.xs
+      Text {
+        Layout.fillWidth: true
+        text: swipeRoot.text
+        color: swipeRoot.selected
+          ? renderer.prop("selected_foreground", renderer.prop("foreground", renderer.foreground))
+          : renderer.prop("foreground", renderer.foreground)
+        font: swipeRoot.font
+        elide: Text.ElideRight
+      }
+      Text {
+        Layout.fillWidth: true
+        visible: text.length > 0
+        text: String(renderer.prop("description", ""))
+        color: renderer.prop("muted", Color.muted)
+        font.family: String(renderer.prop("font_family", renderer.fontFamily))
+        font.pixelSize: Number(renderer.prop("description_size", Style.font.caption))
+        elide: Text.ElideRight
+      }
+    }
+  }
+
+  Component {
+    id: leftActionComponent
+    Rectangle {
+      implicitWidth: Number(renderer.prop("action_width", 96))
+      color: renderer.prop("left_color", renderer.prop("accent", Color.accent))
+      Row {
+        anchors.centerIn: parent
+        spacing: Style.spacing.sm
+        Text {
+          visible: text.length > 0
+          text: renderer.iconGlyph(renderer.prop("left_icon", ""))
+          color: Color.background
+          font.family: renderer.fontFamily
+          font.pixelSize: Number(renderer.prop("icon_size", 22))
+        }
+        Text {
+          visible: text.length > 0
+          text: String(renderer.prop("left_action", ""))
+          color: Color.background
+          font.family: String(renderer.prop("font_family", renderer.fontFamily))
+          font.pixelSize: Number(renderer.prop("font_size", Style.font.body))
+        }
+      }
+      QQC.SwipeDelegate.onClicked: swipeRoot.triggerAction("left")
+    }
+  }
+
+  Component {
+    id: rightActionComponent
+    Rectangle {
+      implicitWidth: Number(renderer.prop("action_width", 96))
+      color: renderer.prop("right_color", Color.urgent)
+      Row {
+        anchors.centerIn: parent
+        spacing: Style.spacing.sm
+        Text {
+          visible: text.length > 0
+          text: renderer.iconGlyph(renderer.prop("right_icon", ""))
+          color: Color.background
+          font.family: renderer.fontFamily
+          font.pixelSize: Number(renderer.prop("icon_size", 22))
+        }
+        Text {
+          visible: text.length > 0
+          text: String(renderer.prop("right_action", ""))
+          color: Color.background
+          font.family: String(renderer.prop("font_family", renderer.fontFamily))
+          font.pixelSize: Number(renderer.prop("font_size", Style.font.body))
+        }
+      }
+      QQC.SwipeDelegate.onClicked: swipeRoot.triggerAction("right")
+    }
+  }
+
+  Connections {
+    target: swipeRoot.swipe
+    function onPositionChanged() {
+      renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "swipe_position", {
+        value: swipeRoot.swipe.position,
+        side: swipeRoot.swipe.position > 0 ? "left" : (swipeRoot.swipe.position < 0 ? "right" : "none")
+      })
+    }
+    function onCompleted() {
+      renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "swipe_complete", {
+        position: swipeRoot.swipe.position,
+        side: swipeRoot.swipe.position > 0 ? "left" : "right"
+      })
+    }
+    function onOpened() {
+      renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "swipe_open", {
+        side: swipeRoot.swipe.position > 0 ? "left" : "right"
+      })
+    }
+    function onClosed() {
+      renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "swipe_close", {})
+    }
+  }
+
+  Component.onCompleted: syncOpenedSide()
+  onRequestedSideChanged: syncOpenedSide()
+  onClicked: {
+    var payload = eventPayload()
+    renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "click", payload)
+    renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "activate", payload)
+  }
+  onPressed: renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "press", eventPayload())
+  onReleased: renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "release", eventPayload())
+  onHoveredChanged: renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId,
+    "hover", { value: hovered })
+  onActiveFocusChanged: renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId,
+    activeFocus ? "focus" : "blur", {})
+  onVisibleChanged: renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId,
+    visible ? "show" : "hide", {})
+}

data/Components/Builtins/SwipeView.qml

@@ -0,0 +1,69 @@
+import QtQuick
+import QtQuick.Controls as QQC
+import "../../Theme"
+
+QQC.SwipeView {
+  id: swipeRoot
+
+  required property var renderer
+  readonly property int requestedIndex: Number(renderer.prop("current_index", 0))
+  property bool synchronizing: false
+  property bool initialized: false
+
+  function boundedIndex(value) {
+    return count === 0 ? -1 : Math.max(0, Math.min(count - 1, Number(value)))
+  }
+
+  function syncSelection() {
+    var next = boundedIndex(requestedIndex)
+    if (currentIndex === next) return
+    synchronizing = true
+    currentIndex = next
+    synchronizing = false
+  }
+
+  implicitWidth: Number(renderer.prop("width", 640))
+  implicitHeight: Number(renderer.prop("height", 420))
+  enabled: renderer.prop("enabled", true) !== false
+  visible: renderer.prop("visible", true) !== false
+  interactive: renderer.prop("interactive", true) !== false
+  orientation: String(renderer.prop("orientation", "horizontal")) === "vertical"
+    ? Qt.Vertical : Qt.Horizontal
+  clip: renderer.prop("clip", true) !== false
+  LayoutMirroring.enabled: String(renderer.prop("layout_direction", "left_to_right")) === "right_to_left"
+  LayoutMirroring.childrenInherit: true
+
+  background: Rectangle {
+    color: renderer.prop("background", Color.background)
+    radius: Number(renderer.prop("radius", 0))
+    border.width: String(renderer.prop("border_color", "")).length > 0 ? Style.normalBorderWidth : 0
+    border.color: renderer.prop("border_color", "transparent")
+  }
+
+  Repeater {
+    model: renderer.node.children || []
+    delegate: renderer.childDelegateComponent
+  }
+
+  Component.onCompleted: {
+    initialized = true
+    syncSelection()
+  }
+  onRequestedIndexChanged: syncSelection()
+  onCountChanged: {
+    syncSelection()
+    if (initialized && renderer.subscribed("count_change"))
+      renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "count_change", { value: count })
+  }
+  onCurrentIndexChanged: {
+    if (synchronizing || currentIndex < 0) return
+    if (renderer.subscribed("input"))
+      renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "input", { value: currentIndex })
+    if (renderer.subscribed("change"))
+      renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "change", { value: currentIndex })
+  }
+  onVisibleChanged: renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId,
+    visible ? "show" : "hide", {})
+  onActiveFocusChanged: renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId,
+    activeFocus ? "focus" : "blur", {})
+}