feat: bar panel preset

Make presets more flexible
Fix workspaces when show windows disabled
Make rounded option for workspaces
This commit is contained in:
2 * r + 2 * t 2025-05-01 00:56:55 +10:00
parent d0211b00db
commit d54df2792a
15 changed files with 202 additions and 49 deletions

View file

@ -27,6 +27,10 @@ Singleton {
return c;
}
function on(c: color): color {
return Qt.hsla(c.hslHue, c.hslSaturation, 0.2, 1);
}
FileView {
path: `${StandardPaths.standardLocations(StandardPaths.GenericStateLocation)[0]}/caelestia/scheme/current-mode.txt`
watchChanges: true

View file

@ -10,44 +10,65 @@ Singleton {
property bool vertical: false
property Preset preset: presets.pills
readonly property Sizes sizes: Sizes {}
readonly property Workspaces workspaces: Workspaces {}
readonly property Tray tray: Tray {}
readonly property Sizes sizes: preset.sizes
readonly property Workspaces workspaces: preset.workspaces
readonly property Tray tray: preset.tray
readonly property Presets presets: Presets {}
component Sizes: QtObject {
readonly property int height: 40
readonly property int innerHeight: 30
readonly property int floatingGap: 10
readonly property int floatingGapLarge: 15
readonly property int maxLabelWidth: 600
readonly property int maxLabelHeight: 400
property int totalHeight: height
property int height: 40
property int innerHeight: 30
property int floatingGap: 10
property int floatingGapLarge: 15
property int maxLabelWidth: 600
property int maxLabelHeight: 400
}
component Workspaces: QtObject {
readonly property int shown: 10
readonly property string style: ""
readonly property bool occupiedBg: true
readonly property bool showWindows: true
readonly property bool activeTrail: !showWindows // Doesn't work well with variable sized workspaces
readonly property string label: " "
readonly property string occupiedLabel: "󰮯 "
readonly property string activeLabel: "󰮯 "
property int shown: 10
property bool rounded: true
property bool occupiedBg: true
property bool showWindows: true
property bool activeTrail: !showWindows // Doesn't work well with variable sized workspaces
property string label: " "
property string occupiedLabel: "󰮯 "
property string activeLabel: "󰮯 "
}
component Tray: QtObject {
readonly property bool recolourIcons: false
property bool recolourIcons: false
}
component Preset: QtObject {
required property string name
required property int totalHeight
property Sizes sizes: Sizes {}
property Workspaces workspaces: Workspaces {}
property Tray tray: Tray {}
}
component Presets: QtObject {
readonly property Preset pills: Preset {
name: "pills"
totalHeight: root.sizes.height + root.sizes.floatingGap
sizes: Sizes {
totalHeight: height + floatingGap
}
}
readonly property Preset panel: Preset {
name: "panel"
sizes: Sizes {
height: 30
}
workspaces: Workspaces {
rounded: false
showWindows: false
label: ""
occupiedLabel: ""
activeLabel: ""
}
tray: Tray {
recolourIcons: true
}
}
}
}

View file

@ -14,8 +14,8 @@ Variants {
screen: modelData
name: "bar"
width: BarConfig.vertical ? BarConfig.preset.totalHeight : -1
height: BarConfig.vertical ? -1 : BarConfig.preset.totalHeight
width: BarConfig.vertical ? BarConfig.sizes.totalHeight : -1
height: BarConfig.vertical ? -1 : BarConfig.sizes.totalHeight
anchors.top: true
anchors.left: true
@ -42,6 +42,12 @@ Variants {
Pills {}
}
Preset {
presetName: "panel"
Panel {}
}
}
component Preset: Loader {

118
modules/bar/Panel.qml Normal file
View file

@ -0,0 +1,118 @@
import "root:/widgets"
import "root:/config"
import "components"
import "components/workspaces"
import QtQuick
import QtQuick.Layouts
StyledRect {
id: root
function get(horiz, vert) {
return BarConfig.vertical ? vert : horiz;
}
color: Appearance.alpha(Appearance.colours.m3surface, false)
anchors.fill: parent
BoxLayout {
spacing: 0 //Appearance.padding.large
anchors.fill: parent
BoxLayout {
spacing: 0
Module {
color: Appearance.colours.mauve
OsIcon {
color: Appearance.on(Appearance.colours.mauve)
anchors.horizontalCenter: root.get(undefined, parent.horizontalCenter)
anchors.verticalCenter: root.get(parent.verticalCenter, undefined)
}
}
Module {
color: Appearance.colours.pink
ActiveWindow {
colour: Appearance.on(Appearance.colours.pink)
anchors.horizontalCenter: root.get(undefined, parent.horizontalCenter)
anchors.verticalCenter: root.get(parent.verticalCenter, undefined)
}
}
}
Item {
Layout.fillWidth: true
Layout.fillHeight: true
}
Workspaces {
vertical: BarConfig.vertical
}
Item {
Layout.fillWidth: true
Layout.fillHeight: true
}
Module {
color: Appearance.colours.green
Tray {
colour: Appearance.on(Appearance.colours.green)
anchors.horizontalCenter: root.get(undefined, parent.horizontalCenter)
anchors.verticalCenter: root.get(parent.verticalCenter, undefined)
}
}
Module {
color: Appearance.colours.yellow
Clock {
colour: Appearance.on(Appearance.colours.yellow)
anchors.horizontalCenter: root.get(undefined, parent.horizontalCenter)
anchors.verticalCenter: root.get(parent.verticalCenter, undefined)
}
}
Module {
color: Appearance.colours.peach
StatusIcons {
colour: Appearance.on(Appearance.colours.peach)
anchors.horizontalCenter: root.get(undefined, parent.horizontalCenter)
anchors.verticalCenter: root.get(parent.verticalCenter, undefined)
}
}
Module {
color: Appearance.colours.m3error
Layout.maximumWidth: BarConfig.sizes.height
Layout.maximumHeight: BarConfig.sizes.height
Power {
x: (BarConfig.sizes.height - width) / 2
color: Appearance.colours.m3onError
anchors.horizontalCenter: root.get(undefined, parent.horizontalCenter)
anchors.verticalCenter: root.get(parent.verticalCenter, undefined)
}
}
}
component Module: PaddedRect {
padding: BarConfig.vertical ? [Appearance.padding.large, 0] : [0, Appearance.padding.large]
Layout.minimumWidth: BarConfig.sizes.height
Layout.minimumHeight: BarConfig.sizes.height
}
}

View file

@ -1,10 +1,7 @@
pragma ComponentBehavior: Bound
import "root:/widgets"
import "root:/config"
import "components"
import "components/workspaces"
import Quickshell.Wayland
import QtQuick
import QtQuick.Layouts
@ -108,8 +105,6 @@ BoxLayout {
}
component Pill: PaddedRect {
id: pill
color: Appearance.alpha(Appearance.colours.m3surface, false)
radius: Appearance.rounding.full
padding: BarConfig.vertical ? [Appearance.padding.large, 0] : [0, Appearance.padding.large]

View file

@ -7,7 +7,7 @@ import QtQuick
StyledRect {
id: root
readonly property color colour: Appearance.colours.pink
property color colour: Appearance.colours.pink
animate: true
clip: true

View file

@ -6,7 +6,7 @@ import QtQuick
StyledRect {
id: root
readonly property color colour: Appearance.colours.peach
property color colour: Appearance.colours.peach
MaterialIcon {
id: icon

View file

@ -9,7 +9,7 @@ import QtQuick.Controls
StyledRect {
id: root
readonly property color colour: Appearance.colours.rosewater
property color colour: Appearance.colours.rosewater
animate: true
clip: true

View file

@ -1,8 +1,13 @@
import "root:/widgets"
import "root:/config"
import Quickshell.Services.SystemTray
import QtQuick
StyledRect {
id: root
property color colour: Appearance.colours.lavender
animate: true
clip: true
visible: width > 0 && height > 0 // To avoid warnings about being visible with no size
@ -11,7 +16,9 @@ StyledRect {
Repeater {
model: SystemTray.items
TrayItem {}
TrayItem {
colour: root.colour
}
}
}
}

View file

@ -6,9 +6,10 @@ import QtQuick
import Qt5Compat.GraphicalEffects
MouseArea {
id: item
id: root
required property SystemTrayItem modelData
required property color colour
acceptedButtons: Qt.LeftButton | Qt.RightButton
width: Appearance.font.size.smaller * 2
@ -25,7 +26,7 @@ MouseArea {
QsMenuAnchor {
id: menu
menu: item.modelData.menu
menu: root.modelData.menu
anchor.window: this.QsWindow.window
}
@ -33,7 +34,7 @@ MouseArea {
id: icon
visible: !BarConfig.tray.recolourIcons
source: item.modelData.icon
source: root.modelData.icon
anchors.fill: parent
}
@ -41,7 +42,7 @@ MouseArea {
visible: BarConfig.tray.recolourIcons
anchors.fill: icon
source: icon
color: Appearance.colours.lavender
color: root.colour
Behavior on color {
ColorAnimation {

View file

@ -26,8 +26,7 @@ Rectangle {
y: vertical ? offset + 1 : 1
width: (vertical ? BarConfig.sizes.innerHeight : size) - 2
height: (vertical ? size : BarConfig.sizes.innerHeight) - 2
color: Appearance.colours.mauve
radius: Appearance.rounding.full
radius: BarConfig.workspaces.rounded ? Appearance.rounding.full : 0
anchors.horizontalCenter: vertical ? parent.horizontalCenter : undefined
anchors.verticalCenter: vertical ? undefined : parent.verticalCenter

View file

@ -54,7 +54,7 @@ Item {
property Workspace end: root.workspaces[modelData.end - 1] ?? null
color: Appearance.alpha(Appearance.colours.m3surfaceContainerHigh, true)
radius: Appearance.rounding.full
radius: BarConfig.workspaces.rounded ? Appearance.rounding.full : 0
x: start?.x ?? 0
y: start?.y ?? 0

View file

@ -16,13 +16,14 @@ Item {
readonly property bool isWorkspace: true // Flag for finding workspace children
// Unanimated prop for others to use as reference
readonly property real size: childrenRect[vertical ? "height" : "width"] + (isOccupied ? Appearance.padding.normal : 0)
readonly property real size: childrenRect[vertical ? "height" : "width"] + (shouldPad ? Appearance.padding.normal : 0)
readonly property int ws: groupOffset + index + 1
readonly property bool isOccupied: occupied[ws] ?? false
readonly property bool shouldPad: isOccupied && BarConfig.workspaces.showWindows
Layout.preferredWidth: childrenRect.width + (isOccupied && !vertical ? Appearance.padding.normal : 0)
Layout.preferredHeight: childrenRect.height + (isOccupied && vertical ? Appearance.padding.normal : 0)
Layout.preferredWidth: childrenRect.width + (shouldPad && !vertical ? Appearance.padding.normal : 0)
Layout.preferredHeight: childrenRect.height + (shouldPad && vertical ? Appearance.padding.normal : 0)
StyledText {
id: indicator
@ -49,7 +50,7 @@ Item {
Repeater {
model: ScriptModel {
values: Hyprland.clients.filter(c => c.workspace?.id === root.ws)
values: BarConfig.workspaces.showWindows ? Hyprland.clients.filter(c => c.workspace?.id === root.ws) : []
}
MaterialIcon {

View file

@ -7,7 +7,7 @@ Item {
id: root
property alias vertical: layout.vertical
readonly property color colour: Appearance.colours.mauve
property color colour: Appearance.colours.mauve
readonly property list<Workspace> workspaces: layout.children.filter(c => c.isWorkspace)
readonly property var occupied: Hyprland.workspaces.values.reduce((acc, curr) => {
@ -43,6 +43,7 @@ Item {
}
ActiveIndicator {
color: root.colour
vertical: root.vertical
workspaces: root.workspaces
mask: layout

View file

@ -6,12 +6,12 @@ StyledRect {
property var padding: 0
readonly property int paddingTop: getRealPadding().top
readonly property int paddingRight: getRealPadding().right
readonly property int paddingBottom: getRealPadding().bottom
readonly property int paddingLeft: getRealPadding().left
readonly property int paddingX: getRealPadding().x
readonly property int paddingY: getRealPadding().y
readonly property real paddingTop: getRealPadding().top
readonly property real paddingRight: getRealPadding().right
readonly property real paddingBottom: getRealPadding().bottom
readonly property real paddingLeft: getRealPadding().left
readonly property real paddingX: getRealPadding().x
readonly property real paddingY: getRealPadding().y
function getRealPadding() {
const pad = {};