quickshell: single-surface bar+dropdowns for uniform blur
Make bar full-screen with exclusiveZone 30 and render dropdowns as Items inside it instead of separate PanelWindows. One surface means one uniform blur. Input mask ensures clicks pass through transparent areas. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
658bcf3703
commit
fb8854489e
1 changed files with 28 additions and 22 deletions
|
|
@ -537,7 +537,7 @@ in
|
|||
readonly property color base0B: "#${c.base0B}"
|
||||
readonly property color base0C: "#${c.base0C}"
|
||||
readonly property color base0D: "#${c.base0D}"
|
||||
readonly property color barBg: "#E6${c.base00}"
|
||||
readonly property color barBg: "#B3${c.base00}"
|
||||
readonly property color toastBg: "#E6${c.base00}"
|
||||
}
|
||||
'';
|
||||
|
|
@ -626,13 +626,28 @@ in
|
|||
top: true
|
||||
left: true
|
||||
right: true
|
||||
bottom: true
|
||||
}
|
||||
|
||||
implicitHeight: 30
|
||||
exclusiveZone: 30
|
||||
color: "transparent"
|
||||
|
||||
mask: Region {
|
||||
item: barBgRect
|
||||
Region {
|
||||
x: activeDropdown ? activeDropdown.x : 0
|
||||
y: activeDropdown ? activeDropdown.y : 0
|
||||
width: activeDropdown && activeDropdown.visible ? activeDropdown.width : 0
|
||||
height: activeDropdown && activeDropdown.visible ? activeDropdown.height : 0
|
||||
}
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
id: barBgRect
|
||||
anchors.top: parent.top
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
height: 30
|
||||
color: Theme.barBg
|
||||
}
|
||||
|
||||
|
|
@ -667,7 +682,7 @@ in
|
|||
Row {
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 6
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.verticalCenter: barBgRect.verticalCenter
|
||||
spacing: 0
|
||||
|
||||
Repeater {
|
||||
|
|
@ -706,7 +721,8 @@ in
|
|||
// Center — clock
|
||||
Text {
|
||||
id: clockText
|
||||
anchors.centerIn: parent
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
anchors.verticalCenter: barBgRect.verticalCenter
|
||||
property date now: new Date()
|
||||
text: now.toLocaleTimeString(Qt.locale(), "HH:mm")
|
||||
color: Theme.base05
|
||||
|
|
@ -738,7 +754,7 @@ in
|
|||
Row {
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: 8
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.verticalCenter: barBgRect.verticalCenter
|
||||
spacing: 10
|
||||
|
||||
// Volume
|
||||
|
|
@ -1167,7 +1183,7 @@ in
|
|||
}
|
||||
|
||||
// Reusable dropdown component
|
||||
component BarDropdown: PanelWindow {
|
||||
component BarDropdown: Item {
|
||||
id: dropdown
|
||||
property bool open: false
|
||||
property bool closing: false
|
||||
|
|
@ -1190,24 +1206,14 @@ in
|
|||
if (visible && !closing) _autoClose.restart();
|
||||
}
|
||||
|
||||
screen: bar.screen
|
||||
WlrLayershell.namespace: "quickshell-bar"
|
||||
WlrLayershell.layer: WlrLayer.Overlay
|
||||
exclusionMode: ExclusionMode.Ignore
|
||||
anchors {
|
||||
top: true
|
||||
left: !alignRight
|
||||
right: alignRight
|
||||
}
|
||||
margins.top: bar.implicitHeight
|
||||
margins.left: alignRight ? 0 : Math.min(
|
||||
bar.width - implicitWidth,
|
||||
x: alignRight ? bar.width - width : Math.min(
|
||||
bar.width - width,
|
||||
Math.max(0, dropdownX - (fullWidth + 16) / 2)
|
||||
)
|
||||
y: 30
|
||||
visible: false
|
||||
color: "transparent"
|
||||
implicitWidth: fullWidth + (alignRight ? 8 : 16)
|
||||
implicitHeight: fullHeight + 4 + (alignRight ? 8 : 0)
|
||||
width: fullWidth + (alignRight ? 8 : 16)
|
||||
height: fullHeight + 4 + (alignRight ? 8 : 0)
|
||||
|
||||
onVisibleChanged: {
|
||||
if (visible) {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue