[Linux] Use segment control for setting noise control mode (#92)

* [Linux] Enhance GUI with icons * Improve visibility * Smarter hiding of battery values * Add simple opacity based ear detection indication * Hide disconnected devices * Add airpods 3 icon * Support more devices * Better icons * Add documentation * Add segmented control * Support keyboard navigation * Fix ear detection when primary pod changes * Support up to 9 modes with the keyboard * Redisign * Use id * Use correct images * Remove duplicates * Use correct image * Remove more merge conflicts * Remove unused code * Remove unused code * Make all text readbale
2026-02-10 19:52:24 +00:00 · 2025-04-04 09:40:32 +02:00
parent fb3f948250
commit e0624ce084
5 changed files with 137 additions and 17 deletions
--- a/linux/SegmentedControl.qml
+++ b/linux/SegmentedControl.qml
@@ -0,0 +1,104 @@
+pragma ComponentBehavior: Bound
+
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+
+Control {
+    id: root
+
+    // Properties
+    property var model: ["Option 1", "Option 2"] // Default model
+    property int currentIndex: 0
+
+    // Colors using system palette
+    readonly property color backgroundColor: palette.light
+    readonly property color selectedColor: palette.highlight
+    readonly property color textColor: palette.buttonText
+    readonly property color selectedTextColor: palette.highlightedText
+
+    // System palette
+    SystemPalette {
+        id: palette
+    }
+
+    // Internal properties
+    padding: 6
+    implicitHeight: 32
+    // Removed: implicitWidth: Math.max(200, model.length * 100)
+
+    // Set focus policy to enable keyboard navigation
+    focusPolicy: Qt.StrongFocus
+    activeFocusOnTab: true
+
+    // Styling
+    background: Rectangle {
+        radius: height / 2
+        color: root.backgroundColor
+        border.width: root.activeFocus ? 1 : 0
+        border.color: root.selectedColor
+    }
+
+    contentItem: Row {
+        spacing: root.padding
+
+        Repeater {
+            model: root.model
+
+            delegate: Button {
+                id: segmentButton
+                required property int index
+                required property string modelData
+                text: modelData
+                // Removed: width: (root.availableWidth - (root.model.length - 1) * root.padding) / root.model.length
+                height: root.availableHeight
+                focusPolicy: Qt.NoFocus // Let the root control handle focus
+
+                background: Rectangle {
+                    radius: height / 2
+                    color: root.currentIndex === segmentButton.index ? root.selectedColor : "transparent"
+                    border.width: 0
+
+                    Behavior on color {
+                        ColorAnimation {
+                            duration: 600
+                            easing.type: Easing.OutQuad
+                        }
+                    }
+                }
+
+                onClicked: {
+                    if (root.currentIndex !== index) {
+                        root.currentIndex = index;
+                    }
+                }
+            }
+        }
+    }
+
+    // Handle key events for navigation
+    Keys.onPressed: event => {
+        if (event.key === Qt.Key_Left) {
+            if (root.currentIndex > 0) {
+                root.currentIndex--;
+                event.accepted = true;
+            }
+        } else if (event.key === Qt.Key_Right) {
+            if (root.currentIndex < root.model.length - 1) {
+                root.currentIndex++;
+                event.accepted = true;
+            }
+        } else if (event.key === Qt.Key_Home) {
+            root.currentIndex = 0;
+            event.accepted = true;
+        } else if (event.key === Qt.Key_End) {
+            root.currentIndex = root.model.length - 1;
+            event.accepted = true;
+        } else if (event.key >= Qt.Key_1 && event.key <= Qt.Key_9) {
+            const index = event.key - Qt.Key_1;
+            if (index <= root.model.length) {
+                root.currentIndex = index;
+                event.accepted = true;
+            }
+        }
+    }
+}