client-qml: add initial commit
Change-Id: I32bfdd2a618aa7ac6181da2697e241667b010aab
diff --git a/src/settingsview/components/SettingParaCombobox.qml b/src/settingsview/components/SettingParaCombobox.qml
new file mode 100644
index 0000000..b691acb
--- /dev/null
+++ b/src/settingsview/components/SettingParaCombobox.qml
@@ -0,0 +1,110 @@
+/*
+ * Copyright (C) 2019-2020 by Savoir-faire Linux
+ * Author: Yang Wang <yang.wang@savoirfairelinux.com>
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation; either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import QtQuick 2.15
+import QtQuick.Window 2.15
+import QtQuick.Controls 2.15
+import QtQuick.Controls.Universal 2.12
+import QtQuick.Layouts 1.3
+import QtGraphicalEffects 1.14
+import QtQuick.Controls.Styles 1.4
+
+ComboBox {
+ id: control
+
+ delegate: ItemDelegate {
+ width: control.width
+ contentItem: Text {
+ text: {
+ var currentItem = control.delegateModel.items.get(index)
+ return currentItem.model[control.textRole].toString()
+ }
+ color: "black"
+ 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"
+
+ Connections {
+ target: control
+ function 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: "black"
+ verticalAlignment: Text.AlignVCenter
+ elide: Text.ElideRight
+ }
+
+ background: Rectangle {
+ implicitWidth: 120
+ implicitHeight: 40
+ border.color: "white"
+ 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.delegateModel
+ currentIndex: control.highlightedIndex
+
+ ScrollIndicator.vertical: ScrollIndicator { }
+ }
+
+ background: Rectangle {
+ border.color: "gray"
+ radius: 2
+ }
+ }
+}