diff --git a/Modules/Dashboard/Content.qml b/Modules/Dashboard/Content.qml index 97c322d..69b0c2f 100644 --- a/Modules/Dashboard/Content.qml +++ b/Modules/Dashboard/Content.qml @@ -81,9 +81,9 @@ Item { anchors.right: parent.right anchors.top: tabs.bottom anchors.topMargin: Tokens.spacing.small - clip: view.currentIndex !== 3 || view.contentX !== (view.currentItem?.x ?? 0) + clip: view.currentIndex !== 3 || (!view.currentItem?.settled ?? true) - Flickable { + Item { id: view readonly property int currentIndex: root.screenState.dashboardTab @@ -93,56 +93,41 @@ Item { } anchors.fill: parent - contentHeight: row.implicitHeight - contentWidth: row.implicitWidth - contentX: currentItem?.x ?? 0 implicitHeight: currentItem?.implicitHeight ?? 0 implicitWidth: currentItem?.implicitWidth ?? 0 - interactive: false - Behavior on contentX { - Anim { - type: Anim.DefaultEffects + Repeater { + id: repeater + + delegate: Loader { + id: paneLoader + + required property int index + required property var modelData + + readonly property real targetX: index < view.currentIndex ? -view.implicitWidth : index > view.currentIndex ? view.implicitWidth : 0 + readonly property bool settled: x === targetX + + active: index === view.currentIndex || opacity > 0 + opacity: index === view.currentIndex ? 1 : 0 + sourceComponent: modelData.component + visible: opacity > 0 + x: targetX + y: 0 + + Behavior on opacity { + Anim { + type: Anim.DefaultEffects + } + } + Behavior on x { + Anim { + type: Anim.DefaultEffects + } + } } - } - - onContentXChanged: { - if (!moving || !currentItem) - return; - - const x = contentX - currentItem.x; - if (x > currentItem.implicitWidth / 2) - root.screenState.dashboardTab = Math.min(root.screenState.dashboardTab + 1, tabs.count - 1); - else if (x < -currentItem.implicitWidth / 2) - root.screenState.dashboardTab = Math.max(root.screenState.dashboardTab - 1, 0); - } - - RowLayout { - id: row - - Repeater { - id: repeater - - delegate: Loader { - id: paneLoader - - required property int index - required property var modelData - - Layout.alignment: Qt.AlignTop - sourceComponent: modelData.component - - Component.onCompleted: active = Qt.binding(() => { - if (index === view.currentIndex) - return true; - const vx = Math.floor(view.visibleArea.xPosition * view.contentWidth); - const vex = Math.floor(vx + view.visibleArea.widthRatio * view.contentWidth); - return (vx >= x && vx <= x + implicitWidth) || (vex >= x && vex <= x + implicitWidth); - }) - } - model: ScriptModel { - values: root.dashboardTabs - } + model: ScriptModel { + values: root.dashboardTabs } }