Add taskbar settings, fix audio IO

This commit is contained in:
Ly-sec 2025-07-27 19:06:45 +02:00
parent 5080c648ec
commit 8b54996d9f
9 changed files with 616 additions and 595 deletions

View file

@ -89,21 +89,25 @@ PanelWithOverlay {
ColumnLayout {
Layout.fillWidth: true
spacing: 1
Layout.maximumWidth: sinkList.width - 120 // Reserve space for the Set button
Text {
text: modelData.nickname || modelData.description || modelData.name
font.bold: true
font.pixelSize: 12
color: (Pipewire.defaultAudioSink && Pipewire.defaultAudioSink.id === modelData.id) ? Theme.accentPrimary : Theme.textPrimary
elide: Text.ElideRight
maximumLineCount: 1
Layout.fillWidth: true
}
Text {
text: modelData.description !== modelData.nickname ? modelData.description : ""
font.pixelSize: 10
color: Theme.textSecondary
elide: Text.ElideRight
maximumLineCount: 1
Layout.fillWidth: true
}
}
Item { Layout.fillWidth: true }
Rectangle {
visible: Pipewire.preferredDefaultAudioSink !== modelData
width: 60; height: 20
@ -173,21 +177,25 @@ PanelWithOverlay {
ColumnLayout {
Layout.fillWidth: true
spacing: 1
Layout.maximumWidth: sourceList.width - 120 // Reserve space for the Set button
Text {
text: modelData.nickname || modelData.description || modelData.name
font.bold: true
font.pixelSize: 12
color: (Pipewire.defaultAudioSource && Pipewire.defaultAudioSource.id === modelData.id) ? Theme.accentPrimary : Theme.textPrimary
elide: Text.ElideRight
maximumLineCount: 1
Layout.fillWidth: true
}
Text {
text: modelData.description !== modelData.nickname ? modelData.description : ""
font.pixelSize: 10
color: Theme.textSecondary
elide: Text.ElideRight
maximumLineCount: 1
Layout.fillWidth: true
}
}
Item { Layout.fillWidth: true }
Rectangle {
visible: Pipewire.preferredDefaultAudioSource !== modelData
width: 60; height: 20

View file

@ -11,11 +11,15 @@ Item {
width: runningAppsRow.width
height: Settings.settings.taskbarIconSize
// Attach custom tooltip
StyledTooltip {
id: styledTooltip
}
function getAppIcon(toplevel: Toplevel): string {
if (!toplevel)
return "";
// Try different icon resolution strategies
let icon = Quickshell.iconPath(toplevel.appId?.toLowerCase(), true);
if (!icon) {
icon = Quickshell.iconPath(toplevel.appId, true);
@ -42,7 +46,6 @@ Item {
model: ToplevelManager ? ToplevelManager.toplevels : null
delegate: Rectangle {
id: appButton
width: Settings.settings.taskbarIconSize
height: Settings.settings.taskbarIconSize
@ -51,124 +54,76 @@ Item {
border.color: isActive ? Qt.darker(Theme.accentPrimary, 1.2) : "transparent"
border.width: 1
property bool isActive: ToplevelManager.activeToplevel && ToplevelManager.activeToplevel === modelData
property bool hovered: mouseArea.containsMouse
property string appId: modelData ? modelData.appId : ""
property string appTitle: modelData ? modelData.title : ""
Behavior on color {
ColorAnimation {
duration: 150
}
ColorAnimation { duration: 150 }
}
Behavior on border.color {
ColorAnimation {
duration: 150
}
ColorAnimation { duration: 150 }
}
// App icon
IconImage {
id: appIcon
width: Math.max(12, Settings.settings.taskbarIconSize * 0.625) // 62.5% of button size (20/32 = 0.625)
width: Math.max(12, Settings.settings.taskbarIconSize * 0.625)
height: Math.max(12, Settings.settings.taskbarIconSize * 0.625)
anchors.centerIn: parent
source: getAppIcon(modelData)
smooth: true
// Fallback to first letter if no icon
visible: source.toString() !== ""
}
// Fallback text if no icon available
Text {
anchors.centerIn: parent
visible: !appIcon.visible
text: appButton.appId ? appButton.appId.charAt(0).toUpperCase() : "?"
font.family: Theme.fontFamily
font.pixelSize: Math.max(10, Settings.settings.taskbarIconSize * 0.4375) // 43.75% of button size (14/32 = 0.4375)
font.pixelSize: Math.max(10, Settings.settings.taskbarIconSize * 0.4375)
font.bold: true
color: appButton.isActive ? Theme.onAccent : Theme.textPrimary
}
// Tooltip
ToolTip {
id: tooltip
visible: mouseArea.containsMouse && !mouseArea.pressed
delay: 800
text: appTitle || appId
background: Rectangle {
color: Theme.backgroundPrimary
border.color: Theme.outline
border.width: 1
radius: 8
}
contentItem: Text {
text: tooltip.text
font.family: Theme.fontFamily
font.pixelSize: Theme.fontSizeCaption
color: Theme.textPrimary
}
}
MouseArea {
id: mouseArea
anchors.fill: parent
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
onEntered: {
styledTooltip.text = appTitle || appId;
styledTooltip.targetItem = appButton;
styledTooltip.tooltipVisible = true;
}
onExited: {
styledTooltip.tooltipVisible = false;
}
onClicked: function(mouse) {
console.log("[Taskbar] Clicked on", appButton.appId, "- Active:", appButton.isActive);
if (mouse.button === Qt.MiddleButton) {
console.log("[Taskbar] Middle-clicked on", appButton.appId);
// Example: Close the window with middle click
if (modelData && modelData.close) {
modelData.close();
} else {
console.log("[Taskbar] No close method available for:", modelData);
}
}
if (mouse.button === Qt.LeftButton) {
// Left click: Focus/activate the window
if (modelData && modelData.activate) {
modelData.activate();
} else {
console.log("[Taskbar] No activate method available for:", modelData);
}
}
}
// Right-click for additional actions
onPressed: mouse => {
if (mouse.button === Qt.RightButton) {
console.log("[Taskbar] Right-clicked on", appButton.appId);
// Example actions you can add:
// 1. Close window
// if (modelData && modelData.close) {
// modelData.close();
// }
// 2. Minimize window
// if (modelData && modelData.minimize) {
// modelData.minimize();
// }
// 3. Show context menu (needs Menu component)
// contextMenu.popup();
// context menu logic (optional)
}
}
}
// Active indicator dot
Rectangle {
visible: isActive
width: 4

View file

@ -24,7 +24,7 @@ Item {
textColor: Theme.textPrimary
StyledTooltip {
id: volumeTooltip
text: "Volume: " + volume + "%\nScroll up/down to change volume"
text: "Volume: " + volume + "%\nScroll up/down to change volume.\nLeft click to open the input/output selection."
tooltipVisible: !ioSelector.visible && volumeDisplay.containsMouse
targetItem: pillIndicator
delay: 200

View file

@ -56,7 +56,7 @@ Window {
Rectangle {
anchors.fill: parent
radius: 6
radius: 20
color: Theme.backgroundTertiary || "#222"
border.color: Theme.outline || "#444"
border.width: 1

BIN
Programs/zigbrightness Executable file

Binary file not shown.

BIN
Programs/zigstat Executable file

Binary file not shown.

View file

@ -48,6 +48,7 @@ Singleton {
property bool showActiveWindowIcon: false
property bool showSystemInfoInBar: false
property bool showCorners: true
property bool showTaskbar: true
property bool showMediaInBar: false
property bool useSWWW: false
property bool randomWallpaper: false

View file

@ -1,29 +0,0 @@
# Ghostty theme template for wallust
# Add to wallust config: ghostty = { src = "ghostty.conf", dst = "~/.config/ghostty/theme.conf" }
# And add to ghostty config: theme = "theme.conf"
palette = 0={{ color0 }}
palette = 1={{ color1 }}
palette = 2={{ color2 }}
palette = 3={{ color3 }}
palette = 4={{ color4 }}
palette = 5={{ color5 }}
palette = 6={{ color6 }}
palette = 7={{ color7 }}
palette = 8={{ color8 }}
palette = 9={{ color9 }}
palette = 10={{ color10 }}
palette = 11={{ color11 }}
palette = 12={{ color12 }}
palette = 13={{ color13 }}
palette = 14={{ color14 }}
palette = 15={{ color15 }}
background = {{ background }}
foreground = {{ foreground }}
cursor-color = {{ cursor }}
cursor-text = {{ foreground }}
selection-background = {{ color8 }}
selection-foreground = {{ foreground }}

View file

@ -14,10 +14,44 @@ Rectangle {
border.width: 0
Layout.bottomMargin: 16
ColumnLayout {
ScrollView {
id: scrollView
anchors.fill: parent
anchors.margins: 18
clip: true
padding: 12
ScrollBar.vertical: ScrollBar {
id: scrollBar
policy: ScrollBar.AsNeeded
visible: size < 1.0
opacity: (active || hovered) && size < 1.0 ? 1 : 0
width: 8
padding: 0
background: Rectangle {
color: "transparent"
}
contentItem: Rectangle {
implicitWidth: 6
radius: 3
color: scrollBar.hovered ? Theme.accentPrimary : Qt.darker(Theme.surfaceVariant, 1.2)
Behavior on opacity {
OpacityAnimator { duration: 200 }
}
}
Behavior on opacity {
OpacityAnimator { duration: 300 }
}
}
ColumnLayout {
id: mainLayout
width: scrollView.availableWidth - (scrollBar.visible ? scrollBar.width + 4 : 0)
spacing: 12
anchors.margins: 18
RowLayout {
Layout.fillWidth: true
@ -89,7 +123,6 @@ Rectangle {
visible: Settings.settings.profileImage !== ""
}
// Fallback icon
Text {
anchors.centerIn: parent
text: "person"
@ -110,10 +143,7 @@ Rectangle {
TextInput {
id: profileImageInput
anchors.left: parent.left
anchors.right: parent.right
anchors.top: parent.top
anchors.bottom: parent.bottom
anchors.fill: parent
anchors.leftMargin: 12
anchors.rightMargin: 12
anchors.topMargin: 6
@ -161,7 +191,6 @@ Rectangle {
Layout.fillWidth: true
}
// Custom Material 3 Switch
Rectangle {
id: customSwitch
width: 52
@ -216,7 +245,6 @@ Rectangle {
Layout.fillWidth: true
}
// Custom Material 3 Switch
Rectangle {
id: customSwitch2
width: 52
@ -271,7 +299,6 @@ Rectangle {
Layout.fillWidth: true
}
// Custom Material 3 Switch
Rectangle {
id: customSwitch4
width: 52
@ -307,6 +334,60 @@ Rectangle {
}
}
// Show Taskbar in Bar Setting
RowLayout {
spacing: 8
Layout.fillWidth: true
Layout.topMargin: 8
Text {
text: "Show Taskbar"
font.family: Theme.fontFamily
font.pixelSize: 13
font.bold: true
color: Theme.textPrimary
Layout.alignment: Qt.AlignVCenter
}
Item {
Layout.fillWidth: true
}
Rectangle {
id: customSwitch5
width: 52
height: 32
radius: 16
color: Settings.settings.showTaskbar ? Theme.accentPrimary : Theme.surfaceVariant
border.color: Settings.settings.showTaskbar ? Theme.accentPrimary : Theme.outline
border.width: 2
Rectangle {
id: thumb5
width: 28
height: 28
radius: 14
color: Theme.surface
border.color: Theme.outline
border.width: 1
y: 2
x: Settings.settings.showTaskbar ? customSwitch5.width - width - 2 : 2
Behavior on x {
NumberAnimation { duration: 200; easing.type: Easing.OutCubic }
}
}
MouseArea {
anchors.fill: parent
cursorShape: Qt.PointingHandCursor
onClicked: {
Settings.settings.showTaskbar = !Settings.settings.showTaskbar
}
}
}
}
// Show Media In Bar Setting
RowLayout {
spacing: 8
@ -326,7 +407,6 @@ Rectangle {
Layout.fillWidth: true
}
// Custom Material 3 Switch
Rectangle {
id: customSwitch3
width: 52
@ -380,7 +460,6 @@ Rectangle {
Layout.fillWidth: true
}
// Custom Material 3 Switch
Rectangle {
id: dimWindowsSwitch
width: 52
@ -564,5 +643,12 @@ Rectangle {
}
}
}
// Add an extra spacer at the bottom to ensure all content is reachable
Item {
Layout.fillHeight: true
Layout.minimumHeight: 20
}
}
}
}