fix: adjust combobox to match our theme

2025-04-11 14:19:45 -07:00
parent a6256ecb00
commit 05005143e5
1 changed files with 104 additions and 2 deletions
@@ -1,9 +1,111 @@
 import QtQuick
 import QtQuick.Controls.Basic
 import QtQuick.Controls.impl // Needed for features like the Control.blend() function
+import QtQuick.Templates as T
 import DesignSystem

-ComboBox {
+T.ComboBox {
  id: control
-  editable: true
+
+  implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
+  implicitContentWidth + leftPadding + rightPadding)
+  implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
+  implicitContentHeight + topPadding + bottomPadding,
+  implicitIndicatorHeight + topPadding + bottomPadding)
+
+  leftPadding: padding + (!control.mirrored || !indicator || !indicator.visible ? 0 : indicator.width + spacing)
+  rightPadding: padding + (control.mirrored || !indicator || !indicator.visible ? 0 : indicator.width + spacing)
+
+  delegate: ItemDelegate {
+    required property var model
+    required property int index
+
+    width: ListView.view.width
+    text: model[control.textRole]
+    palette.text: control.palette.text
+    palette.highlightedText: control.palette.highlightedText
+    font.weight: control.currentIndex === index ? Font.DemiBold : Font.Normal
+    highlighted: control.highlightedIndex === index
+    hoverEnabled: control.hoverEnabled
+  }
+
+  indicator: ColorImage {
+    x: control.mirrored ? control.padding : control.width - width - control.padding
+    y: control.topPadding + (control.availableHeight - height) / 2
+    color: control.palette.dark
+    defaultColor: "#353637"
+    source: "qrc:/qt-project.org/imports/QtQuick/Controls/Basic/images/double-arrow.png"
+    opacity: enabled ? 1 : 0.3
+  }
+
+  contentItem: T.TextField {
+    leftPadding: !control.mirrored ? 12 : control.editable && activeFocus ? 3 : 1
+    rightPadding: control.mirrored ? 12 : control.editable && activeFocus ? 3 : 1
+    topPadding: 6 - control.padding
+    bottomPadding: 6 - control.padding
+
+    text: control.editable ? control.editText : control.displayText
+
+    enabled: control.editable
+    autoScroll: control.editable
+    readOnly: control.down
+    inputMethodHints: control.inputMethodHints
+    validator: control.validator
+    selectByMouse: control.selectTextByMouse
+
+    color: control.editable ? control.palette.text : control.palette.buttonText
+    selectionColor: control.palette.highlight
+    selectedTextColor: control.palette.highlightedText
+    verticalAlignment: Text.AlignVCenter
+
+    background: Rectangle {
+      visible: control.enabled && control.editable && !control.flat
+      border.width: parent && parent.activeFocus ? 2 : 1
+      border.color: parent && parent.activeFocus ? control.palette.highlight : control.palette.button
+      color: control.palette.base
+    }
+  }
+
+  background: Rectangle {
+    implicitWidth: 140
+    implicitHeight: 40
+
+    color: control.down ? control.palette.mid : control.palette.button
+    border.color: control.palette.highlight
+    border.width: !control.editable && control.visualFocus ? 2 : 0
+    visible: !control.flat || control.down
+
+    radius: Theme.radius
+  }
+
+  popup: T.Popup {
+    y: control.height
+    width: control.width
+    height: Math.min(contentItem.implicitHeight, control.Window.height - topMargin - bottomMargin)
+    topMargin: 6
+    bottomMargin: 6
+    palette: control.palette
+
+    contentItem: ListView {
+      clip: true
+      implicitHeight: contentHeight
+      model: control.delegateModel
+      currentIndex: control.highlightedIndex
+      highlightMoveDuration: 0
+
+      Rectangle {
+        z: 10
+        width: parent.width
+        height: parent.height
+        color: "transparent"
+        border.color: control.palette.mid
+      }
+
+      T.ScrollIndicator.vertical: ScrollIndicator { }
+    }
+
+    background: Rectangle {
+      color: control.palette.window
+    }
+  }
 }