mirror of
https://github.com/arthur-pbty/arthur-os.git
synced 2026-08-06 12:39:35 +02:00
135 lines
3.7 KiB
QML
135 lines
3.7 KiB
QML
import QtQuick
|
|
import QtQuick.Controls
|
|
|
|
// Themed ComboBox + popup. Anchors below the trigger, paints with the host
|
|
// shell's foreground/background palette, and inherits the shell-wide corner
|
|
// radius so nothing renders rounded when the user has set sharp corners.
|
|
Item {
|
|
id: root
|
|
|
|
property string label: ""
|
|
property string value: ""
|
|
property var options: []
|
|
property color foreground: "#cacccc"
|
|
property color background: "#101315"
|
|
property color accent: "#cacccc"
|
|
property string fontFamily: "monospace"
|
|
property int cornerRadius: 0
|
|
property int rowHeight: 28
|
|
property int popupRowHeight: 28
|
|
property bool showLabel: true
|
|
|
|
signal changed(string value)
|
|
|
|
implicitWidth: 240
|
|
implicitHeight: showLabel ? rowHeight + 18 : rowHeight
|
|
|
|
Column {
|
|
anchors.fill: parent
|
|
spacing: 4
|
|
|
|
Text {
|
|
visible: root.showLabel && root.label !== ""
|
|
text: root.label
|
|
color: Qt.darker(root.foreground, 1.4)
|
|
font.family: root.fontFamily
|
|
font.pixelSize: 10
|
|
font.bold: true
|
|
}
|
|
|
|
ComboBox {
|
|
id: combo
|
|
width: parent.width
|
|
height: root.rowHeight
|
|
font.family: root.fontFamily
|
|
font.pixelSize: 12
|
|
model: root.options
|
|
currentIndex: {
|
|
for (var i = 0; i < model.length; i++) if (model[i] === root.value) return i
|
|
return -1
|
|
}
|
|
onActivated: function(index) {
|
|
if (index >= 0 && index < model.length) root.changed(model[index])
|
|
}
|
|
|
|
background: Rectangle {
|
|
color: root.background
|
|
border.color: combo.activeFocus
|
|
? root.accent
|
|
: Qt.rgba(root.foreground.r, root.foreground.g, root.foreground.b, 0.4)
|
|
border.width: 1
|
|
radius: root.cornerRadius
|
|
}
|
|
|
|
contentItem: Text {
|
|
leftPadding: 8
|
|
rightPadding: 24
|
|
text: combo.displayText
|
|
color: root.foreground
|
|
font: combo.font
|
|
verticalAlignment: Text.AlignVCenter
|
|
}
|
|
|
|
indicator: Text {
|
|
x: combo.width - width - 8
|
|
y: combo.topPadding + (combo.availableHeight - height) / 2
|
|
text: "▾"
|
|
color: Qt.darker(root.foreground, 1.2)
|
|
font.family: root.fontFamily
|
|
font.pixelSize: 10
|
|
}
|
|
|
|
popup: Popup {
|
|
// Anchor the popup directly under the field, full width, sharp/round
|
|
// matching the shell radius. Override the native white-with-blue look.
|
|
y: combo.height
|
|
width: combo.width
|
|
implicitHeight: Math.min(contentItem.implicitHeight, root.popupRowHeight * 8)
|
|
padding: 1
|
|
|
|
background: Rectangle {
|
|
color: root.background
|
|
border.color: root.foreground
|
|
border.width: 1
|
|
radius: root.cornerRadius
|
|
}
|
|
|
|
contentItem: ListView {
|
|
clip: true
|
|
implicitHeight: contentHeight
|
|
model: combo.delegateModel
|
|
currentIndex: combo.highlightedIndex
|
|
boundsBehavior: Flickable.StopAtBounds
|
|
}
|
|
}
|
|
|
|
delegate: ItemDelegate {
|
|
required property var modelData
|
|
required property int index
|
|
|
|
width: combo.width
|
|
height: root.popupRowHeight
|
|
padding: 0
|
|
|
|
contentItem: Text {
|
|
text: String(modelData)
|
|
color: index === combo.highlightedIndex ? root.accent : root.foreground
|
|
font.family: root.fontFamily
|
|
font.pixelSize: 12
|
|
leftPadding: 10
|
|
rightPadding: 10
|
|
verticalAlignment: Text.AlignVCenter
|
|
elide: Text.ElideRight
|
|
}
|
|
|
|
background: Rectangle {
|
|
color: index === combo.highlightedIndex
|
|
? Qt.rgba(root.foreground.r, root.foreground.g, root.foreground.b, 0.12)
|
|
: "transparent"
|
|
radius: 0
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|