Feat: Dashboard tabs and repositioning. New processes view. Settings backend changes #158

Merged
zach merged 21 commits from feat/dashboard-tabs-processes-and-settings-backend into main 2026-09-30 16:51:16 +02:00
6 changed files with 95 additions and 78 deletions
Showing only changes of commit f6fa2f0230 - Show all commits
+77 -74
View File
@@ -11,8 +11,8 @@ import qs.Components
Item { Item {
id: root id: root
readonly property real nonAnimWidth: view.implicitWidth + clipWrapper.anchors.margins * 2 readonly property real nonAnimWidth: view.implicitWidth + viewWrapper.anchors.margins * 2
readonly property real nonAnimHeight: tabs.implicitHeight + tabs.anchors.topMargin + view.implicitHeight + clipWrapper.anchors.margins + clipWrapper.anchors.topMargin readonly property real nonAnimHeight: tabs.implicitHeight + tabs.anchors.topMargin + view.implicitHeight + viewWrapper.anchors.margins + viewWrapper.anchors.topMargin
required property ScreenState screenState required property ScreenState screenState
@@ -74,115 +74,118 @@ Item {
anchors.margins: Tokens.padding.small anchors.margins: Tokens.padding.small
} }
CustomClippingRect { Item {
id: clipWrapper id: viewWrapper
property int radius: Tokens.rounding.extraLarge - anchors.margins
anchors.top: tabs.bottom anchors.top: tabs.bottom
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
anchors.topMargin: Tokens.spacing.small anchors.topMargin: Tokens.spacing.small
anchors.margins: Tokens.padding.small anchors.margins: Tokens.padding.small
radius: Tokens.rounding.extraLarge - anchors.margins clip: true
Item { Flickable {
id: viewWrapper id: view
readonly property int currentIndex: root.screenState.dashboardTab
readonly property Item currentItem: {
repeater.count;
return repeater.itemAt(currentIndex);
}
anchors.fill: parent anchors.fill: parent
Flickable { implicitWidth: currentItem?.implicitWidth ?? 0
id: view implicitHeight: currentItem?.implicitHeight ?? 0
readonly property int currentIndex: root.screenState.dashboardTab contentX: currentItem?.x ?? 0
readonly property Item currentItem: { contentWidth: row.implicitWidth
repeater.count; contentHeight: row.implicitHeight
return repeater.itemAt(currentIndex);
}
anchors.fill: parent interactive: false
implicitWidth: currentItem?.implicitWidth ?? 0 onContentXChanged: {
implicitHeight: currentItem?.implicitHeight ?? 0 if (!moving || !currentItem)
return;
contentX: currentItem?.x ?? 0 const x = contentX - currentItem.x;
contentWidth: row.implicitWidth if (x > currentItem.implicitWidth / 2)
contentHeight: row.implicitHeight 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);
}
interactive: false RowLayout {
id: row
onContentXChanged: { Repeater {
if (!moving || !currentItem) id: repeater
return;
const x = contentX - currentItem.x; model: ScriptModel {
if (x > currentItem.implicitWidth / 2) values: root.dashboardTabs
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 { delegate: Loader {
id: row id: paneLoader
Repeater { required property int index
id: repeater required property var modelData
model: ScriptModel { Layout.alignment: Qt.AlignTop
values: root.dashboardTabs
}
delegate: Loader { sourceComponent: modelData.component
id: paneLoader
required property int index Component.onCompleted: active = Qt.binding(() => {
required property var modelData if (index === view.currentIndex)
return true;
Layout.alignment: Qt.AlignTop const vx = Math.floor(view.visibleArea.xPosition * view.contentWidth);
const vex = Math.floor(vx + view.visibleArea.widthRatio * view.contentWidth);
sourceComponent: modelData.component return (vx >= x && vx <= x + implicitWidth) || (vex >= x && vex <= x + implicitWidth);
})
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);
})
}
} }
} }
}
Component { Component {
id: dashComponent id: dashComponent
Dash { Dash {
screenState: root.screenState screenState: root.screenState
} radius: viewWrapper.radius
} }
}
Component { Component {
id: weatherComponent id: weatherComponent
WeatherTab {} WeatherTab {
radius: viewWrapper.radius
} }
}
Component { Component {
id: mediaComponent id: mediaComponent
Media { Media {
screenState: root.screenState screenState: root.screenState
} radius: viewWrapper.radius
} }
}
Component { Component {
id: procsComponent id: procsComponent
ProcessesTab {} ProcessesTab {
radius: viewWrapper.radius
} }
}
Behavior on contentX { Behavior on contentX {
Anim { Anim {
type: Anim.DefaultEffects type: Anim.DefaultEffects
}
} }
} }
} }
+1 -1
View File
@@ -12,7 +12,7 @@ GridLayout {
id: root id: root
readonly property bool dashboardVisible: screenState.dashboard readonly property bool dashboardVisible: screenState.dashboard
property int radius: Tokens.rounding.medium required property int radius
required property ScreenState screenState required property ScreenState screenState
columnSpacing: Tokens.spacing.small columnSpacing: Tokens.spacing.small
+7 -1
View File
@@ -11,12 +11,18 @@ Item {
id: root id: root
property ScreenState screenState property ScreenState screenState
required property int radius
implicitWidth: 1000 implicitWidth: 1000
implicitHeight: 320 implicitHeight: 320
BackgroundShapes { CustomClippingRect {
anchors.fill: parent anchors.fill: parent
radius: root.radius
BackgroundShapes {
anchors.fill: parent
}
} }
RowLayout { RowLayout {
+3 -1
View File
@@ -11,6 +11,8 @@ import qs.Services
Item { Item {
id: root id: root
required property int radius
implicitHeight: layout.implicitHeight implicitHeight: layout.implicitHeight
ServiceRef { ServiceRef {
@@ -53,7 +55,7 @@ Item {
property list<var> values property list<var> values
color: Colors.tPalette.m3surfaceContainer color: Colors.tPalette.m3surfaceContainer
radius: Tokens.rounding.largeIncreased radius: root.radius
Layout.fillWidth: true Layout.fillWidth: true
Layout.fillHeight: true Layout.fillHeight: true
implicitHeight: mainLayout.implicitHeight + mainLayout.anchors.margins * 2 implicitHeight: mainLayout.implicitHeight + mainLayout.anchors.margins * 2
+3
View File
@@ -9,6 +9,8 @@ import qs.Services
Item { Item {
id: root id: root
required property int radius
implicitWidth: Tokens.sizes.dashboard.processesWidth implicitWidth: Tokens.sizes.dashboard.processesWidth
implicitHeight: Tokens.sizes.dashboard.processesHeight implicitHeight: Tokens.sizes.dashboard.processesHeight
@@ -47,5 +49,6 @@ Item {
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
radius: root.radius
} }
} }
+4 -1
View File
@@ -1,3 +1,5 @@
pragma ComponentBehavior: Bound
import QtQuick import QtQuick
import QtQuick.Layouts import QtQuick.Layouts
import ZShell.Config import ZShell.Config
@@ -9,6 +11,7 @@ import qs.Helpers
Item { Item {
id: root id: root
required property int radius
readonly property var today: Weather.forecast && Weather.forecast.length > 0 ? Weather.forecast[0] : null readonly property var today: Weather.forecast && Weather.forecast.length > 0 ? Weather.forecast[0] : null
implicitWidth: layout.implicitWidth > 800 ? layout.implicitWidth : 840 implicitWidth: layout.implicitWidth > 800 ? layout.implicitWidth : 840
@@ -136,7 +139,7 @@ Item {
Layout.fillWidth: true Layout.fillWidth: true
implicitHeight: forecastItemColumn.implicitHeight + Tokens.padding.medium * 2 implicitHeight: forecastItemColumn.implicitHeight + Tokens.padding.medium * 2
radius: Tokens.rounding.large radius: root.radius
color: Colors.tPalette.m3surfaceContainer color: Colors.tPalette.m3surfaceContainer
ColumnLayout { ColumnLayout {