Add HComboBox base control

This commit is contained in:
miruka 2021-01-21 10:12:13 -04:00
parent 9967638694
commit e0cb040fd1
3 changed files with 95 additions and 0 deletions

View File

@ -0,0 +1,89 @@
import QtQuick 2.12
import QtQuick.Controls 2.12
ComboBox {
id: root
property bool error: false
property bool bordered: true
property color backgroundColor: theme.controls.textField.background
property color borderColor: theme.controls.textField.border
property color errorBorder: theme.controls.textField.errorBorder
property color focusedBorderColor: theme.controls.textField.focusedBorder
property color focusedBackgroundColor:
theme.controls.textField.focusedBackground
spacing: 0
background: Rectangle {
radius: theme.radius
color: field.activeFocus ? focusedBackgroundColor : backgroundColor
border.width: bordered ? theme.controls.textField.borderWidth : 0
border.color: borderColor
HBottomFocusLine {
show: field.activeFocus
borderHeight: theme.controls.textField.borderWidth
color: error ? errorBorder : focusedBorderColor
}
}
contentItem: HTextField {
id: field
background: null
text: root.displayText
readOnly: ! root.editable
rightPadding: root.indicator.width + theme.spacing
TapHandler {
enabled: field.readOnly
onTapped:
root.popup.visible ? root.popup.close() : root.popup.open()
}
}
indicator: HButton {
x: root.width - root.rightPadding
height: root.availableHeight
backgroundColor: "transparent"
icon.name: "combo-box-" + (root.popup.visible ? "close" : "open")
iconItem.small: true
onClicked: root.popup.visible ? root.popup.close() : root.popup.open()
}
popup: HMenu {
id: menu
y: root.height
width: root.width
modal: false
onOpened: currentIndex = root.currentIndex
enter: Transition {
HNumberAnimation {
property: "height"
from: 0
to: menu.implicitHeight
easing.type: Easing.OutQuad
}
}
exit: Transition {
HNumberAnimation {
property: "height"
to: 0
easing.type: Easing.InQuad
}
}
Repeater {
model: root.popup.visible ? root.model : null
delegate: root.delegate
}
}
delegate: HMenuItem {
text: modelData
onTriggered: root.currentIndex = model.index
}
}

View File

@ -0,0 +1,3 @@
<svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg">
<path d="m0 16.67 2.829 2.83 9.175-9.339 9.167 9.339 2.829-2.83-11.996-12.17z"/>
</svg>

After

Width:  |  Height:  |  Size: 176 B

View File

@ -0,0 +1,3 @@
<svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg">
<path d="m0 7.33 2.829-2.83 9.175 9.339 9.167-9.339 2.829 2.83-11.996 12.17z"/>
</svg>

After

Width:  |  Height:  |  Size: 175 B