[Linux] Battery indicator: automatic color adjustment

This commit is contained in:
Tim Gromeyer
2025-04-17 09:58:59 +02:00
committed by Tim Gromeyer
parent 6ad36560a8
commit 22e511acf2

View File

@@ -9,29 +9,30 @@ Rectangle {
// Public properties // Public properties
property int batteryLevel: 50 // 0-100 property int batteryLevel: 50 // 0-100
property bool isCharging: false property bool isCharging: false
property bool darkMode: false
property string indicator: "" // "L" or "R" property string indicator: "" // "L" or "R"
// Private properties readonly property bool darkMode: {
readonly property color darkModeBackground: "#1C1C1E" return palette.window.hslLightness < palette.windowText.hslLightness;
readonly property color lightModeBackground: "#FFFFFF" }
readonly property color darkModeText: "#FFFFFF"
readonly property color lightModeText: "#000000"
readonly property color batteryLowColor: "#FF453A" readonly property color batteryLowColor: "#FF453A"
readonly property color batteryMediumColor: "#FFD60A" readonly property color batteryMediumColor: "#FFD60A"
readonly property color batteryHighColor: "#30D158" readonly property color batteryHighColor: "#30D158"
readonly property color chargingColor: "#30D158" readonly property color chargingColor: "#30D158"
readonly property color backgroundColor: palette.buttonText
readonly property color indicatorTextColor: palette.window
readonly property color textColor: palette.text
readonly property color borderColor: darkMode ? Qt.rgba(1, 1, 1, 0.3) : Qt.rgba(0, 0, 0, 0.3)
// Size parameters // Size parameters
width: 85 width: 85
height: 40 height: 40
color: "transparent" color: "transparent"
// Dynamic colors based on dark/light mode // System palette
readonly property color backgroundColor: darkMode ? darkModeBackground : lightModeBackground SystemPalette {
readonly property color textColor: darkMode ? darkModeText : lightModeText id: palette
readonly property color borderColor: darkMode ? Qt.rgba(1, 1, 1, 0.3) : Qt.rgba(0, 0, 0, 0.3) }
// Battery level color based on percentage // Battery level color based on percentage
readonly property color levelColor: { readonly property color levelColor: {
@@ -139,13 +140,13 @@ Rectangle {
Layout.preferredWidth: 16 Layout.preferredWidth: 16
Layout.preferredHeight: 16 Layout.preferredHeight: 16
radius: width / 2 radius: width / 2
color: root.darkMode ? "#FFFFFF" : "#1C1C1E" color: root.backgroundColor
Text { Text {
id: indicatorText id: indicatorText
anchors.centerIn: parent anchors.centerIn: parent
text: root.indicator text: root.indicator
color: root.darkMode ? "#1C1C1E" : "#FFFFFF" color: root.indicatorTextColor
font.pixelSize: 10 font.pixelSize: 10
font.family: "SF Pro Text" font.family: "SF Pro Text"
} }