mirror of
https://gitlab.linphone.org/BC/public/linphone-desktop.git
synced 2026-01-17 11:28:07 +00:00
9fc3caa63c
- Use of Map in Combobox. - QML Combobox: Differentiate what we are displaying and the internal Object. - Implement an equality operator for Objects (map).
238 lines
6.5 KiB
QML
238 lines
6.5 KiB
QML
import QtQuick
|
|
import QtQuick.Controls.Basic as Control
|
|
import QtQuick.Layouts
|
|
import QtQuick.Effects
|
|
import Linphone
|
|
|
|
Control.ComboBox {
|
|
id: mainItem
|
|
// Usage : each item of the model list must be {text: ..., img: ...}
|
|
// If string list, only text part of the delegate will be filled
|
|
// readonly property string currentText: selectedItemText.text
|
|
property alias listView: listView
|
|
property string constantImageSource
|
|
property int pixelSize: 14 * DefaultStyle.dp
|
|
property int weight: 400 * DefaultStyle.dp
|
|
property int leftMargin: 10 * DefaultStyle.dp
|
|
property bool oneLine: false
|
|
property bool shadowEnabled: mainItem.activeFocus || mainItem.hovered
|
|
|
|
onConstantImageSourceChanged: if (constantImageSource) selectedItemImg.source = constantImageSource
|
|
onCurrentIndexChanged: {
|
|
var item = model[currentIndex]
|
|
if (!item) item = model.getAt(currentIndex)
|
|
if (!item) return
|
|
selectedItemText.text = mainItem.textRole
|
|
? item[mainItem.textRole]
|
|
: item.text
|
|
? item.text
|
|
: item
|
|
? item
|
|
: ""
|
|
selectedItemImg.source = constantImageSource
|
|
? constantImageSource
|
|
: item.img
|
|
? item.img
|
|
: ""
|
|
}
|
|
|
|
Keys.onPressed: (event)=>{
|
|
if(!mainItem.contentItem.activeFocus && (event.key == Qt.Key_Space || event.key == Qt.Key_Enter || event.key == Qt.Key_Return)){
|
|
mainItem.popup.open()
|
|
event.accepted = true
|
|
}
|
|
}
|
|
|
|
background: Item{
|
|
Rectangle {
|
|
id: buttonBackground
|
|
anchors.fill: parent
|
|
radius: 63 * DefaultStyle.dp
|
|
color: mainItem.enabled ? DefaultStyle.grey_100 : DefaultStyle.grey_200
|
|
border.color: mainItem.enabled
|
|
? mainItem.activeFocus
|
|
? DefaultStyle.main1_500_main
|
|
: DefaultStyle.grey_200
|
|
: DefaultStyle.grey_400
|
|
}
|
|
MultiEffect {
|
|
enabled: mainItem.shadowEnabled
|
|
anchors.fill: buttonBackground
|
|
source: buttonBackground
|
|
visible: mainItem.shadowEnabled
|
|
// Crash : https://bugreports.qt.io/browse/QTBUG-124730
|
|
shadowEnabled: true //mainItem.shadowEnabled
|
|
shadowColor: DefaultStyle.grey_1000
|
|
shadowBlur: 0.5
|
|
shadowOpacity: mainItem.shadowEnabled ? 0.1 : 0.0
|
|
}
|
|
}
|
|
contentItem: Item {
|
|
anchors.fill: parent
|
|
anchors.leftMargin: 10 * DefaultStyle.dp
|
|
anchors.rightMargin: indicImage.width + 10 * DefaultStyle.dp
|
|
Image {
|
|
id: selectedItemImg
|
|
source: mainItem.constantImageSource ? mainItem.constantImageSource : ""
|
|
visible: source != ""
|
|
sourceSize.width: 24 * DefaultStyle.dp
|
|
width: visible ? 24 * DefaultStyle.dp : 0
|
|
fillMode: Image.PreserveAspectFit
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
anchors.left: parent.left
|
|
anchors.leftMargin: visible ? mainItem.leftMargin : 0
|
|
}
|
|
|
|
Text {
|
|
id: selectedItemText
|
|
color: mainItem.enabled ? DefaultStyle.main2_600 : DefaultStyle.grey_400
|
|
elide: Text.ElideRight
|
|
maximumLineCount: oneLine ? 1 : 2
|
|
wrapMode: Text.WrapAnywhere
|
|
font {
|
|
pixelSize: mainItem.pixelSize
|
|
weight: mainItem.weight
|
|
}
|
|
anchors.left: selectedItemImg.right
|
|
anchors.leftMargin: selectedItemImg.visible ? 5 * DefaultStyle.dp : 10 * DefaultStyle.dp
|
|
anchors.right: parent.right
|
|
anchors.rightMargin: 20 * DefaultStyle.dp
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
}
|
|
}
|
|
|
|
|
|
indicator: Image {
|
|
id: indicImage
|
|
z: 1
|
|
anchors.right: parent.right
|
|
anchors.rightMargin: 10 * DefaultStyle.dp
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
source: AppIcons.downArrow
|
|
width: 14 * DefaultStyle.dp
|
|
fillMode: Image.PreserveAspectFit
|
|
}
|
|
|
|
popup: Control.Popup {
|
|
id: popup
|
|
y: mainItem.height - 1
|
|
width: mainItem.width
|
|
implicitHeight: contentItem.implicitHeight
|
|
padding: 1 * DefaultStyle.dp
|
|
//height: Math.min(implicitHeight, 300)
|
|
|
|
onOpened: {
|
|
listView.positionViewAtIndex(listView.currentIndex, ListView.Center)
|
|
listView.forceActiveFocus()
|
|
}
|
|
contentItem: ListView {
|
|
id: listView
|
|
clip: true
|
|
implicitHeight: contentHeight
|
|
height: contentHeight
|
|
model: visible? mainItem.model : []
|
|
currentIndex: mainItem.highlightedIndex >= 0 ? mainItem.highlightedIndex : 0
|
|
highlightFollowsCurrentItem: true
|
|
highlightMoveDuration: -1
|
|
highlightMoveVelocity: -1
|
|
highlight: Rectangle {
|
|
width: listView.width
|
|
color: DefaultStyle.main2_200
|
|
radius: 15 * DefaultStyle.dp
|
|
y: listView.currentItem? listView.currentItem.y : 0
|
|
}
|
|
|
|
Keys.onPressed: (event)=>{
|
|
if(event.key == Qt.Key_Space || event.key == Qt.Key_Enter || event.key == Qt.Key_Return){
|
|
event.accepted = true
|
|
mainItem.currentIndex = listView.currentIndex
|
|
popup.close()
|
|
}
|
|
}
|
|
|
|
delegate: Item {
|
|
width:mainItem.width
|
|
height: mainItem.height
|
|
// anchors.left: listView.left
|
|
// anchors.right: listView.right
|
|
|
|
Image {
|
|
id: delegateImg
|
|
visible: source != ""
|
|
width: visible ? 20 * DefaultStyle.dp : 0
|
|
sourceSize.width: 20 * DefaultStyle.dp
|
|
source: typeof(modelData) != "undefined" && modelData.img ? modelData.img : ""
|
|
fillMode: Image.PreserveAspectFit
|
|
anchors.left: parent.left
|
|
anchors.leftMargin: visible ? 10 * DefaultStyle.dp : 0
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
}
|
|
|
|
Text {
|
|
text: typeof(modelData) != "undefined"
|
|
? mainItem.textRole
|
|
? modelData[mainItem.textRole]
|
|
: modelData.text
|
|
? modelData.text
|
|
: modelData
|
|
: $modelData
|
|
? mainItem.textRole
|
|
? $modelData[mainItem.textRole]
|
|
: $modelData
|
|
: ""
|
|
elide: Text.ElideRight
|
|
maximumLineCount: 1
|
|
wrapMode: Text.WrapAnywhere
|
|
font {
|
|
pixelSize: 14 * DefaultStyle.dp
|
|
weight: 400 * DefaultStyle.dp
|
|
}
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
anchors.left: delegateImg.right
|
|
anchors.leftMargin: delegateImg.visible ? 5 * DefaultStyle.dp : 10 * DefaultStyle.dp
|
|
anchors.right: parent.right
|
|
anchors.rightMargin: 20 * DefaultStyle.dp
|
|
}
|
|
|
|
MouseArea {
|
|
id: mouseArea
|
|
anchors.fill: parent
|
|
hoverEnabled: true
|
|
Rectangle {
|
|
anchors.fill: parent
|
|
opacity: 0.1
|
|
radius: 15 * DefaultStyle.dp
|
|
color: DefaultStyle.main2_500main
|
|
visible: parent.containsMouse
|
|
}
|
|
onClicked: {
|
|
mainItem.currentIndex = index
|
|
popup.close()
|
|
}
|
|
}
|
|
}
|
|
|
|
Control.ScrollIndicator.vertical: Control.ScrollIndicator { }
|
|
}
|
|
|
|
|
|
|
|
background: Item {
|
|
implicitWidth: mainItem.width
|
|
implicitHeight: 30 * DefaultStyle.dp
|
|
Rectangle {
|
|
id: cboxBg
|
|
anchors.fill: parent
|
|
radius: 15 * DefaultStyle.dp
|
|
}
|
|
MultiEffect {
|
|
anchors.fill: cboxBg
|
|
source: cboxBg
|
|
shadowEnabled: true
|
|
shadowColor: DefaultStyle.grey_1000
|
|
shadowBlur: 0.1
|
|
shadowOpacity: 0.1
|
|
}
|
|
}
|
|
}
|
|
}
|