From f2961f9b6a2bdd76625c5093dba9f88a0c9cfacb Mon Sep 17 00:00:00 2001 From: Bogdan Date: Sat, 30 May 2026 08:02:15 +0300 Subject: [PATCH] feat(DiskUsage): updated dynamic width options for DiskUsage widget (#2517) * feat(WidgetsTabSection.qml): added dynamic width and static padding for DiskUsage * feat(DiskUsage.qml):added functionality for dynamic width and static padding, also changed spacing to work like in cpu and ram monitor. Now they look complete and same * fix(DiskUsage): restore display modes & formatting --------- Co-authored-by: purian23 --- .../Modules/DankBar/Widgets/DiskUsage.qml | 86 ++++++++++++------- quickshell/Modules/Settings/WidgetsTab.qml | 2 +- .../Modules/Settings/WidgetsTabSection.qml | 2 +- 3 files changed, 59 insertions(+), 31 deletions(-) diff --git a/quickshell/Modules/DankBar/Widgets/DiskUsage.qml b/quickshell/Modules/DankBar/Widgets/DiskUsage.qml index b6812e6e..f667f338 100644 --- a/quickshell/Modules/DankBar/Widgets/DiskUsage.qml +++ b/quickshell/Modules/DankBar/Widgets/DiskUsage.qml @@ -12,6 +12,7 @@ BasePill { property int diskUsageMode: (widgetData && widgetData.diskUsageMode !== undefined) ? widgetData.diskUsageMode : 0 property bool isHovered: mouseArea.containsMouse property bool isAutoHideBar: false + property bool minimumWidth: (widgetData && widgetData.minimumWidth !== undefined) ? widgetData.minimumWidth : true property var selectedMount: { if (!DgopService.diskMounts || DgopService.diskMounts.length === 0) { @@ -69,6 +70,8 @@ BasePill { } Connections { + target: SettingsData + function onWidgetDataChanged() { root.mountPath = Qt.binding(() => { return (root.widgetData && root.widgetData.mountPath !== undefined) ? root.widgetData.mountPath : "/"; @@ -96,14 +99,12 @@ BasePill { return DgopService.diskMounts[0] || null; }); } - - target: SettingsData } content: Component { Item { implicitWidth: root.isVerticalOrientation ? (root.widgetThickness - root.horizontalPadding * 2) : diskContent.implicitWidth - implicitHeight: root.isVerticalOrientation ? diskColumn.implicitHeight : (root.widgetThickness - root.horizontalPadding * 2) + implicitHeight: root.isVerticalOrientation ? diskColumn.implicitHeight : diskContent.implicitHeight Column { id: diskColumn @@ -118,10 +119,12 @@ BasePill { if (root.diskUsagePercent > 90) { return Theme.tempDanger; } + if (root.diskUsagePercent > 75) { return Theme.tempWarning; } - return Theme.surfaceText; + + return Theme.widgetIconColor; } anchors.horizontalCenter: parent.horizontalCenter } @@ -154,24 +157,28 @@ BasePill { id: diskContent visible: !root.isVerticalOrientation anchors.centerIn: parent - spacing: 3 + spacing: Theme.spacingXS DankIcon { + id: diskIcon name: "storage" size: Theme.barIconSize(root.barThickness, undefined, root.barConfig?.maximizeWidgetIcons, root.barConfig?.iconScale) color: { if (root.diskUsagePercent > 90) { return Theme.tempDanger; } + if (root.diskUsagePercent > 75) { return Theme.tempWarning; } - return Theme.surfaceText; + + return Theme.widgetIconColor; } anchors.verticalCenter: parent.verticalCenter } StyledText { + id: mountText text: { if (!root.selectedMount) { return "--"; @@ -182,32 +189,20 @@ BasePill { color: Theme.widgetTextColor anchors.verticalCenter: parent.verticalCenter horizontalAlignment: Text.AlignLeft + verticalAlignment: Text.AlignVCenter elide: Text.ElideNone + wrapMode: Text.NoWrap } - StyledText { - text: { - if (root.diskUsagePercent === undefined || root.diskUsagePercent === null || root.diskUsagePercent === 0) { - return "--%"; - } - if (!root.selectedMount) - return "--%"; - switch (root.diskUsageMode) { - case 1: - return root.selectedMount.size || "--"; - case 2: - return root.selectedMount.avail || "--"; - case 3: - return (root.selectedMount.avail || "--") + " / " + (root.selectedMount.size || "--"); - default: - return root.diskUsagePercent.toFixed(0) + "%"; - } - } - font.pixelSize: Theme.barTextSize(root.barThickness, root.barConfig?.fontScale, root.barConfig?.maximizeWidgetText) - color: Theme.widgetTextColor + Item { + id: textBox anchors.verticalCenter: parent.verticalCenter - horizontalAlignment: Text.AlignLeft - elide: Text.ElideNone + + implicitWidth: root.minimumWidth ? Math.max(diskBaseline.width, diskCurrent.width) : diskCurrent.width + implicitHeight: diskText.implicitHeight + + width: implicitWidth + height: implicitHeight StyledTextMetrics { id: diskBaseline @@ -225,7 +220,40 @@ BasePill { } } - width: Math.max(diskBaseline.width, paintedWidth) + StyledTextMetrics { + id: diskCurrent + font.pixelSize: Theme.barTextSize(root.barThickness, root.barConfig?.fontScale, root.barConfig?.maximizeWidgetText) + text: diskText.text + } + + StyledText { + id: diskText + text: { + if (root.diskUsagePercent === undefined || root.diskUsagePercent === null || root.diskUsagePercent === 0) { + return "--%"; + } + if (!root.selectedMount) + return "--%"; + switch (root.diskUsageMode) { + case 1: + return root.selectedMount.size || "--"; + case 2: + return root.selectedMount.avail || "--"; + case 3: + return (root.selectedMount.avail || "--") + " / " + (root.selectedMount.size || "--"); + default: + return root.diskUsagePercent.toFixed(0) + "%"; + } + } + font.pixelSize: Theme.barTextSize(root.barThickness, root.barConfig?.fontScale, root.barConfig?.maximizeWidgetText) + color: Theme.widgetTextColor + + anchors.fill: parent + horizontalAlignment: Text.AlignHCenter + verticalAlignment: Text.AlignVCenter + elide: Text.ElideNone + wrapMode: Text.NoWrap + } } } } diff --git a/quickshell/Modules/Settings/WidgetsTab.qml b/quickshell/Modules/Settings/WidgetsTab.qml index a489e39c..7647d887 100644 --- a/quickshell/Modules/Settings/WidgetsTab.qml +++ b/quickshell/Modules/Settings/WidgetsTab.qml @@ -404,7 +404,7 @@ Item { widgetObj.mountPath = "/"; widgetObj.diskUsageMode = 0; } - if (widgetId === "cpuUsage" || widgetId === "memUsage" || widgetId === "cpuTemp" || widgetId === "gpuTemp") + if (widgetId === "cpuUsage" || widgetId === "memUsage" || widgetId === "cpuTemp" || widgetId === "gpuTemp" || widgetId === "diskUsage") widgetObj.minimumWidth = true; if (widgetId === "memUsage") widgetObj.showInGb = false; diff --git a/quickshell/Modules/Settings/WidgetsTabSection.qml b/quickshell/Modules/Settings/WidgetsTabSection.qml index 4576f3ff..6f004ee4 100644 --- a/quickshell/Modules/Settings/WidgetsTabSection.qml +++ b/quickshell/Modules/Settings/WidgetsTabSection.qml @@ -320,7 +320,7 @@ Column { DankActionButton { id: minimumWidthButton buttonSize: 28 - visible: modelData.id === "cpuUsage" || modelData.id === "memUsage" || modelData.id === "cpuTemp" || modelData.id === "gpuTemp" + visible: modelData.id === "cpuUsage" || modelData.id === "memUsage" || modelData.id === "cpuTemp" || modelData.id === "gpuTemp" || modelData.id === "diskUsage" iconName: "straighten" iconSize: 16 iconColor: (modelData.minimumWidth !== undefined ? modelData.minimumWidth : true) ? Theme.primary : Theme.outline