feat: import M3Shapes, M3 loading indicator and weather + resources + media revamp in lockscreen

2026-07-08 22:53:19 +02:00
parent e3b2d33a11
commit 672cb07547
14 changed files with 733 additions and 439 deletions
@@ -0,0 +1,62 @@
+import QtQuick
+import QtQuick.Layouts
+import qs.Components
+import qs.Config
+import qs.Helpers
+
+ColumnLayout {
+	id: root
+
+	required property int rootHeight
+
+	spacing: Appearance.spacing.extraSmall
+
+	CustomText {
+		Layout.alignment: Qt.AlignHCenter
+		animate: true
+		color: DynamicColors.palette.m3onSurfaceVariant
+		font.pointSize: Appearance.font.size.large
+		text: Weather.description
+	}
+
+	RowLayout {
+		Layout.alignment: Qt.AlignHCenter
+		spacing: Appearance.spacing.small
+
+		CustomText {
+			id: temp
+
+			animate: true
+			color: DynamicColors.palette.m3primary
+			font.pointSize: Appearance.font.size.large
+			text: Weather.temp
+		}
+
+		MaterialIcon {
+			animate: true
+			color: DynamicColors.palette.m3secondary
+			text: Weather.icon
+		}
+	}
+
+	CustomText {
+		Layout.alignment: Qt.AlignHCenter
+		animate: true
+		color: DynamicColors.palette.m3onSurfaceVariant
+		font.pointSize: Appearance.font.size.large
+		text: qsTr("Feels like %1").arg(Weather.temp)
+		visible: root.rootHeight > 550
+	}
+
+	CustomText {
+		Layout.alignment: Qt.AlignHCenter
+		animate: true
+		color: DynamicColors.palette.m3onSurfaceVariant
+		font.pointSize: Appearance.font.size.medium
+		text: {
+			const today = Weather.forecast[0];
+			return qsTr("High %1 • Low %2").arg(Weather.formatTemp(today?.maxTempC)).arg(Weather.formatTemp(today?.minTempC));
+		}
+		visible: root.rootHeight > 550
+	}
+}
@@ -0,0 +1,103 @@
+import QtQuick
+import QtQuick.Layouts
+import M3Shapes
+import ZShell
+import qs.Components
+import qs.Helpers
+import qs.Config
+
+CustomRect {
+	id: root
+
+	color: DynamicColors.layer(DynamicColors.palette.m3surfaceContainerHigh, 2)
+	implicitHeight: header.anchors.margins + header.implicitHeight + Appearance.spacing.small + layout.implicitHeight + layout.anchors.bottomMargin
+	radius: Appearance.rounding.small
+
+	RowLayout {
+		id: header
+
+		anchors.left: parent.left
+		anchors.margins: Appearance.padding.largeIncreased
+		anchors.top: parent.top
+		spacing: Appearance.spacing.small
+
+		MaterialIcon {
+			Layout.topMargin: Math.round(fontInfo.pointSize * 0.12)
+			font.pointSize: Appearance.font.size.medium
+			text: "schedule"
+		}
+
+		CustomText {
+			id: title
+
+			font.pointSize: Appearance.font.size.medium
+			text: qsTr("Hourly forecast")
+		}
+	}
+
+	VerticalFadeListView {
+		id: layout
+
+		anchors.bottom: parent.bottom
+		anchors.bottomMargin: Appearance.padding.largeIncreased
+		anchors.left: parent.left
+		anchors.margins: Appearance.padding.large
+		anchors.right: parent.right
+		implicitHeight: contentItem.childrenRect.height
+		model: Weather.hourlyForecast
+		orientation: VerticalFadeListView.Horizontal
+		spacing: Appearance.spacing.normal
+
+		delegate: ColumnLayout {
+			id: hour
+
+			readonly property var cond: modelData
+			required property int index
+			required property var modelData
+
+			spacing: Appearance.spacing.extraSmall
+
+			MaterialShape {
+				Layout.alignment: Qt.AlignHCenter
+				color: Qt.alpha(DynamicColors.palette.m3primary, hour.index === 0 ? 1 : 0)
+				implicitSize: temp.implicitHeight + Appearance.padding.normal * 2
+				shape: MaterialShape.Cookie4Sided
+
+				Behavior on color {
+					CAnim {
+					}
+				}
+
+				CustomText {
+					id: temp
+
+					anchors.centerIn: parent
+					color: hour.index === 0 ? DynamicColors.palette.m3onPrimary : DynamicColors.palette.m3onSurface
+					font.pointSize: Appearance.font.size.medium
+					text: Weather.formatTemp(hour.cond.tempC).slice(0, -1) // Remove C/F
+				}
+			}
+
+			MaterialIcon {
+				Layout.alignment: Qt.AlignHCenter
+				color: DynamicColors.palette.m3secondary
+				font.pointSize: Appearance.font.size.extraLarge
+				text: hour.cond.icon
+			}
+
+			CustomText {
+				Layout.alignment: Qt.AlignHCenter
+				color: DynamicColors.palette.m3primary
+				text: hour.cond.precipChance + "%"
+			}
+
+			CustomText {
+				Layout.alignment: Qt.AlignHCenter
+				Layout.topMargin: Appearance.spacing.extraSmall
+				color: DynamicColors.palette.m3onSurfaceVariant
+				font.pointSize: Appearance.font.size.small
+				text: hour.index === 0 ? qsTr("Now") : Qt.formatDateTime(new Date(hour.cond.timestamp.replace("T", " ")), Config.services.useTwelveHourClock ? "ha" : "hh:00")
+			}
+		}
+	}
+}