quickshell: sliding selection pill for power profile buttons

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
rope 2026-06-12 10:23:35 +01:00
parent bfcc54d0db
commit 9a38cacc05

View file

@ -1749,54 +1749,80 @@ in
font.pixelSize: 11
}
Row {
Item {
width: parent.width
spacing: 4
height: 36
Repeater {
model: [
{ name: "power-saver", profile: PowerProfile.PowerSaver, label: "\u{f0425}", tip: "Saver" },
{ name: "balanced", profile: PowerProfile.Balanced, label: "\u{f0376}", tip: "Balanced" },
{ name: "performance", profile: PowerProfile.Performance, label: "\u{f0e0e}", tip: "Performance" }
]
// Sliding selection pill glides between
// profiles instead of each button flipping.
Rectangle {
id: profilePill
readonly property int selIdx:
batteryWidget.powerProfile === "power-saver" ? 0
: batteryWidget.powerProfile === "performance" ? 2
: 1
width: (parent.width - 8) / 3
height: 36
radius: 6
color: Theme.base02
border.width: 1
border.color: Theme.base03
x: selIdx * (width + 4)
Behavior on x {
NumberAnimation { duration: 250; easing.type: Easing.OutExpo }
}
}
Rectangle {
required property var modelData
width: (parent.width - 8) / 3
height: 36
radius: 6
color: batteryWidget.powerProfile === modelData.name
? Theme.base02 : profMouse.containsMouse
? Theme.base01 : "transparent"
Behavior on color { ColorAnimation { duration: 120 } }
border.width: batteryWidget.powerProfile === modelData.name ? 1 : 0
border.color: Theme.base03
Row {
anchors.fill: parent
spacing: 4
Column {
anchors.centerIn: parent
spacing: 1
Text {
anchors.horizontalCenter: parent.horizontalCenter
text: modelData.label
color: batteryWidget.powerProfile === modelData.name
? Theme.base0D : Theme.base05
font.family: Theme.fontFamily
font.pixelSize: 14
Repeater {
model: [
{ name: "power-saver", profile: PowerProfile.PowerSaver, label: "\u{f0425}", tip: "Saver" },
{ name: "balanced", profile: PowerProfile.Balanced, label: "\u{f0376}", tip: "Balanced" },
{ name: "performance", profile: PowerProfile.Performance, label: "\u{f0e0e}", tip: "Performance" }
]
Rectangle {
required property var modelData
width: (parent.width - 8) / 3
height: 36
radius: 6
color: profMouse.containsMouse && batteryWidget.powerProfile !== modelData.name
? Theme.base01 : "transparent"
Behavior on color { ColorAnimation { duration: 120 } }
Column {
anchors.centerIn: parent
spacing: 1
Text {
anchors.horizontalCenter: parent.horizontalCenter
text: modelData.label
color: batteryWidget.powerProfile === modelData.name
? Theme.base0D : Theme.base05
Behavior on color { ColorAnimation { duration: 200 } }
font.family: Theme.fontFamily
font.pixelSize: 14
}
Text {
anchors.horizontalCenter: parent.horizontalCenter
text: modelData.tip
color: batteryWidget.powerProfile === modelData.name
? Theme.base05 : Theme.base04
Behavior on color { ColorAnimation { duration: 200 } }
font.family: Theme.fontFamily
font.pixelSize: 9
}
}
Text {
anchors.horizontalCenter: parent.horizontalCenter
text: modelData.tip
color: Theme.base04
font.family: Theme.fontFamily
font.pixelSize: 9
}
}
MouseArea {
id: profMouse
anchors.fill: parent
hoverEnabled: true
onClicked: PowerProfiles.profile = modelData.profile
MouseArea {
id: profMouse
anchors.fill: parent
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
onClicked: PowerProfiles.profile = modelData.profile
}
}
}
}