Apply the same logic to other two pills (Brightness and Volume)

This commit is contained in:
Sébastien Atoch 2025-07-31 09:00:14 -04:00
parent d35ed0d7bb
commit c68c361af3
4 changed files with 36 additions and 28 deletions

View file

@ -40,7 +40,6 @@ Item {
pillColor: Theme.surfaceVariant pillColor: Theme.surfaceVariant
iconCircleColor: Theme.accentPrimary iconCircleColor: Theme.accentPrimary
textColor: charging ? Theme.accentPrimary : Theme.textPrimary textColor: charging ? Theme.accentPrimary : Theme.textPrimary
autoHide: false
MouseArea { MouseArea {
anchors.fill: parent anchors.fill: parent
hoverEnabled: true hoverEnabled: true
@ -76,19 +75,4 @@ Item {
delay: 1500 delay: 1500
} }
} }
Timer {
id: hideTimer
interval: 2000
running: true
onTriggered: {
pill.hide();
}
}
Component.onCompleted: {
if (isReady && battery.isLaptopBattery) {
pill.show();
}
}
} }

View file

@ -13,6 +13,7 @@ Item {
property bool isSettingBrightness: false property bool isSettingBrightness: false
property bool hasPendingSet: false property bool hasPendingSet: false
property int pendingSetValue: -1 property int pendingSetValue: -1
property bool firstChange: true
width: pill.width width: pill.width
height: pill.height height: pill.height
@ -30,11 +31,17 @@ Item {
previousBrightness = brightness previousBrightness = brightness
brightness = val brightness = val
pill.text = brightness + "%" pill.text = brightness + "%"
if (firstChange) {
firstChange = false;
}
else {
pill.show() pill.show()
} }
} }
} }
} }
}
function getBrightness() { function getBrightness() {
if (isSettingBrightness) { if (isSettingBrightness) {
@ -94,14 +101,19 @@ Item {
iconCircleColor: Theme.accentPrimary iconCircleColor: Theme.accentPrimary
iconTextColor: Theme.backgroundPrimary iconTextColor: Theme.backgroundPrimary
textColor: Theme.textPrimary textColor: Theme.textPrimary
MouseArea { MouseArea {
anchors.fill: parent anchors.fill: parent
hoverEnabled: true hoverEnabled: true
onEntered: { onEntered: {
getBrightness() getBrightness()
brightnessTooltip.tooltipVisible = true brightnessTooltip.tooltipVisible = true
pill.show()
}
onExited: {
brightnessTooltip.tooltipVisible = false
pill.hide()
} }
onExited: brightnessTooltip.tooltipVisible = false
onWheel: function(wheel) { onWheel: function(wheel) {
const delta = wheel.angleDelta.y > 0 ? 5 : -5 const delta = wheel.angleDelta.y > 0 ? 5 : -5
@ -114,14 +126,11 @@ Item {
text: "Brightness: " + brightness + "%" text: "Brightness: " + brightness + "%"
tooltipVisible: false tooltipVisible: false
targetItem: pill targetItem: pill
delay: 200 delay: 1500
} }
} }
Component.onCompleted: { Component.onCompleted: {
getBrightness() getBrightness()
if (brightness >= 0) {
pill.show()
}
} }
} }

View file

@ -8,6 +8,7 @@ Item {
id: volumeDisplay id: volumeDisplay
property var shell property var shell
property int volume: 0 property int volume: 0
property bool firstChange: true
width: pillIndicator.width width: pillIndicator.width
height: pillIndicator.height height: pillIndicator.height
@ -23,13 +24,14 @@ Item {
iconCircleColor: Theme.accentPrimary iconCircleColor: Theme.accentPrimary
iconTextColor: Theme.backgroundPrimary iconTextColor: Theme.backgroundPrimary
textColor: Theme.textPrimary textColor: Theme.textPrimary
autoHide: true
StyledTooltip { StyledTooltip {
id: volumeTooltip id: volumeTooltip
text: "Volume: " + volume + "%\nScroll up/down to change volume.\nLeft click to open the input/output selection." text: "Volume: " + volume + "%\nScroll up/down to change volume.\nLeft click to open the input/output selection."
tooltipVisible: !ioSelector.visible && volumeDisplay.containsMouse tooltipVisible: !ioSelector.visible && volumeDisplay.containsMouse
targetItem: pillIndicator targetItem: pillIndicator
delay: 200 delay: 1500
} }
MouseArea { MouseArea {
@ -57,16 +59,21 @@ Item {
pillIndicator.icon = shell.defaultAudioSink && shell.defaultAudioSink.audio && shell.defaultAudioSink.audio.muted pillIndicator.icon = shell.defaultAudioSink && shell.defaultAudioSink.audio && shell.defaultAudioSink.audio.muted
? "volume_off" ? "volume_off"
: (volume === 0 ? "volume_off" : (volume < 30 ? "volume_down" : "volume_up")); : (volume === 0 ? "volume_off" : (volume < 30 ? "volume_down" : "volume_up"));
if (firstChange) {
firstChange = false
}
else {
pillIndicator.show(); pillIndicator.show();
} }
} }
} }
} }
}
Component.onCompleted: { Component.onCompleted: {
if (shell && shell.volume !== undefined) { if (shell && shell.volume !== undefined) {
volume = Math.max(0, Math.min(100, shell.volume)); volume = Math.max(0, Math.min(100, shell.volume));
pillIndicator.show();
} }
} }
@ -75,8 +82,16 @@ Item {
hoverEnabled: true hoverEnabled: true
acceptedButtons: Qt.NoButton acceptedButtons: Qt.NoButton
propagateComposedEvents: true propagateComposedEvents: true
onEntered: volumeDisplay.containsMouse = true onEntered: {
onExited: volumeDisplay.containsMouse = false volumeDisplay.containsMouse = true
pillIndicator.autoHide = false;
pillIndicator.show()
}
onExited: {
volumeDisplay.containsMouse = false
pillIndicator.autoHide = true;
pillIndicator.hide()
}
cursorShape: Qt.PointingHandCursor cursorShape: Qt.PointingHandCursor
onWheel: (wheel) => { onWheel: (wheel) => {
if (!shell) return; if (!shell) return;

View file

@ -15,7 +15,7 @@ Item {
property int pillHeight: 22 property int pillHeight: 22
property int iconSize: 22 property int iconSize: 22
property int pillPaddingHorizontal: 14 property int pillPaddingHorizontal: 14
property bool autoHide: true property bool autoHide: false
// Internal state // Internal state
property bool showPill: false property bool showPill: false