Properties
acceptableInput : bool
count : int //组合框中的数量
currentIndex : int //当前索引
currentText : string //当前项的文本
delegate : Component //委托
displayText : string //文本string显示在组合框中
down : bool //是否为下拉
editText : string //可编辑组合框的文本字段中的文本
editable : bool //编辑框字段是否可编辑（默认false）
flat : bool //按钮框是否为平面
highlightedIndex : int //突出显示项的索引
indicator : Item //下拉指示器项
inputMethodComposing : bool //可编辑组合框是否具有输入方法的部分文本输入
inputMethodHints : flags //为输入提供模板（预期内容）
model : model //数据模型
popup : Popup //弹出窗口
pressed : bool //是否按下按下组合框按钮
textRole : string //填充组合框模型角色
validator : Validator //可编辑组合框的输入文本验证器
import QtQuick 2.6
import QtQuick.Controls 2.1
ComboBox {
id: control
model: ["First", "Second", "Third"]
delegate: ItemDelegate {
width: control.width
contentItem: Text {
text: modelData
color: "#21be2b"
font: control.font
elide: Text.ElideRight
verticalAlignment: Text.AlignVCenter
}
highlighted: control.highlightedIndex === index
}
indicator: Canvas {
id: canvas
x: control.width - width - control.rightPadding
y: control.topPadding + (control.availableHeight - height) / 2
width: 12
height: 8
contextType: "2d"
target: control
onPressedChanged: canvas.requestPaint()
}
onPaint: {
context.reset();
context.moveTo(0, 0);
context.lineTo(width, 0);
context.lineTo(width / 2, height);
context.closePath();
context.fillStyle = control.pressed ? "#17a81a" : "#21be2b";
context.fill();
}
}
contentItem: Text {
leftPadding: 0
rightPadding: control.indicator.width + control.spacing
text: control.displayText
font: control.font
color: control.pressed ? "#17a81a" : "#21be2b"
horizontalAlignment: Text.AlignLeft
verticalAlignment: Text.AlignVCenter
elide: Text.ElideRight
}
background: Rectangle {
implicitWidth: 120
implicitHeight: 40
border.color: control.pressed ? "#17a81a" : "#21be2b"
border.width: control.visualFocus ? 2 : 1
radius: 2
}
popup: Popup {
y: control.height - 1
width: control.width
implicitHeight: contentItem.implicitHeight
padding: 1
contentItem: ListView {
clip: true
implicitHeight: contentHeight
model: control.popup.visible ? control.delegateModel : null
currentIndex: control.highlightedIndex
ScrollIndicator.vertical: ScrollIndicator { }
}
background: Rectangle {
border.color: "#21be2b"
radius: 2
}
}
}
