feat: refactor bar spacing functions to use dedicated functions

This commit is contained in:
Hannes
2026-09-01 13:52:03 +02:00
parent 36486179d5
commit 764f8197fb
13 changed files with 47 additions and 36 deletions
+9 -3
View File
@@ -12,9 +12,13 @@ QtObject {
readonly property int small_spacing: 4 readonly property int small_spacing: 4
readonly property int spacing: 8 readonly property int spacing: 8
function small_spacing_fun(screenHeight) { return Math.floor(barHeight(screenHeight) / 16) } function bar_small_bar_spacing_fun(barH) { return Math.floor(barHeight(barH) / 16) }
function spacing_fun(barH) { return Math.floor(barH / 8) } function bar_spacing_fun(barH) { return Math.floor(barH / 8) }
function big_spacing_fun(barH) { return Math.floor(barH / 6) } function bar_big_spacing_fun(barH) { return Math.floor(barH / 6) }
function screen_small_bar_spacing_fun(screenHeight) { return Math.floor((screenHeight / 1080)*2) }
function screen_spacing_fun(screenHeight) { return Math.floor((screenHeight / 1080)*4) }
function screen_big_spacing_fun(screenHeight) { return Math.floor((screenHeight / 1080)*8) }
function font_size(spaceHeight) { return Math.floor(spaceHeight * 0.75) } function font_size(spaceHeight) { return Math.floor(spaceHeight * 0.75) }
function font_size_small(spaceHeight) { return Math.floor(spaceHeight * 0.625) } function font_size_small(spaceHeight) { return Math.floor(spaceHeight * 0.625) }
@@ -29,6 +33,8 @@ QtObject {
readonly property int radius: 16 readonly property int radius: 16
function small_radius_fun(barHeight) { return Math.floor(barHeight / 8) } function small_radius_fun(barHeight) { return Math.floor(barHeight / 8) }
function radius_fun(barHeight) { return Math.floor(barHeight / 4) } function radius_fun(barHeight) { return Math.floor(barHeight / 4) }
function screen_radius_fun(screenHeight) { return Math.floor((screenHeight / 1080)*4) }
function screen_big_radius_fun(screenHeight) { return Math.floor((screenHeight / 1080)*6) }
readonly property int big_radius: 10 readonly property int big_radius: 10
readonly property int border_width: 2 readonly property int border_width: 2
+5 -4
View File
@@ -9,6 +9,7 @@ PanelWindow {
id: panel id: panel
color: "transparent" color: "transparent"
visible: Hyprland.monitorFor(screen).activeWorkspace.hasFullscreen
anchors.top: true anchors.top: true
anchors.left: true anchors.left: true
@@ -40,8 +41,8 @@ PanelWindow {
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
anchors.left: parent.left anchors.left: parent.left
anchors.leftMargin: Config.big_spacing_fun(height) anchors.leftMargin: Config.bar_big_spacing_fun(height)
spacing: Config.big_spacing_fun(height) spacing: Config.bar_big_spacing_fun(height)
MenuButton {} MenuButton {}
@@ -57,7 +58,7 @@ PanelWindow {
Row { // bar widgets center Row { // bar widgets center
id: widgetsCenter id: widgetsCenter
anchors.centerIn: parent anchors.centerIn: parent
spacing: Config.big_spacing_fun(height) spacing: Config.bar_big_spacing_fun(height)
Clock {} Clock {}
@@ -69,7 +70,7 @@ PanelWindow {
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
anchors.right: parent.right anchors.right: parent.right
anchors.rightMargin: 0 anchors.rightMargin: 0
spacing: Config.big_spacing_fun(height) spacing: Config.bar_big_spacing_fun(height)
// TODO: Add bluetooth, network, audio, power, maybe HW monitor // TODO: Add bluetooth, network, audio, power, maybe HW monitor
Tray{} Tray{}
+5 -1
View File
@@ -1,5 +1,6 @@
import QtQuick import QtQuick
import Quickshell import Quickshell
import Quickshell.Hyprland
Item { Item {
@@ -8,7 +9,10 @@ Item {
model: Quickshell.screens model: Quickshell.screens
delegate: Loader { delegate: Loader {
active: true // loads object active: true // loads object
sourceComponent: Bar {screen: modelData} // creates instance of bar component sourceComponent: Bar {
screen: modelData
visible: !Hyprland.monitorFor(modelData).activeWorkspace.hasFullscreen
} // creates instance of bar component
} }
} }
} }
+4 -4
View File
@@ -6,7 +6,7 @@ import Quickshell.Hyprland
MouseArea { MouseArea {
id: audioButton id: audioButton
width: Math.max(audioRow.width + Config.spacing_fun(height)*3.5, height) width: Math.max(audioRow.width + Config.bar_spacing_fun(height)*3.5, height)
height: bar.height height: bar.height
hoverEnabled: true hoverEnabled: true
cursorShape: Qt.PointingHandCursor cursorShape: Qt.PointingHandCursor
@@ -22,9 +22,9 @@ MouseArea {
Row { Row {
id: audioRow id: audioRow
width: audioSourceText.width + audioSinkText.width + audioPercentageText.width + Config.spacing_fun(height)*2 width: audioSourceText.width + audioSinkText.width + audioPercentageText.width + Config.bar_spacing_fun(height)*2
height: parent.height height: parent.height
spacing: Config.spacing_fun(height)/2 spacing: Config.bar_spacing_fun(height)/2
anchors.centerIn: parent anchors.centerIn: parent
Text { Text {
@@ -35,7 +35,7 @@ MouseArea {
font.pixelSize: Config.iconSize(bar.height) font.pixelSize: Config.iconSize(bar.height)
font.family: Config.font font.family: Config.font
color: audioButton.containsMouse ? Colors.tertiary_fg : Colors.primary color: audioButton.containsMouse ? Colors.tertiary_fg : Colors.primary
rightPadding: Config.spacing_fun(height)*1.5 rightPadding: Config.bar_spacing_fun(height)*1.5
} }
Text { Text {
+1 -1
View File
@@ -5,7 +5,7 @@ import "../states/Audio"
MouseArea { MouseArea {
id: audioButton id: audioButton
width: Math.max(audioText.width + Config.spacing_fun(height)*2, height) width: Math.max(audioText.width + Config.bar_spacing_fun(height)*2, height)
height: bar.height height: bar.height
hoverEnabled: true hoverEnabled: true
cursorShape: Qt.PointingHandCursor cursorShape: Qt.PointingHandCursor
+3 -3
View File
@@ -6,7 +6,7 @@ import "../states/Battery"
MouseArea { MouseArea {
id: batteryButton id: batteryButton
width: expanded ? Math.max(expandedRow.width + Config.spacing_fun(height)*3, bar.height) : Math.max(batteryText.width + Config.spacing_fun(height)*2, bar.height) width: expanded ? Math.max(expandedRow.width + Config.bar_spacing_fun(height)*3, bar.height) : Math.max(batteryText.width + Config.bar_spacing_fun(height)*2, bar.height)
height: bar.height height: bar.height
hoverEnabled: true hoverEnabled: true
cursorShape: Qt.PointingHandCursor cursorShape: Qt.PointingHandCursor
@@ -63,7 +63,7 @@ MouseArea {
id: expandedRow id: expandedRow
visible: expanded visible: expanded
anchors.centerIn: parent anchors.centerIn: parent
spacing: Config.spacing_fun(batteryButton.height) spacing: Config.bar_spacing_fun(batteryButton.height)
Text { Text {
id: batteryPercentageSymbol id: batteryPercentageSymbol
@@ -121,7 +121,7 @@ MouseArea {
id: batteryPopup id: batteryPopup
anchorItem: batteryButton anchorItem: batteryButton
anchorHovered: batteryButton.containsMouse anchorHovered: batteryButton.containsMouse
spacingValue: Config.spacing_fun(batteryButton.height) spacingValue: Config.bar_spacing_fun(batteryButton.height)
radiusValue: Config.radius_fun(batteryButton.height) radiusValue: Config.radius_fun(batteryButton.height)
Column { Column {
+2 -2
View File
@@ -6,7 +6,7 @@ import "../states/Clock"
Rectangle { //workspace Rectangle { //workspace
id: clockRect id: clockRect
width: ClockState.expanded ? Math.max(dateText.width + timeText.width + Config.spacing_fun(height)*3, bar.height) : Math.max(timeText.width + Config.spacing_fun(height)*2, bar.height) width: ClockState.expanded ? Math.max(dateText.width + timeText.width + Config.bar_spacing_fun(height)*3, bar.height) : Math.max(timeText.width + Config.bar_spacing_fun(height)*2, bar.height)
height: bar.height height: bar.height
radius: Config.radius_fun(height) radius: Config.radius_fun(height)
color: clockArea.containsMouse ? Colors.tertiaryContainer : Colors.primaryContainer color: clockArea.containsMouse ? Colors.tertiaryContainer : Colors.primaryContainer
@@ -61,7 +61,7 @@ Rectangle { //workspace
id: clockPopup id: clockPopup
anchorItem: clockRect anchorItem: clockRect
anchorHovered: clockArea.containsMouse anchorHovered: clockArea.containsMouse
spacingValue: Config.spacing_fun(clockRect.height) spacingValue: Config.bar_spacing_fun(clockRect.height)
radiusValue: Config.radius_fun(clockRect.height) radiusValue: Config.radius_fun(clockRect.height)
Column { Column {
+1 -1
View File
@@ -7,7 +7,7 @@ import "../states/Idle"
MouseArea { MouseArea {
id: idleButton id: idleButton
width: Math.max(idleText.width + Config.spacing_fun(height)*2, height) width: Math.max(idleText.width + Config.bar_spacing_fun(height)*2, height)
height: bar.height height: bar.height
hoverEnabled: true hoverEnabled: true
cursorShape: Qt.PointingHandCursor cursorShape: Qt.PointingHandCursor
+2 -2
View File
@@ -5,7 +5,7 @@ import "../states/Network"
MouseArea { MouseArea {
id: networkButton id: networkButton
width: Math.max(networkText.width + Config.spacing_fun(height)*2, height) width: Math.max(networkText.width + Config.bar_spacing_fun(height)*2, height)
height: bar.height height: bar.height
hoverEnabled: true hoverEnabled: true
cursorShape: Qt.PointingHandCursor cursorShape: Qt.PointingHandCursor
@@ -37,7 +37,7 @@ MouseArea {
id: clockPopup id: clockPopup
anchorItem: networkButton anchorItem: networkButton
anchorHovered: networkButton.containsMouse anchorHovered: networkButton.containsMouse
spacingValue: Config.spacing_fun(networkButton.height) spacingValue: Config.bar_spacing_fun(networkButton.height)
radiusValue: Config.radius_fun(networkButton.height) radiusValue: Config.radius_fun(networkButton.height)
Column { Column {
+1 -1
View File
@@ -4,7 +4,7 @@ import "../../../config"
MouseArea { MouseArea {
id: powerButton id: powerButton
width: Math.max(powerText.width + Config.spacing_fun(height), height) width: Math.max(powerText.width + Config.bar_spacing_fun(height), height)
height: bar.height height: bar.height
hoverEnabled: true hoverEnabled: true
cursorShape: Qt.PointingHandCursor cursorShape: Qt.PointingHandCursor
+3 -3
View File
@@ -7,7 +7,7 @@ import "../../../config"
Row { // Workspace Row Row { // Workspace Row
id: trayRow id: trayRow
spacing: Config.small_spacing_fun(height) spacing: Config.bar_small_bar_spacing_fun(height)
Repeater { Repeater {
model: SystemTray.items model: SystemTray.items
@@ -19,8 +19,8 @@ Row { // Workspace Row
Rectangle { //trayItem Rectangle { //trayItem
id: trayItem id: trayItem
width: iconImage.width + Config.spacing_fun(bar.height) width: iconImage.width + Config.bar_spacing_fun(bar.height)
height: iconImage.height + Config.spacing_fun(bar.height) height: iconImage.height + Config.bar_spacing_fun(bar.height)
radius: Config.radius_fun(trayRow.height) radius: Config.radius_fun(trayRow.height)
color: trayArea.containsMouse ? Colors.tertiaryContainer color: trayArea.containsMouse ? Colors.tertiaryContainer
: modelData.active ? Colors.primaryContainer : modelData.active ? Colors.primaryContainer
+2 -2
View File
@@ -7,7 +7,7 @@ import "../states/Apps"
Item { Item {
id: root id: root
property real pad: Config.spacing_fun(bar.height) * 1.5 property real pad: Config.bar_spacing_fun(bar.height) * 1.5
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
@@ -39,7 +39,7 @@ Item {
Row { Row {
id: contentRow id: contentRow
spacing: Config.spacing_fun(bar.height) * 1.25 spacing: Config.bar_spacing_fun(bar.height) * 1.25
anchors.centerIn: parent anchors.centerIn: parent
Text { Text {
+9 -9
View File
@@ -8,8 +8,8 @@ Rectangle {
id: workspacesContainer id: workspacesContainer
required property HyprlandMonitor thisMonitor required property HyprlandMonitor thisMonitor
height: bar.height - (Config.spacing_fun(bar.height) * 1.5) height: bar.height - (Config.bar_spacing_fun(bar.height) * 1.5)
width: workspacesRow.width + (Config.spacing_fun(bar.height) * 2) width: workspacesRow.width + (Config.bar_spacing_fun(bar.height) * 2)
radius: height / 2 radius: height / 2
@@ -20,7 +20,7 @@ Rectangle {
Row { Row {
id: workspacesRow id: workspacesRow
anchors.centerIn: parent anchors.centerIn: parent
spacing: Config.spacing_fun(bar.height) / 2 spacing: Config.bar_spacing_fun(bar.height) / 2
Repeater { Repeater {
model: Hyprland.workspaces model: Hyprland.workspaces
@@ -30,9 +30,9 @@ Rectangle {
id: wsItem id: wsItem
property var workspaceData: modelData property var workspaceData: modelData
width: Math.max(40, wsIconsRow.width==0 ? wsNum.width + 2*Config.spacing_fun(bar.height) : wsNum.width + wsIconsRow.width + 3*Config.spacing_fun(bar.height)+Config.spacing_fun(bar.height)) width: Math.max(40, wsIconsRow.width==0 ? wsNum.width + 2*Config.bar_spacing_fun(bar.height) : wsNum.width + wsIconsRow.width + 3*Config.bar_spacing_fun(bar.height)+Config.bar_spacing_fun(bar.height))
// width: { // width: {
// var spacing = Config.spacing_fun(bar.height) // var spacing = Config.bar_spacing_fun(bar.height)
// var cw = wsNum.width // var cw = wsNum.width
// if (wsIconsRow.children.length > 0) { // if (wsIconsRow.children.length > 0) {
// cw += spacing + wsIconsRow.width + spacing // cw += spacing + wsIconsRow.width + spacing
@@ -47,7 +47,7 @@ Rectangle {
Rectangle { Rectangle {
anchors.centerIn: parent anchors.centerIn: parent
width: parent.width width: parent.width
height: parent.height - (Config.spacing_fun(bar.height) * 1.5) height: parent.height - (Config.bar_spacing_fun(bar.height) * 1.5)
radius: height / 2 radius: height / 2
@@ -79,9 +79,9 @@ Rectangle {
Row { Row {
anchors.left: parent.left anchors.left: parent.left
anchors.leftMargin: wsIconsRow.width==0 ? (wsItem.width-wsNum.width)/2 : (wsItem.width-wsNum.width-wsIconsRow.width-Config.spacing_fun(bar.height))/2 anchors.leftMargin: wsIconsRow.width==0 ? (wsItem.width-wsNum.width)/2 : (wsItem.width-wsNum.width-wsIconsRow.width-Config.bar_spacing_fun(bar.height))/2
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
spacing: Config.spacing_fun(bar.height) spacing: Config.bar_spacing_fun(bar.height)
Text { Text {
id: wsNum id: wsNum
@@ -97,7 +97,7 @@ Rectangle {
Row { Row {
id: wsIconsRow id: wsIconsRow
spacing: Config.spacing_fun(workspacesContainer.height) spacing: Config.bar_spacing_fun(workspacesContainer.height)
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
Repeater { Repeater {