From 4517e5ecd0be5cbb2bb3049b1cdad47e26cda9f5 Mon Sep 17 00:00:00 2001 From: zach Date: Fri, 14 Aug 2026 16:31:52 +0200 Subject: [PATCH] left-bar working, bottom bar semi-broken --- Components/MarqueeText.qml | 4 +- Drawers/EdgeGeometry.qml | 2 - Drawers/Interactions.qml | 25 ++++------ Drawers/Panels.qml | 25 ++++++---- Drawers/Regions.qml | 21 ++++---- Drawers/Windows.qml | 16 +++---- Modules/Bar/Bar.qml | 30 +++++++++--- Modules/Bar/BarLoader.qml | 11 +---- Modules/ClipWrapper.qml | 43 ++++++++++++++--- Modules/Clock.qml | 24 ++++++++-- Modules/Dashboard/Wrapper.qml | 5 ++ Modules/HyprsunsetWidget.qml | 7 ++- Modules/MediaWidget.qml | 24 ++++++++-- Modules/NotifBell.qml | 9 ++-- Modules/Resource.qml | 16 ++++--- Modules/Resources.qml | 33 ++++++++----- Modules/Resources/Wrapper.qml | 4 +- Modules/Settings/Pages/Panels/BarPanel.qml | 33 ++++++++++++- Modules/SysTray/StatusIcons.qml | 46 ++++++++++++++---- Modules/SysTray/TrayIcons.qml | 22 +++++---- Modules/SysTray/TrayItem.qml | 4 +- Modules/SysTray/TrayWidget.qml | 33 +++++++++---- Modules/SysTray/Widgets/AudioWidget.qml | 4 +- Modules/SysTray/Widgets/MicWidget.qml | 4 +- Modules/SysTray/Widgets/UPowerWidget.qml | 3 ++ Modules/Updates/UpdatesWidget.qml | 19 +++++--- Modules/WindowTitle.qml | 56 +++++++++++++++------- Modules/Workspaces.qml | 49 +++++++++++++------ 28 files changed, 404 insertions(+), 168 deletions(-) diff --git a/Components/MarqueeText.qml b/Components/MarqueeText.qml index 427d381..3db5490 100644 --- a/Components/MarqueeText.qml +++ b/Components/MarqueeText.qml @@ -40,7 +40,7 @@ Item { } } - clip: true + clip: false implicitHeight: elideText.implicitHeight Behavior on leftFadeStrength { @@ -80,7 +80,7 @@ Item { id: marqueeViewport anchors.fill: parent - clip: true + clip: false layer.enabled: true visible: root.overflowing diff --git a/Drawers/EdgeGeometry.qml b/Drawers/EdgeGeometry.qml index 47bc341..e10b45b 100644 --- a/Drawers/EdgeGeometry.qml +++ b/Drawers/EdgeGeometry.qml @@ -10,9 +10,7 @@ QtObject { readonly property bool barOnBottom: position === "bottom" readonly property bool barOnLeft: position === "left" readonly property bool barOnTop: position === "top" - required property string configDashboardPosition required property string configPosition - readonly property bool dashboardOnLeft: configDashboardPosition === "left" ? !barOnLeft : barOnTop readonly property bool horizontal: position !== "left" readonly property string position: configPosition === "top" || configPosition === "bottom" ? configPosition : "left" required property var win diff --git a/Drawers/Interactions.qml b/Drawers/Interactions.qml index 73570cf..2c29d99 100644 --- a/Drawers/Interactions.qml +++ b/Drawers/Interactions.qml @@ -22,7 +22,8 @@ Item { required property PersistentProperties visibilities function inBottomPanel(panel: Item, x: real, y: real): bool { - return y > root.height - panel.height - geometry.insetBottom(borderThickness) && withinPanelWidth(panel, x, y); + const panelHeight = panel.height * (1 - (panel.offsetScale ?? 0)); + return y > root.height - (panelHeight + geometry.insetBottom(borderThickness)) && withinPanelWidth(panel, x, y); } function inLeftPanel(panel: Item, x: real, y: real): bool { @@ -37,17 +38,12 @@ Item { } function inRightPanel(panel: Item, x: real, y: real): bool { - return x > panel.x - geometry.insetLeft(borderThickness) && withinPanelHeight(panel, x, y); + return x > panel.x + geometry.insetLeft(borderThickness) && withinPanelHeight(panel, x, y); } function inTopPanel(panel: Item, x: real, y: real): bool { - return y < geometry.insetTop(borderThickness) + panel.height && withinPanelWidth(panel, x, y); - } - - function onWheel(event: WheelEvent): void { - if (event.x < bar.implicitWidth) { - bar.handleWheel(event.y, event.angleDelta); - } + const panelHeight = panel.height * (1 - (panel.offsetScale ?? 0)); + return y < geometry.insetTop(borderThickness) + panelHeight && withinPanelWidth(panel, x, y); } function withinPanelHeight(panel: Item, x: real, y: real): bool { @@ -89,12 +85,11 @@ Item { if (root.singleGestureTriggered) return; - if (root.geometry.barContains(centroid.pressPosition.x, centroid.pressPosition.y, true)) { - const barDrag = root.geometry.inwardDrag(dragX, dragY); - if (barDrag > 20) { + if (root.geometry.insetTop(root.borderThickness) > centroid.pressPosition.y) { + if (dragY > 20) { root.visibilities.settings = true; root.singleGestureTriggered = true; - } else if (barDrag < -20) { + } else if (dragY < -20) { root.visibilities.settings = false; root.singleGestureTriggered = true; } @@ -228,8 +223,8 @@ Item { if (Config.dock.enable && Config.dock.hoverToReveal && !root.visibilities.dock && !root.visibilities.launcher && root.inBottomPanel(root.panels.dock, x, y)) root.visibilities.dock = true; - if (y < root.bar.implicitHeight) - root.bar.checkPopout(x); + if (root.geometry.barContains(x, y)) + root.bar.checkPopout(root.geometry.axisPos(x, y)); } } diff --git a/Drawers/Panels.qml b/Drawers/Panels.qml index 8a587be..a3b1bd6 100644 --- a/Drawers/Panels.qml +++ b/Drawers/Panels.qml @@ -27,6 +27,7 @@ Item { readonly property alias dock: dock readonly property alias drawing: drawing required property var drawingItem + required property EdgeGeometry geometry readonly property alias launcher: launcher readonly property alias notifications: notifications readonly property alias osd: osd @@ -43,9 +44,11 @@ Item { readonly property alias utilities: utilities required property PersistentProperties visibilities + anchors.bottomMargin: geometry.insetBottom(borderThickness) anchors.fill: parent + anchors.leftMargin: geometry.insetLeft(borderThickness) anchors.margins: borderThickness - anchors.topMargin: bar.implicitHeight + anchors.topMargin: geometry.insetTop(borderThickness) Item { id: resourcesWrapper @@ -53,14 +56,15 @@ Item { anchors.left: parent.left anchors.top: parent.top clip: true - implicitHeight: resources.implicitHeight * (1 - resources.offsetScale) - implicitWidth: resources.implicitWidth + implicitHeight: root.geometry.horizontal ? resources.implicitHeight * (1 - resources.offsetScale) : resources.implicitHeight + implicitWidth: root.geometry.horizontal ? resources.implicitWidth : resources.implicitWidth * (1 - resources.offsetScale) Resources.Wrapper { id: resources anchors.left: parent.left anchors.top: parent.top + horizontal: root.geometry.horizontal visibilities: root.visibilities } } @@ -99,8 +103,8 @@ Item { Modules.ClipWrapper { id: popouts - anchors.top: parent.top borderThickness: root.borderThickness + position: root.geometry.position screen: root.screen } @@ -147,11 +151,13 @@ Item { property real offsetScale: dashboard.shouldBeActive ? 0 : 1 - anchors.right: parent.right - anchors.top: parent.top + anchors.bottom: root.geometry.barOnLeft || root.geometry.barOnBottom ? parent.bottom : undefined + anchors.left: root.geometry.barOnLeft ? parent.left : undefined + anchors.right: root.geometry.barOnLeft ? undefined : parent.right + anchors.top: root.geometry.barOnBottom || root.geometry.barOnLeft ? undefined : parent.top clip: true - implicitHeight: dashboard.implicitHeight * (1 - offsetScale) - implicitWidth: dashboard.implicitWidth + implicitHeight: root.geometry.horizontal ? dashboard.implicitHeight * (1 - offsetScale) : dashboard.implicitHeight + implicitWidth: root.geometry.horizontal ? dashboard.implicitWidth : dashboard.implicitWidth * (1 - offsetScale) Behavior on offsetScale { Anim { @@ -164,8 +170,7 @@ Item { id: dashboard anchors.right: parent.right - anchors.top: parent.top - anchors.topMargin: (-implicitHeight - 5) * offsetScale + horizontal: root.geometry.horizontal offsetScale: dashboardWrapper.offsetScale visibilities: root.visibilities } diff --git a/Drawers/Regions.qml b/Drawers/Regions.qml index e5c3757..590f92f 100644 --- a/Drawers/Regions.qml +++ b/Drawers/Regions.qml @@ -7,17 +7,18 @@ import qs.Modules.Bar as Bar Region { id: root - required property Bar.BarLoader bar + // required property Bar.BarLoader bar readonly property real borderThickness: win.borderThickness + required property EdgeGeometry geometry readonly property alias menuPopoutRegion: menuPopoutRegion required property Panels panels required property var win - height: win.height - bar.implicitHeight - win.borderThickness - win.dragMaskPadding * 2 + height: win.height - geometry.insetTop(borderThickness, true) - geometry.insetBottom(borderThickness, true) - win.dragMaskPadding * 2 intersection: Intersection.Xor - width: win.width - win.borderThickness * 2 - win.dragMaskPadding * 2 - x: win.borderThickness + win.dragMaskPadding - y: bar.implicitHeight + win.dragMaskPadding + width: win.width - geometry.insetLeft(borderThickness, true) * 2 - win.dragMaskPadding * 2 + x: geometry.insetLeft(borderThickness, true) + win.dragMaskPadding + y: geometry.insetTop(borderThickness, true) + win.dragMaskPadding R { panel: root.panels.dashboardWrapper @@ -41,17 +42,21 @@ Region { } R { + height: panel.height + root.geometry.insetTop(root.borderThickness) panel: root.panels.notifications + y: 0 } R { - height: panel.height * (1 - root.panels.utilities.offsetScale) + root.borderThickness + height: panel.height * (1 - root.panels.utilities.offsetScale) + root.geometry.insetBottom(root.borderThickness) panel: root.panels.utilities y: root.win.height - height } R { + height: root.geometry.horizontal ? panel.height * (1 - root.panels.popoutsWrapper.offsetScale) : panel.height panel: root.panels.popoutsWrapper + width: root.geometry.horizontal ? panel.width : panel.width * (1 - root.panels.popoutsWrapper.offsetScale) } R { @@ -82,7 +87,7 @@ Region { height: panel.height intersection: Intersection.Subtract width: panel.width - x: panel.x + root.borderThickness - y: panel.y + root.bar.implicitHeight + x: panel.x + root.geometry.insetLeft(root.borderThickness) + y: panel.y + root.geometry.insetTop(root.borderThickness) } } diff --git a/Drawers/Windows.qml b/Drawers/Windows.qml index e3874e2..b3fb795 100644 --- a/Drawers/Windows.qml +++ b/Drawers/Windows.qml @@ -212,15 +212,15 @@ CustomWindow { PanelBg { id: dashBg - property real extraHeight: 0.2 + property real extraExtent: 0.2 deformAmount: 0.06 - implicitHeight: panels.dashboard.height * (1 + extraHeight) - implicitWidth: panels.dashboard.width + implicitHeight: panels.dashboard.height * (geometry.horizontal ? 1 + extraExtent : 1) + implicitWidth: panels.dashboard.width * (geometry.horizontal ? 1 : 1 + extraExtent) panel: panels.dashboardWrapper radius: Appearance.rounding.normal - x: panels.dashboardWrapper.x + panels.dashboard.x + root.borderThickness - y: panels.dashboardWrapper.y + panels.dashboard.y + geometry.insetTop(root.borderThickness) - panels.dashboard.height * extraHeight + x: panels.dashboardWrapper.x + panels.dashboard.x + geometry.insetLeft(root.borderThickness) - (geometry.horizontal ? 0 : panels.dashboard.width * extraExtent) + y: panels.dashboardWrapper.y + panels.dashboard.y + geometry.insetTop(root.borderThickness) - (geometry.horizontal ? panels.dashboard.height * extraExtent : 0) } PanelBg { @@ -232,7 +232,7 @@ CustomWindow { implicitHeight: panels.launcher.height * (1 + extraHeight) panel: panels.launcher radius: Appearance.rounding.smallest + 5 - y: panels.launcher.y + bar.implicitHeight + y: panels.launcher.y + geometry.insetTop(root.borderThickness) } PanelBg { @@ -299,8 +299,8 @@ CustomWindow { implicitWidth: panels.resources.width panel: panels.resourcesWrapper radius: Appearance.rounding.large - x: panels.resourcesWrapper.x + panels.resources.x + root.borderThickness - y: panels.resourcesWrapper.y + panels.resources.y + bar.implicitHeight + x: panels.resourcesWrapper.x + panels.resources.x + geometry.insetLeft(root.borderThickness) + y: panels.resourcesWrapper.y + panels.resources.y + geometry.insetTop(root.borderThickness) } PanelBg { diff --git a/Modules/Bar/Bar.qml b/Modules/Bar/Bar.qml index 14471ef..74a79ad 100644 --- a/Modules/Bar/Bar.qml +++ b/Modules/Bar/Bar.qml @@ -49,7 +49,7 @@ GridLayout { } else if (id === "tray" && Config.bar.popouts.tray && Config.bar.tray.showOnHover) { const tray = ch.item as TrayIcons; const layout = tray.layout; - const trayItem = horizontal ? layout.childAt(mapToItem(layout, pos, 0).x, layout.height / 2) : layout.childAt(items.width / 2, mapToItem(layout, 0, pos).y); + const trayItem = horizontal ? layout.childAt(mapToItem(layout, pos, 0).x, layout.height / 2) : layout.childAt(tray.width / 2, mapToItem(layout, 0, pos).y); if (trayItem) { const idx = trayItem.index; @@ -92,7 +92,10 @@ GridLayout { roleValue: "hyprsunset" delegate: EntryWrapper { + Layout.fillWidth: !root.horizontal + HyprsunsetWidget { + horizontal: root.horizontal visible: !root.fullscreen } } @@ -123,6 +126,8 @@ GridLayout { roleValue: "tray" delegate: EntryWrapper { + Layout.fillWidth: !root.horizontal + TrayIcons { horizontal: root.horizontal loader: root @@ -136,6 +141,8 @@ GridLayout { roleValue: "statusIcons" delegate: EntryWrapper { + Layout.fillWidth: !root.horizontal + StatusIcons { horizontal: root.horizontal } @@ -146,6 +153,8 @@ GridLayout { roleValue: "resources" delegate: EntryWrapper { + Layout.fillWidth: !root.horizontal + Resources { horizontal: root.horizontal visibilities: root.visibilities @@ -158,6 +167,8 @@ GridLayout { roleValue: "updates" delegate: EntryWrapper { + Layout.fillWidth: !root.horizontal + UpdatesWidget { horizontal: root.horizontal visible: !root.fullscreen @@ -169,6 +180,8 @@ GridLayout { roleValue: "notifBell" delegate: EntryWrapper { + Layout.fillWidth: !root.horizontal + NotifBell { horizontal: root.horizontal popouts: root.popouts @@ -182,6 +195,8 @@ GridLayout { roleValue: "clock" delegate: EntryWrapper { + Layout.fillWidth: !root.horizontal + Clock { horizontal: root.horizontal loader: root @@ -196,6 +211,8 @@ GridLayout { roleValue: "activeWindow" delegate: EntryWrapper { + Layout.fillWidth: !root.horizontal + WindowTitle { bar: root horizontal: root.horizontal @@ -209,7 +226,6 @@ GridLayout { delegate: EntryWrapper { NetworkWidget { - horizontal: root.horizontal } } } @@ -218,6 +234,8 @@ GridLayout { roleValue: "media" delegate: EntryWrapper { + Layout.fillWidth: !root.horizontal + MediaWidget { horizontal: root.horizontal visible: !root.fullscreen @@ -233,11 +251,11 @@ GridLayout { default property Item item required property var modelData - Layout.alignment: Qt.AlignVCenter + Layout.alignment: root.horizontal ? Qt.AlignVCenter : Qt.AlignHCenter Layout.bottomMargin: !root.horizontal && index === repeater.count - 1 ? root.vPadding : 0 - Layout.leftMargin: root.horizontal && index === 0 ? root.vPadding : (entryId === "statusIcons") ? -root.rowSpacing + Appearance.spacing.extraSmall : 0 - Layout.rightMargin: root.horizontal && index === repeater.count - 1 ? root.vPadding : 0 - Layout.topMargin: !root.horizontal && index === 0 ? root.vPadding : (entryId === "statusIcons") ? -root.columnSpacing + Appearance.spacing.extraSmall : 0 + Layout.leftMargin: root.horizontal && index === 0 ? root.vPadding : (entryId === "statusIcons" && root.horizontal) ? -root.rowSpacing + Appearance.spacing.extraSmall : root.horizontal ? 0 : Appearance.padding.smaller + Layout.rightMargin: root.horizontal && index === repeater.count - 1 ? root.vPadding : root.horizontal ? 0 : Appearance.padding.smaller + Layout.topMargin: !root.horizontal && index === 0 ? root.vPadding : (entryId === "statusIcons" && !root.horizontal) ? -root.columnSpacing + Appearance.spacing.extraSmall : 0 children: item implicitHeight: item?.implicitHeight ?? 0 implicitWidth: item?.implicitWidth ?? 0 diff --git a/Modules/Bar/BarLoader.qml b/Modules/Bar/BarLoader.qml index 240417c..fafd193 100644 --- a/Modules/Bar/BarLoader.qml +++ b/Modules/Bar/BarLoader.qml @@ -1,28 +1,22 @@ pragma ComponentBehavior: Bound import Quickshell -import Quickshell.Hyprland import QtQuick -import QtQuick.Layouts import qs.Components import qs.Modules import qs.Config -import qs.Helpers -import qs.Modules.SysTray -import qs.Modules.SysTray.Widgets -import qs.Modules.Network Item { id: root readonly property int clampedExtent: Math.max(Config.bar.border, extent) - readonly property int contentThickness: Config.bar.height + padding * 2 + readonly property int contentThickness: Math.max(Config.bar.height, (horizontal ? 24 : 30)) + padding * 2 readonly property int exclusiveZone: Config.bar.autoHide ? Config.bar.border : contentThickness property real extent: fullscreen ? 0 : Config.bar.border required property bool fullscreen readonly property bool horizontal: position !== "left" property bool isHovered - readonly property int padding: Math.max(Appearance.padding.smaller, Config.bar.border) + readonly property int padding: horizontal ? Math.max(Appearance.padding.smaller, Config.bar.border) : Math.max(Appearance.padding.larger, Config.bar.border) required property Wrapper popouts required property ClipWrapper popoutsWrapper required property string position @@ -89,7 +83,6 @@ Item { sourceComponent: Bar { fullscreen: root.fullscreen - height: root.contentHeight horizontal: root.horizontal popouts: root.popouts popoutsWrapper: root.popoutsWrapper diff --git a/Modules/ClipWrapper.qml b/Modules/ClipWrapper.qml index 10fbd82..cb7cc5e 100644 --- a/Modules/ClipWrapper.qml +++ b/Modules/ClipWrapper.qml @@ -10,27 +10,51 @@ Item { required property real borderThickness readonly property alias content: content - property real offsetScale: y > 0 || content.hasCurrent ? 0 : 1 + readonly property bool horizontal: position !== "left" + // property real offsetScale: y > 0 || content.hasCurrent ? 0 : 1 + property real offsetScale: { + if (content.hasCurrent) + return 0; + if (position === "top") + return y > 0 ? 0 : 1; + if (position === "bottom") + return 1; + return x > 0 ? 0 : 1; + } + required property string position required property ShellScreen screen + anchors.bottom: position === "bottom" ? parent.bottom : undefined clip: true - implicitHeight: content.implicitHeight * (1 - offsetScale) - implicitWidth: content.implicitWidth + implicitHeight: horizontal ? content.implicitHeight * (1 - offsetScale) : content.implicitHeight + implicitWidth: horizontal ? content.implicitWidth : content.implicitWidth * (1 - offsetScale) visible: width > 0 && height > 0 x: { + if (!horizontal) + return 0; const off = content.currentCenter - borderThickness - content.nonAnimWidth / 2; const diff = parent.width - Math.floor(off + content.nonAnimWidth); if (diff < 0) return off + diff; return Math.floor(Math.max(off, 0)); } + y: { + if (horizontal) + return 0; + + const off = content.currentCenter - borderThickness - content.nonAnimHeight / 2; + const diff = parent.height - Math.floor(off + content.nonAnimHeight); + if (diff < 0) + return off + diff; + return Math.max(off, 0); + } Behavior on offsetScale { Anim { } } Behavior on x { - enabled: root.offsetScale < 1 + enabled: !root.horizontal || root.offsetScale < 1 Anim { duration: content.animLength @@ -38,6 +62,8 @@ Item { } } Behavior on y { + enabled: root.horizontal || root.offsetScale < 1 + Anim { duration: content.animLength easing.bezierCurve: content.animCurve @@ -47,9 +73,14 @@ Item { Wrapper { id: content - anchors.horizontalCenter: parent.horizontalCenter - anchors.top: parent.top + anchors.bottom: root.position === "bottom" ? parent.bottom : undefined + anchors.bottomMargin: (-implicitHeight - 5) * root.offsetScale + anchors.horizontalCenter: root.horizontal ? parent.horizontalCenter : undefined + anchors.left: root.horizontal ? undefined : parent.left + anchors.leftMargin: (-implicitWidth - 5) * root.offsetScale + anchors.top: root.position === "top" ? parent.top : undefined anchors.topMargin: (-implicitHeight - 5) * root.offsetScale + anchors.verticalCenter: root.horizontal ? undefined : parent.verticalCenter offsetScale: root.offsetScale screen: root.screen } diff --git a/Modules/Clock.qml b/Modules/Clock.qml index fb668c0..15f95de 100644 --- a/Modules/Clock.qml +++ b/Modules/Clock.qml @@ -9,27 +9,45 @@ import qs.Components CustomRect { id: root - required property RowLayout loader + required property bool horizontal + required property GridLayout loader required property Wrapper popouts + readonly property real shortSize: Config.bar.height + Appearance.padding.smallest * 2 + readonly property real size: timeText.contentWidth + (horizontal ? Appearance.padding.normal : Appearance.padding.larger) * 2 required property PersistentProperties visibilities + anchors.fill: parent color: visibilities.dashboard ? DynamicColors.palette.m3primary : DynamicColors.tPalette.m3surfaceContainer - implicitHeight: Config.bar.height + Appearance.padding.smallest * 2 - implicitWidth: timeText.contentWidth + Appearance.padding.normal * 2 + implicitHeight: horizontal ? shortSize : size + implicitWidth: horizontal ? size : shortSize radius: Appearance.rounding.full CustomText { id: timeText anchors.centerIn: parent + // anchors.horizontalCenter: root.horizontal ? undefined : parent.horizontalCenter + // anchors.verticalCenter: root.horizontal ? parent.verticalCenter : undefined color: root.visibilities.dashboard ? DynamicColors.palette.m3onPrimary : DynamicColors.palette.m3onSurface font: Appearance.font.family.mono // qmllint disable incompatible-type + height: root.horizontal ? implicitHeight : implicitWidth text: Time.dateStr + width: root.horizontal ? implicitWidth : implicitHeight Behavior on color { CAnim { } } + transform: [ + Translate { + x: !root.horizontal ? -timeText.implicitWidth + timeText.implicitHeight : 0 + }, + Rotation { + angle: root.horizontal ? 0 : 270 + origin.x: timeText.implicitHeight / 2 + origin.y: timeText.implicitHeight / 2 + } + ] } StateLayer { diff --git a/Modules/Dashboard/Wrapper.qml b/Modules/Dashboard/Wrapper.qml index 26da1e5..747d0e4 100644 --- a/Modules/Dashboard/Wrapper.qml +++ b/Modules/Dashboard/Wrapper.qml @@ -14,11 +14,16 @@ Item { reloadableId: "dashboardState" } + required property bool horizontal readonly property real nonAnimHeight: state === "visible" ? (content.item?.nonAnimHeight ?? 0) : 0 required property real offsetScale readonly property bool shouldBeActive: root.visibilities.dashboard && Config.dashboard.enabled required property PersistentProperties visibilities + anchors.left: horizontal ? undefined : parent.left + anchors.leftMargin: horizontal ? 0 : (-implicitWidth - 5) * offsetScale + anchors.top: horizontal ? parent.top : undefined + anchors.topMargin: horizontal ? (-implicitHeight - 5) * offsetScale : 0 implicitHeight: content.implicitHeight implicitWidth: content.implicitWidth || 854 opacity: 1 - offsetScale diff --git a/Modules/HyprsunsetWidget.qml b/Modules/HyprsunsetWidget.qml index 4a2ad27..c5bd375 100644 --- a/Modules/HyprsunsetWidget.qml +++ b/Modules/HyprsunsetWidget.qml @@ -6,11 +6,13 @@ import qs.Config CustomRect { id: root + required property bool horizontal property bool tempEnabled: Hyprsunset.enabled + anchors.fill: parent color: root.tempEnabled ? DynamicColors.palette.m3primary : DynamicColors.tPalette.m3surfaceContainer - implicitHeight: Config.bar.height + Appearance.padding.smallest * 2 - implicitWidth: implicitHeight + implicitHeight: horizontal ? Config.bar.height + Appearance.padding.smallest * 2 : width + implicitWidth: horizontal ? height : Config.bar.height + Appearance.padding.smallest * 2 radius: Appearance.rounding.full StateLayer { @@ -25,6 +27,7 @@ CustomRect { animate: true color: root.tempEnabled ? DynamicColors.palette.m3onPrimary : DynamicColors.palette.m3onSurface fill: root.tempEnabled ? 1 : 0 + font.pointSize: root.horizontal ? Appearance.font.size.larger : Appearance.font.size.large text: root.tempEnabled ? "lightbulb" : "light_off" Behavior on fill { diff --git a/Modules/MediaWidget.qml b/Modules/MediaWidget.qml index 644446a..9208622 100644 --- a/Modules/MediaWidget.qml +++ b/Modules/MediaWidget.qml @@ -9,11 +9,13 @@ CustomRect { id: root readonly property string currentMedia: (Players.active?.trackTitle ?? qsTr("No media")) || qsTr("Unknown title") + required property bool horizontal readonly property int textWidth: Math.min(metrics.width, 200) + anchors.fill: parent color: DynamicColors.tPalette.m3surfaceContainer - implicitHeight: Config.bar.height + Appearance.padding.smallest * 2 - implicitWidth: layout.implicitWidth + Appearance.padding.normal * 2 + implicitHeight: horizontal ? Config.bar.height + Appearance.padding.smallest * 2 : layout.implicitHeight + Appearance.padding.normal * 2 + implicitWidth: horizontal ? layout.implicitWidth + Appearance.padding.normal * 2 : Config.bar.height + Appearance.padding.smallest radius: Appearance.rounding.full Behavior on implicitWidth { @@ -28,10 +30,11 @@ CustomRect { text: mediatext.text } - RowLayout { + GridLayout { id: layout anchors.centerIn: parent + columns: root.horizontal ? -1 : 1 Behavior on implicitWidth { Anim { @@ -39,6 +42,7 @@ CustomRect { } MaterialIcon { + Layout.alignment: root.horizontal ? Qt.AlignVCenter : Qt.AlignHCenter animate: true color: Players.active?.isPlaying ? DynamicColors.palette.m3primary : DynamicColors.palette.m3onSurface font.pointSize: Appearance.font.size.larger @@ -48,7 +52,8 @@ CustomRect { MarqueeText { id: mediatext - Layout.preferredWidth: root.textWidth + Layout.alignment: root.horizontal ? Qt.AlignVCenter : Qt.AlignHCenter + Layout.preferredHeight: root.horizontal ? root.height : root.textWidth animate: true color: Players.active?.isPlaying ? DynamicColors.palette.m3primary : DynamicColors.palette.m3onSurface font.pointSize: Appearance.font.size.normal @@ -58,6 +63,17 @@ CustomRect { text: root.currentMedia width: root.textWidth + transform: [ + Translate { + x: !root.horizontal ? -root.textWidth + mediatext.implicitHeight : 0 + }, + Rotation { + angle: root.horizontal ? 0 : 270 + origin.x: mediatext.implicitHeight / 2 + origin.y: mediatext.implicitHeight / 2 + } + ] + CustomMouseArea { anchors.fill: parent hoverEnabled: true diff --git a/Modules/NotifBell.qml b/Modules/NotifBell.qml index ba15f26..dabacab 100644 --- a/Modules/NotifBell.qml +++ b/Modules/NotifBell.qml @@ -7,12 +7,14 @@ import qs.Components CustomRect { id: root + required property bool horizontal required property Wrapper popouts required property PersistentProperties visibilities + anchors.fill: parent color: visibilities.sidebar ? DynamicColors.palette.m3primary : DynamicColors.tPalette.m3surfaceContainer - implicitHeight: Config.bar.height + Appearance.padding.smallest * 2 - implicitWidth: implicitHeight + implicitHeight: horizontal ? Config.bar.height + Appearance.padding.smallest * 2 : width + implicitWidth: horizontal ? height : Config.bar.height + Appearance.padding.smallest * 2 radius: Appearance.rounding.full MaterialIcon { @@ -21,8 +23,7 @@ CustomRect { anchors.centerIn: parent color: root.visibilities.sidebar ? DynamicColors.palette.m3onPrimary : DynamicColors.palette.m3onSurface fill: root.visibilities.sidebar ? 1 : 0 - font.family: "Material Symbols Rounded" - font.pointSize: Appearance.font.size.larger + font.pointSize: root.horizontal ? Appearance.font.size.larger : Appearance.font.size.large text: NotifServer.list.length ? "\uf4fe" : "\ue7f4" Behavior on color { diff --git a/Modules/Resource.qml b/Modules/Resource.qml index 32a6b46..2cdb28d 100644 --- a/Modules/Resource.qml +++ b/Modules/Resource.qml @@ -4,13 +4,14 @@ import QtQuick.Shapes import qs.Components import qs.Config -RowLayout { +GridLayout { id: root property color accentColor: warning ? DynamicColors.palette.m3error : mainColor property real animatedPercentage: 0 readonly property real arcStartAngle: 0.75 * Math.PI readonly property real arcSweep: 1.5 * Math.PI + required property bool horizontal property string icon required property color iconColor required property color mainColor @@ -20,8 +21,9 @@ RowLayout { property bool warning: percentage * 100 >= warningThreshold property int warningThreshold: 80 + columnSpacing: Appearance.spacing.smaller + columns: horizontal ? -1 : 1 percentage: 0 - spacing: Appearance.spacing.smaller Behavior on animatedPercentage { Anim { @@ -46,8 +48,8 @@ RowLayout { } CustomClippingRect { - Layout.preferredHeight: root.height - Appearance.padding.small - Layout.preferredWidth: 4 + Layout.preferredHeight: root.horizontal ? icon.implicitHeight : 4 + Layout.preferredWidth: root.horizontal ? 4 : icon.implicitWidth color: DynamicColors.layer(DynamicColors.palette.m3surfaceContainerHigh, 2) radius: Appearance.rounding.full @@ -56,9 +58,11 @@ RowLayout { anchors.bottom: parent.bottom anchors.left: parent.left - anchors.right: parent.right + anchors.right: root.horizontal ? parent.right : undefined + anchors.top: root.horizontal ? undefined : parent.top color: root.mainColor - implicitHeight: Math.ceil(root.percentage * parent.height) + implicitHeight: root.horizontal ? Math.ceil(root.percentage * parent.height) : 0 + implicitWidth: root.horizontal ? 0 : Math.ceil(root.percentage * parent.height) // Behavior on implicitHeight { // Anim { diff --git a/Modules/Resources.qml b/Modules/Resources.qml index cf3ef24..f33c442 100644 --- a/Modules/Resources.qml +++ b/Modules/Resources.qml @@ -12,12 +12,14 @@ import qs.Components CustomRect { id: root + required property bool horizontal required property PersistentProperties visibilities + anchors.fill: parent clip: true color: visibilities.resources ? DynamicColors.palette.m3primary : DynamicColors.tPalette.m3surfaceContainer - implicitHeight: Config.bar.height + Appearance.padding.smallest * 2 - implicitWidth: rowLayout.implicitWidth + Appearance.padding.larger * 2 + implicitHeight: horizontal ? Config.bar.height + Appearance.padding.smallest * 2 : gridLayout.implicitHeight + Appearance.padding.normal * 2 + implicitWidth: horizontal ? gridLayout.implicitWidth + Appearance.padding.larger * 2 : Config.bar.height radius: Appearance.rounding.full StateLayer { @@ -26,13 +28,14 @@ CustomRect { onClicked: root.visibilities.resources = !root.visibilities.resources } - RowLayout { - id: rowLayout + GridLayout { + id: gridLayout anchors.centerIn: parent - anchors.horizontalCenterOffset: -2 - implicitHeight: root.implicitHeight - spacing: Appearance.spacing.smaller + anchors.horizontalCenterOffset: root.horizontal ? 0 : 1 + anchors.verticalCenterOffset: root.horizontal ? 0 : -3 + columnSpacing: Appearance.spacing.smaller + columns: root.horizontal ? -1 : 1 ServiceRef { service: Gpu @@ -48,7 +51,9 @@ CustomRect { Resource { Layout.alignment: Qt.AlignVCenter - Layout.fillHeight: true + Layout.fillHeight: root.horizontal + Layout.fillWidth: !root.horizontal + horizontal: root.horizontal icon: "memory" iconColor: root.visibilities.resources ? DynamicColors.palette.m3onPrimary : DynamicColors.palette.m3onSurface mainColor: root.visibilities.resources ? DynamicColors.palette.m3onPrimary : DynamicColors.palette.m3primary @@ -57,7 +62,9 @@ CustomRect { } Resource { - Layout.fillHeight: true + Layout.fillHeight: root.horizontal + Layout.fillWidth: !root.horizontal + horizontal: root.horizontal icon: "memory_alt" iconColor: root.visibilities.resources ? DynamicColors.palette.m3onPrimary : DynamicColors.palette.m3onSurface mainColor: root.visibilities.resources ? DynamicColors.palette.m3onPrimary : DynamicColors.palette.m3secondary @@ -66,7 +73,9 @@ CustomRect { } Resource { - Layout.fillHeight: true + Layout.fillHeight: root.horizontal + Layout.fillWidth: !root.horizontal + horizontal: root.horizontal icon: "gamepad" iconColor: root.visibilities.resources ? DynamicColors.palette.m3onPrimary : DynamicColors.palette.m3onSurface mainColor: root.visibilities.resources ? DynamicColors.palette.m3onPrimary : DynamicColors.palette.m3tertiary @@ -74,7 +83,9 @@ CustomRect { } Resource { - Layout.fillHeight: true + Layout.fillHeight: root.horizontal + Layout.fillWidth: !root.horizontal + horizontal: root.horizontal icon: "developer_board" iconColor: root.visibilities.resources ? DynamicColors.palette.m3onPrimary : DynamicColors.palette.m3onSurface mainColor: root.visibilities.resources ? DynamicColors.palette.m3onPrimary : DynamicColors.palette.m3primary diff --git a/Modules/Resources/Wrapper.qml b/Modules/Resources/Wrapper.qml index 7c196e6..77ad0cb 100644 --- a/Modules/Resources/Wrapper.qml +++ b/Modules/Resources/Wrapper.qml @@ -8,12 +8,14 @@ import qs.Config Item { id: root + required property bool horizontal readonly property real nonAnimHeight: content.item?.nonAnimHeight ?? 0 property real offsetScale: shouldBeActive ? 0 : 1 readonly property bool shouldBeActive: root.visibilities.resources required property PersistentProperties visibilities - anchors.topMargin: (-implicitHeight - 5) * offsetScale + anchors.leftMargin: horizontal ? 0 : (-implicitWidth - 5) * offsetScale + anchors.topMargin: horizontal ? (-implicitHeight - 5) * offsetScale : 0 clip: true implicitHeight: content.implicitHeight implicitWidth: content.implicitWidth || 854 // Hard coded fallback for first open diff --git a/Modules/Settings/Pages/Panels/BarPanel.qml b/Modules/Settings/Pages/Panels/BarPanel.qml index 9b344eb..450063e 100644 --- a/Modules/Settings/Pages/Panels/BarPanel.qml +++ b/Modules/Settings/Pages/Panels/BarPanel.qml @@ -1,6 +1,7 @@ pragma ComponentBehavior: Bound import QtQuick.Layouts +import qs.Components import qs.Config import qs.Modules.Settings.Common @@ -25,7 +26,6 @@ PageBase { ToggleRow { checked: Config.bar.autoHide first: true - last: true settingAnchor: "bar-autohide" subtext: qsTr("Hide the bar, reveal on hover") text: qsTr("Auto hide") @@ -33,6 +33,37 @@ PageBase { onToggled: Config.bar.autoHide = checked } + SelectRow { + active: Config.bar.position === "top" ? menuItems[0] : Config.bar.position === "left" ? menuItems[1] : menuItems[2] + last: true + settingAnchor: "bar-position" + subtext: qsTr("Automatic or manual effect values") + text: qsTr("Effects mode") + + menuItems: [ + MenuItem { + icon: "build" + text: qsTr("Top") + value: "top" + }, + MenuItem { + icon: "rotate_auto" + text: qsTr("Left") + value: "left" + }, + MenuItem { + icon: "rotate_auto" + text: qsTr("Bottom") + value: "bottom" + } + ] + + onSelected: item => { + Config.bar.position = item.value; + Config.save(); + } + } + // Components SectionHeader { text: qsTr("Components") diff --git a/Modules/SysTray/StatusIcons.qml b/Modules/SysTray/StatusIcons.qml index 5e40cdb..1376fb9 100644 --- a/Modules/SysTray/StatusIcons.qml +++ b/Modules/SysTray/StatusIcons.qml @@ -18,9 +18,10 @@ CustomClippingRect { return i; return -1; } + required property bool horizontal // Index of the first/last entry that isn't collapsed, for edge margin gating - readonly property alias items: row + readonly property alias items: grid readonly property int lastPresent: { const values = model.values; for (let i = values.length - 1; i >= 0; i--) @@ -28,6 +29,8 @@ CustomClippingRect { return i; return -1; } + readonly property real shortSize: Config.bar.height + Appearance.padding.smallest * 2 + readonly property real size: horizontal ? grid.implicitWidth + Appearance.padding.small * 2 : grid.implicitHeight + Appearance.padding.small * 2 readonly property int spacing: Appearance.spacing.normal / 2 // Entries that can shrink to nothing, spacing included @@ -37,19 +40,37 @@ CustomClippingRect { return false; } - bottomLeftRadius: Appearance.rounding.smallest / 2 + anchors.fill: parent + bottomLeftRadius: horizontal ? Appearance.rounding.smallest / 2 : Appearance.rounding.full color: DynamicColors.tPalette.m3surfaceContainer - implicitHeight: Config.bar.height + Appearance.padding.smallest * 2 - implicitWidth: row.implicitWidth + Appearance.padding.small * 2 + implicitHeight: horizontal ? shortSize : size + implicitWidth: horizontal ? size : shortSize radius: Appearance.rounding.full topLeftRadius: Appearance.rounding.smallest / 2 + topRightRadius: horizontal ? Appearance.rounding.full : Appearance.rounding.smallest / 2 - RowLayout { - id: row + Behavior on implicitHeight { + enabled: !root.horizontal + Anim { + } + } + Behavior on implicitWidth { + enabled: root.horizontal + + Anim { + } + } + + GridLayout { + id: grid + + anchors.bottomMargin: root.horizontal ? 0 : Appearance.padding.small anchors.fill: parent - anchors.leftMargin: Appearance.padding.small - anchors.rightMargin: Appearance.padding.small + anchors.leftMargin: root.horizontal ? Appearance.padding.small : 0 + anchors.rightMargin: root.horizontal ? Appearance.padding.small : 0 + anchors.topMargin: root.horizontal ? 0 : Appearance.padding.small + columns: root.horizontal ? -1 : 1 Repeater { model: ScriptModel { @@ -68,6 +89,7 @@ CustomClippingRect { name: "audio" AudioWidget { + horizontal: root.horizontal } } } @@ -79,6 +101,7 @@ CustomClippingRect { name: "audio" MicWidget { + horizontal: root.horizontal } } } @@ -90,6 +113,7 @@ CustomClippingRect { name: "upower" UPowerWidget { + horizontal: root.horizontal } } } @@ -108,8 +132,10 @@ CustomClippingRect { property real rightGap: present && index !== root.firstPresent ? margin : 0 Layout.alignment: Qt.AlignHCenter - Layout.leftMargin: Math.round(leftGap) - Layout.rightMargin: Math.round(rightGap) + Layout.bottomMargin: root.horizontal ? 0 : Math.round(rightGap) + Layout.leftMargin: root.horizontal ? Math.round(leftGap) : 0 + Layout.rightMargin: root.horizontal ? Math.round(rightGap) : 0 + Layout.topMargin: root.horizontal ? 0 : Math.round(leftGap) children: item implicitHeight: item?.implicitHeight ?? 0 implicitWidth: item?.implicitWidth ?? 0 diff --git a/Modules/SysTray/TrayIcons.qml b/Modules/SysTray/TrayIcons.qml index 7d47919..74cb001 100644 --- a/Modules/SysTray/TrayIcons.qml +++ b/Modules/SysTray/TrayIcons.qml @@ -11,24 +11,30 @@ import qs.Modules CustomClippingRect { id: root + required property bool horizontal readonly property alias items: repeater - readonly property alias layout: sysRow - required property RowLayout loader + readonly property alias layout: sysGrid + required property GridLayout loader readonly property int padding: Appearance.padding.small required property Wrapper popouts + readonly property real shortSize: Config.bar.height + Appearance.padding.smallest * 2 + readonly property real size: horizontal ? sysGrid.implicitWidth + Appearance.padding.small : sysGrid.implicitHeight + Appearance.padding.small + anchors.fill: parent + bottomLeftRadius: horizontal ? Appearance.rounding.full : Appearance.rounding.smallest / 2 bottomRightRadius: Appearance.rounding.smallest / 2 color: DynamicColors.tPalette.m3surfaceContainer - implicitHeight: Config.bar.height + Appearance.padding.smallest * 2 - implicitWidth: sysRow.implicitWidth + Appearance.padding.small * 2 + implicitHeight: horizontal ? shortSize : size + implicitWidth: horizontal ? size : shortSize radius: Appearance.rounding.full - topRightRadius: Appearance.rounding.smallest / 2 + topRightRadius: horizontal ? Appearance.rounding.smallest / 2 : Appearance.rounding.full - RowLayout { - id: sysRow + GridLayout { + id: sysGrid anchors.centerIn: parent - spacing: 0 + columns: root.horizontal ? -1 : 1 + rowSpacing: -2 Repeater { id: repeater diff --git a/Modules/SysTray/TrayItem.qml b/Modules/SysTray/TrayItem.qml index dc017c4..87f9762 100644 --- a/Modules/SysTray/TrayItem.qml +++ b/Modules/SysTray/TrayItem.qml @@ -12,10 +12,10 @@ Item { id: root property bool current: popouts.currentName.startsWith(`traymenu${ind}`) && popouts.hasCurrent - readonly property real dpr: Hypr.monitorFor(loader.screen).scale + readonly property real dpr: Hypr.monitorFor(loader?.screen).scale required property int ind required property SystemTrayItem item - required property RowLayout loader + required property GridLayout loader required property Wrapper popouts function resolveIcon(app: string, icon: string): string { diff --git a/Modules/SysTray/TrayWidget.qml b/Modules/SysTray/TrayWidget.qml index 3797200..f63a24a 100644 --- a/Modules/SysTray/TrayWidget.qml +++ b/Modules/SysTray/TrayWidget.qml @@ -8,12 +8,15 @@ import qs.Config import qs.Modules.SysTray.Widgets import qs.Modules -RowLayout { +GridLayout { id: root + required property bool horizontal readonly property alias items: repeater - required property RowLayout loader + required property GridLayout loader required property Wrapper popouts + readonly property real shortSize: Config.bar.height + Appearance.padding.smallest * 2 + readonly property real size: horizontal ? sysTray.implicitWidth + sysTrayMod.implicitWidth + Appearance.padding.small : sysTray.implicitHeight + sysTrayMod.implicitHeight + Appearance.padding.small function closestRowChild(row, x) { let child = row.childAt(x, row.height / 2); @@ -80,9 +83,11 @@ RowLayout { return null; } - height: Config.bar.height + Appearance.padding.smallest * 2 - spacing: Appearance.padding.small - width: sysTray.implicitWidth + sysTrayMod.implicitWidth + Appearance.padding.small + columnSpacing: Appearance.padding.small + columns: horizontal ? -1 : 1 + height: horizontal ? shortSize : size + rowSpacing: Appearance.padding.small + width: horizontal ? size : shortSize CustomClippingRect { id: sysTray @@ -94,11 +99,18 @@ RowLayout { radius: Appearance.rounding.full topRightRadius: Appearance.rounding.smallest / 2 - Row { + GridLayout { id: sysRow + anchors.bottom: root.horizontal ? undefined : parent.bottom anchors.centerIn: parent - spacing: 0 + anchors.horizontalCenter: root.horizontal ? parent.horizontalCenter : undefined + anchors.left: root.horizontal ? undefined : parent.left + anchors.right: root.horizontal ? undefined : parent.right + anchors.verticalCenter: root.horizontal ? parent.verticalCenter : undefined + columnSpacing: Appearance.spacing.small / 2 + columns: root.horizontal ? -1 : 1 + rowSpacing: Appearance.spacing.small / 2 Repeater { id: repeater @@ -125,10 +137,12 @@ RowLayout { CustomClippingRect { id: sysTrayMod - Layout.fillHeight: true + Layout.fillHeight: root.horizontal + Layout.fillWidth: !root.horizontal bottomLeftRadius: Appearance.rounding.smallest / 2 color: DynamicColors.tPalette.m3surfaceContainer - implicitWidth: sysIcons.implicitWidth + Appearance.padding.smaller + Appearance.padding.normal + implicitHeight: root.horizontal ? sysIcons.implicitHeight : sysIcons.implicitHeight + Appearance.padding.smaller + Appearance.padding.normal + implicitWidth: root.horizontal ? sysIcons.implicitWidth + Appearance.padding.smaller + Appearance.padding.normal : sysIcons.implicitWidth radius: Appearance.rounding.full topLeftRadius: Appearance.rounding.smallest / 2 @@ -138,6 +152,7 @@ RowLayout { anchors.fill: parent anchors.leftMargin: Appearance.padding.smaller anchors.rightMargin: Appearance.padding.normal + horizontal: root.horizontal } } } diff --git a/Modules/SysTray/Widgets/AudioWidget.qml b/Modules/SysTray/Widgets/AudioWidget.qml index 4555d11..5190656 100644 --- a/Modules/SysTray/Widgets/AudioWidget.qml +++ b/Modules/SysTray/Widgets/AudioWidget.qml @@ -10,10 +10,12 @@ import qs.Components MaterialIcon { id: speaker + required property bool horizontal + animate: true color: Audio.muted ? DynamicColors.palette.m3error : DynamicColors.palette.m3onSurface fill: 1 - font.pointSize: Appearance.font.size.larger + font.pointSize: horizontal ? Appearance.font.size.larger : Appearance.font.size.large text: Audio.muted ? "volume_off" : "volume_up" Behavior on Layout.maximumWidth { diff --git a/Modules/SysTray/Widgets/MicWidget.qml b/Modules/SysTray/Widgets/MicWidget.qml index 2aa51ce..77681df 100644 --- a/Modules/SysTray/Widgets/MicWidget.qml +++ b/Modules/SysTray/Widgets/MicWidget.qml @@ -10,10 +10,12 @@ import qs.Components MaterialIcon { id: mic + required property bool horizontal + animate: true color: (Audio.sourceMuted ?? false) ? DynamicColors.palette.m3error : DynamicColors.palette.m3onSurface fill: 1 - font.pointSize: Appearance.font.size.larger + font.pointSize: horizontal ? Appearance.font.size.larger : Appearance.font.size.large text: Audio.sourceMuted ? "mic_off" : "mic" Behavior on Layout.maximumWidth { diff --git a/Modules/SysTray/Widgets/UPowerWidget.qml b/Modules/SysTray/Widgets/UPowerWidget.qml index 6968b4f..cd789d3 100644 --- a/Modules/SysTray/Widgets/UPowerWidget.qml +++ b/Modules/SysTray/Widgets/UPowerWidget.qml @@ -8,6 +8,8 @@ import qs.Helpers Item { id: root + required property bool horizontal + implicitHeight: Battery.isLaptop ? batteryIconLoader.item.implicitHeight : upowerIconLoader.item.implicitHeight implicitWidth: Battery.isLaptop ? batteryIconLoader.item.implicitWidth : upowerIconLoader.item.implicitWidth @@ -123,6 +125,7 @@ Item { Layout.alignment: Qt.AlignVCenter animate: true fill: 1 + font.pointSize: root.horizontal ? Appearance.font.size.larger : Appearance.font.size.large text: { if (PowerProfiles.profile === PowerProfile.PowerSaver) return "energy_savings_leaf"; diff --git a/Modules/Updates/UpdatesWidget.qml b/Modules/Updates/UpdatesWidget.qml index 14be0cb..c1cbe32 100644 --- a/Modules/Updates/UpdatesWidget.qml +++ b/Modules/Updates/UpdatesWidget.qml @@ -9,27 +9,32 @@ CustomRect { id: root property int countUpdates: Updates.availableUpdates + required property bool horizontal property color textColor: DynamicColors.palette.m3onSurface + anchors.fill: parent color: DynamicColors.tPalette.m3surfaceContainer - implicitHeight: Config.bar.height + Appearance.padding.smallest * 2 - implicitWidth: contentRow.implicitWidth + Appearance.spacing.small * 2 + implicitHeight: horizontal ? Config.bar.height + Appearance.padding.smallest * 2 : content.implicitHeight + Appearance.spacing.small * 2 + implicitWidth: horizontal ? content.implicitWidth + Appearance.spacing.small * 2 : Config.bar.height radius: Appearance.rounding.full - RowLayout { - id: contentRow + GridLayout { + id: content anchors.centerIn: parent - spacing: Appearance.spacing.small + columnSpacing: Appearance.spacing.small + columns: root.horizontal ? -1 : 1 MaterialIcon { - font.pointSize: Appearance.font.size.larger + Layout.alignment: root.horizontal ? Qt.AlignVCenter : Qt.AlignHCenter + font.pointSize: root.horizontal ? Appearance.font.size.larger : Appearance.font.size.large text: "package_2" } CustomText { + Layout.alignment: root.horizontal ? Qt.AlignVCenter : Qt.AlignHCenter color: root.textColor - font.pointSize: Appearance.font.size.normal + font.pointSize: root.horizontal ? Appearance.font.size.normal : Appearance.font.size.larger text: root.countUpdates } } diff --git a/Modules/WindowTitle.qml b/Modules/WindowTitle.qml index 88c4cc0..62deadd 100644 --- a/Modules/WindowTitle.qml +++ b/Modules/WindowTitle.qml @@ -9,22 +9,32 @@ Item { id: root required property var bar - property color colour: DynamicColors.palette.m3primary + property color color: DynamicColors.palette.m3primary property Title current: text1 + required property bool horizontal // readonly property int maxWidth: 300 - readonly property int maxWidth: { - const otherModules = bar.children.filter(c => c.enabled && c.id && c.item !== this && c.id !== "spacer"); - const otherWidth = otherModules.reduce((acc, curr) => { - return acc + (curr.item?.nonAnimWidth ?? curr.width ?? 0); - }, 0); - return bar.width - otherWidth - bar.spacing * (bar.children.length - 1) - bar.vPadding * 2; + readonly property int maxSize: { + const otherModules = bar.children.filter(c => c.enabled && c.entryId && c.item !== this && c.entryId !== "spacer"); + const otherSize = otherModules.reduce((acc, curr) => acc + (horizontal ? (curr.item?.nonAnimWidth ?? curr.width ?? 0) : (curr.item.nonAnimHeight ?? curr.height ?? 0)), 0); + return horizontal ? bar.width - otherSize - bar.spacing * (bar.children.length - 1) - bar.vPadding * 2 : bar.height - otherSize - bar.vPadding * (bar.children.length - 1) - bar.vPadding * 4; } + anchors.centerIn: parent clip: true - implicitHeight: current.implicitHeight - implicitWidth: Math.min(current.implicitWidth, root.maxWidth) + implicitHeight: horizontal ? current.implicitHeight : current.implicitWidth + current.anchors.topMargin + implicitWidth: horizontal ? Math.min(current.implicitWidth, root.maxSize) : current.implicitHeight + current.anchors.topMargin + Behavior on implicitHeight { + enabled: !root.horizontal + + Anim { + duration: MaterialEasing.expressiveEffectsTime + easing.bezierCurve: MaterialEasing.expressiveEffects + } + } Behavior on implicitWidth { + enabled: root.horizontal + Anim { duration: MaterialEasing.expressiveEffectsTime easing.bezierCurve: MaterialEasing.expressiveEffects @@ -33,19 +43,17 @@ Item { Title { id: text1 - } Title { id: text2 - } TextMetrics { id: metrics elide: Qt.ElideRight - elideWidth: root.maxWidth + elideWidth: root.maxSize - (root.horizontal ? root.current.anchors.leftMargin : 0) font.family: "Rubik" font.pointSize: Appearance.font.size.normal text: Hypr.activeToplevel?.title ?? qsTr("Desktop") @@ -61,18 +69,32 @@ Item { component Title: CustomText { id: text - anchors.leftMargin: 7 - anchors.verticalCenter: parent.verticalCenter - color: root.colour + anchors.horizontalCenter: root.horizontal ? undefined : parent.horizontalCenter + anchors.left: root.horizontal ? parent.left : undefined + anchors.leftMargin: root.horizontal ? Appearance.spacing.small : 0 + anchors.top: root.horizontal ? undefined : parent.top + anchors.topMargin: root.horizontal ? 0 : Appearance.spacing.small + anchors.verticalCenter: root.horizontal ? parent.verticalCenter : undefined + color: root.color font.family: metrics.font.family font.pointSize: metrics.font.pointSize - height: implicitHeight + height: root.horizontal ? implicitHeight : implicitWidth opacity: root.current === this ? 1 : 0 - width: implicitWidth + width: root.horizontal ? implicitWidth : implicitHeight Behavior on opacity { Anim { } } + transform: [ + Translate { + x: !root.horizontal ? -text.implicitWidth + text.implicitHeight : 0 + }, + Rotation { + angle: root.horizontal ? 0 : 270 + origin.x: text.implicitHeight / 2 + origin.y: text.implicitHeight / 2 + } + ] } } diff --git a/Modules/Workspaces.qml b/Modules/Workspaces.qml index 91420db..f9c610d 100644 --- a/Modules/Workspaces.qml +++ b/Modules/Workspaces.qml @@ -13,41 +13,57 @@ Item { property real activeWorkspaceMargin: Math.ceil(Appearance.padding.small / 2) readonly property int effectiveActiveWorkspaceId: monitor?.activeWorkspace?.id ?? 1 + required property bool horizontal readonly property HyprlandMonitor monitor: Hyprland.monitorFor(root.screen) required property ShellScreen screen - property int workspaceButtonWidth: bgRect.implicitHeight - root.activeWorkspaceMargin * 2 + readonly property real shortSize: Config.bar.height + Appearance.padding.smaller * 2 + readonly property real size: (workspaceButtonWidth * workspacesShown) + activeWorkspaceMargin * 2 + property int workspaceButtonWidth: (horizontal ? bgRect.implicitHeight : bgRect.implicitWidth) - root.activeWorkspaceMargin * 2 property int workspaceIndexInGroup: (effectiveActiveWorkspaceId - 1) % root.workspacesShown readonly property list workspaces: Hyprland.workspaces.values.filter(w => w.monitor === root.monitor) readonly property int workspacesShown: workspaces.length - height: implicitHeight - implicitHeight: Config.bar.height + Appearance.padding.smaller * 2 - implicitWidth: (root.workspaceButtonWidth * root.workspacesShown) + root.activeWorkspaceMargin * 2 + implicitHeight: horizontal ? shortSize : size + implicitWidth: horizontal ? size : shortSize + Behavior on implicitHeight { + enabled: !root.horizontal + + Anim { + } + } Behavior on implicitWidth { + enabled: root.horizontal + Anim { } } CustomRect { + // qmllint disable Quick.anchor-combinations id: bgRect - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter + anchors.bottom: root.horizontal ? undefined : parent.bottom + anchors.horizontalCenter: root.horizontal ? undefined : parent.horizontalCenter + anchors.left: root.horizontal ? parent.left : undefined + anchors.right: root.horizontal ? parent.right : undefined + anchors.top: root.horizontal ? undefined : parent.top + anchors.verticalCenter: root.horizontal ? parent.verticalCenter : undefined color: DynamicColors.tPalette.m3surfaceContainer - implicitHeight: root.implicitHeight - ((Appearance.padding.small - 1) * 2) + implicitHeight: root.horizontal ? root.implicitHeight - ((Appearance.padding.small - 1) * 2) : 0 + implicitWidth: root.horizontal ? 0 : root.implicitWidth - ((Appearance.padding.small - 1) * 2) radius: height / 2 + // qmllint enable Quick.anchor-combinations Grid { id: grid anchors.fill: parent anchors.margins: root.activeWorkspaceMargin columnSpacing: 0 - columns: root.workspacesShown + columns: root.horizontal ? root.workspacesShown : 1 rowSpacing: 0 - rows: 1 + rows: root.horizontal ? 1 : root.workspacesShown Repeater { model: root.workspaces @@ -93,13 +109,15 @@ Item { property real indicatorPosition: Math.min(idxPair.idx1, idxPair.idx2) * root.workspaceButtonWidth + root.activeWorkspaceMargin property real indicatorThickness: root.workspaceButtonWidth - anchors.verticalCenter: parent.verticalCenter + anchors.horizontalCenter: root.horizontal ? undefined : parent.horizontalCenter + anchors.verticalCenter: root.horizontal ? parent.verticalCenter : undefined clip: true color: DynamicColors.palette.m3primary - implicitHeight: indicatorThickness - implicitWidth: indicatorLength + implicitHeight: root.horizontal ? indicatorThickness : indicatorLength + implicitWidth: root.horizontal ? indicatorLength : indicatorThickness radius: Appearance.rounding.full - x: indicatorPosition + x: root.horizontal ? indicatorPosition : 0 + y: root.horizontal ? 0 : indicatorPosition AnimatedTabIndexPair { id: idxPair @@ -113,7 +131,8 @@ Item { implicitWidth: grid.width source: grid sourceColor: DynamicColors.palette.m3onSurface - x: -indicator.x + 3 + x: root.horizontal ? -indicator.x + 3 : 0 + y: root.horizontal ? 0 : -indicator.y + 3 } } }