diff --git a/src/modules/keyboardq/data/pan-end-symbolic.svg b/src/modules/keyboardq/data/pan-end-symbolic.svg
new file mode 100644
index 0000000000000000000000000000000000000000..0a398fc032e3be68dfd451627f3c49ff76659a77
--- /dev/null
+++ b/src/modules/keyboardq/data/pan-end-symbolic.svg
@@ -0,0 +1,15 @@
+<?xml version='1.0' encoding='UTF-8' standalone='no'?>
+<svg height="16" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" version="1.1" width="16" xmlns="http://www.w3.org/2000/svg" enable-background="new">
+ <metadata id="metadata90"/>
+ <defs id="defs7386">
+ <linearGradient id="linearGradient5606" osb:paint="solid">
+ <stop id="stop5608"/>
+ </linearGradient>
+ <filter inkscape:collect="always" color-interpolation-filters="sRGB" id="filter7554">
+ <feBlend inkscape:collect="always" id="feBlend7556" in2="BackgroundImage" mode="darken"/>
+ </filter>
+ </defs>
+ <g inkscape:groupmode="layer" id="layer12" inkscape:label="actions" transform="translate(-445.0002,-129)">
+ <path inkscape:connector-curvature="0" d="m 451.0002,142 5,-5 -5,-5 z" id="path6412" sodipodi:nodetypes="cccc" fill="#555555"/>
+ </g>
+</svg>
diff --git a/src/modules/keyboardq/keyboardq.qml b/src/modules/keyboardq/keyboardq.qml
index be96ec85ae9d060667a3ae6441e4adeabc340da2..70ddeed251842866946c3565868d806ca0fa54f9 100644
--- a/src/modules/keyboardq/keyboardq.qml
+++ b/src/modules/keyboardq/keyboardq.qml
@@ -12,7 +12,7 @@ import io.calamares.ui 1.0
import QtQuick 2.15
import QtQuick.Controls 2.15
-import QtQuick.Window 2.14
+import QtQuick.Window 2.15
import QtQuick.Layouts 1.3
import org.kde.kirigami 2.7 as Kirigami
@@ -52,6 +52,7 @@ Item {
Rectangle {
id: backgroundItem
anchors.fill: parent
+ width: 800
color: backgroundColor
Label {
@@ -62,199 +63,244 @@ Item {
font.bold: true
}
- Label {
- id: intro
- anchors.horizontalCenter: parent.horizontalCenter
- anchors.top: header.bottom
- color: textColor
- horizontalAlignment: Text.AlignHCenter
- width: parent.width / 1.2
- wrapMode: Text.WordWrap
- text: ( config.prettyStatus)
+ Drawer {
+ id: drawer
+ width: 0.4 * backgroundItem.width
+ height: backgroundItem.height
+ edge: Qt.RightEdge
+
+ ScrollView {
+ id: scroll1
+ anchors.fill: parent
+ ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
+
+ ListView {
+ id: models
+ focus: true
+ clip: true
+ boundsBehavior: Flickable.StopAtBounds
+ width: parent.width
+
+ model: config.keyboardModelsModel
+ Component.onCompleted: positionViewAtIndex(model.currentIndex, ListView.Center)
+ currentIndex: model.currentIndex
+ delegate: ItemDelegate {
+
+ property variant currentModel: model
+ hoverEnabled: true
+ width: 0.4 * backgroundItem.width
+ implicitHeight: 24
+ highlighted: ListView.isCurrentItem
+ Label {
+ Layout.fillHeight: true
+ Layout.fillWidth: true
+ horizontalAlignment: Text.AlignHCenter
+ width: parent.width
+ height: 24
+ color: highlighted ? "#eff0f1" : "#1F1F1F"
+ text: model.label
+ background: Rectangle {
+
+ color: highlighted || hovered ? "#3498DB" : "#ffffff"
+ opacity: highlighted || hovered ? 0.5 : 0.9
+ }
+
+ MouseArea {
+ hoverEnabled: true
+ anchors.fill: parent
+ cursorShape: Qt.PointingHandCursor
+ onClicked: {
+ models.currentIndex = index
+ drawer.close()
+ }
+ }
+ }
+ }
+ onCurrentItemChanged: { config.keyboardModels = model[currentIndex] } /* This works because model is a stringlist */
+ }
+ }
}
- RowLayout {
- id: models
- anchors.top: intro.bottom
+ Rectangle {
+ id: modelLabel
+ anchors.top: header.bottom
anchors.topMargin: 10
anchors.horizontalCenter: parent.horizontalCenter
- width: parent.width /1.5
- spacing: 10
+ width: parent.width / 1.5
+ height: 36
+ color: mouseBar.containsMouse ? "#eff0f1" : "transparent";
- Label {
- Layout.alignment: Qt.AlignCenter
- text: qsTr("Keyboard Model:")
- color: textColor
- font.bold: true
- }
+ MouseArea {
+ id: mouseBar
+ anchors.fill: parent;
+ cursorShape: Qt.PointingHandCursor
+ hoverEnabled: true
- ComboBox {
- Layout.fillWidth: true
- textRole: "label"
- model: config.keyboardModelsModel
- currentIndex: model.currentIndex
- onCurrentIndexChanged: config.keyboardModels = currentIndex
+ onClicked: {
+ drawer.open()
+ }
+ Text {
+ anchors.centerIn: parent
+ text: qsTr("<b>Keyboard Model: </b>") + models.currentItem.currentModel.label
+ color: textColor
+ }
+ Image {
+ source: "data/pan-end-symbolic.svg"
+ anchors.centerIn: parent
+ anchors.horizontalCenterOffset : parent.width / 2.5
+ fillMode: Image.PreserveAspectFit
+ height: 22
+ }
}
}
- StackView {
+ RowLayout {
id: stack
- anchors.top: models.bottom
+ anchors.top: modelLabel.bottom
anchors.topMargin: 10
- anchors.left: parent.left
- anchors.right: parent.right
- anchors.bottom: parent.bottom
- clip: true
+ anchors.horizontalCenter: parent.horizontalCenter
+ width: parent.width / 1.1
+ spacing: 10
- initialItem: Item {
+ ListView {
+ id: layouts
- ListView {
- id: layouts
+ ScrollBar.vertical: ScrollBar {
+ active: true
+ }
- ScrollBar.vertical: ScrollBar {
- active: true
+ Layout.preferredWidth: parent.width / 2
+ height: 220
+ focus: true
+ clip: true
+ boundsBehavior: Flickable.StopAtBounds
+ spacing: 2
+ headerPositioning: ListView.OverlayHeader
+ header: Rectangle{
+ height: 24
+ width: parent.width
+ z: 2
+ color:backgroundColor
+ Text {
+ text: qsTr("Layout")
+ anchors.centerIn: parent
+ color: textColor
+ font.bold: true
}
+ }
- width: parent.width / 2
- height: 200
- anchors.horizontalCenter: parent.horizontalCenter
- focus: true
- clip: true
- boundsBehavior: Flickable.StopAtBounds
- spacing: 2
+ Rectangle {
+ z: parent.z - 1
+ anchors.fill: parent
+ color: listBackgroundColor
+ opacity: 0.7
+ }
- Rectangle {
- z: parent.z - 1
- anchors.fill: parent
- color: listBackgroundColor
- opacity: 0.7
- }
+ model: config.keyboardLayoutsModel
+ currentIndex: model.currentIndex
+ Component.onCompleted: positionViewAtIndex(model.currentIndex, ListView.Center)
+ delegate: ItemDelegate {
- model: config.keyboardLayoutsModel
- currentIndex: model.currentIndex
- Component.onCompleted: positionViewAtIndex(model.currentIndex, ListView.Center)
- delegate: ItemDelegate {
+ hoverEnabled: true
+ width: parent.width
+ implicitHeight: 24
+ highlighted: ListView.isCurrentItem
- hoverEnabled: true
- width: parent.width
- height: 18
- highlighted: ListView.isCurrentItem
+ RowLayout {
+ anchors.fill: parent
- RowLayout {
- anchors.fill: parent
-
- Label {
- id: label1
- text: model.label
- Layout.fillHeight: true
- Layout.fillWidth: true
- padding: 10
- width: parent.width
- height: 32
- color: highlighted ? highlightedTextColor : textColor
-
- background: Rectangle {
- color: highlighted || hovered ? highlightColor : listBackgroundColor
- opacity: highlighted || hovered ? 0.5 : 0.3
- }
+ Label {
+ id: label1
+ text: model.label
+ horizontalAlignment: Text.AlignHCenter
+ Layout.fillHeight: true
+ Layout.fillWidth: true
+ width: parent.width
+ height: 24
+ color: highlighted ? highlightedTextColor : textColor
+
+ background: Rectangle {
+ color: highlighted || hovered ? highlightColor : listBackgroundColor
+ opacity: highlighted || hovered ? 0.5 : 0.3
}
}
+ }
- onClicked: {
+ onClicked: {
- layouts.model.currentIndex = index
- keyIndex = label1.text.substring(0,6)
- stack.push(variantsList)
- layouts.positionViewAtIndex(index, ListView.Center)
- }
+ layouts.model.currentIndex = index
+ keyIndex = label1.text.substring(0,6)
+ layouts.positionViewAtIndex(index, ListView.Center)
}
}
- Button {
-
- Layout.fillWidth: true
- anchors.verticalCenter: parent.verticalCenter
- anchors.verticalCenterOffset: -parent.height / 3.5
- anchors.left: parent.left
- anchors.leftMargin: parent.width / 15
- icon.name: "go-next"
- text: qsTr("Variants")
- onClicked: stack.push(variantsList)
- }
}
- Component {
- id: variantsList
-
- Item {
+ ListView {
+ id: variants
- ListView {
- id: variants
-
- ScrollBar.vertical: ScrollBar {
- active: true
- }
+ ScrollBar.vertical: ScrollBar {
+ active: true
+ }
- width: parent.width / 2
- height: 200
- anchors.horizontalCenter: parent.horizontalCenter
- anchors.topMargin: 10
- focus: true
- clip: true
- boundsBehavior: Flickable.StopAtBounds
- spacing: 2
-
- Rectangle {
- z: parent.z - 1
- anchors.fill: parent
- color: listBackgroundColor
- opacity: 0.7
- }
+ Layout.preferredWidth: parent.width / 2
+ height: 220
+ focus: true
+ clip: true
+ boundsBehavior: Flickable.StopAtBounds
+ spacing: 2
+ headerPositioning: ListView.OverlayHeader
+ header: Rectangle{
+ height: 24
+ width: parent.width
+ z: 2
+ color:backgroundColor
+ Text {
+ text: qsTr("Variant")
+ anchors.centerIn: parent
+ color: textColor
+ font.bold: true
+ }
+ }
- model: config.keyboardVariantsModel
- currentIndex: model.currentIndex
- Component.onCompleted: positionViewAtIndex(model.currentIndex, ListView.Center)
+ Rectangle {
+ z: parent.z - 1
+ anchors.fill: parent
+ color: listBackgroundColor
+ opacity: 0.7
+ }
- delegate: ItemDelegate {
- hoverEnabled: true
+ model: config.keyboardVariantsModel
+ currentIndex: model.currentIndex
+ Component.onCompleted: positionViewAtIndex(model.currentIndex, ListView.Center)
+
+ delegate: ItemDelegate {
+ hoverEnabled: true
+ width: parent.width
+ implicitHeight: 24
+ highlighted: ListView.isCurrentItem
+
+ RowLayout {
+ anchors.fill: parent
+
+ Label {
+ text: model.label
+ horizontalAlignment: Text.AlignHCenter
+ Layout.fillHeight: true
+ Layout.fillWidth: true
width: parent.width
- height: 18
- highlighted: ListView.isCurrentItem
-
- RowLayout {
- anchors.fill: parent
-
- Label {
- text: model.label
- Layout.fillHeight: true
- Layout.fillWidth: true
- padding: 10
- width: parent.width
- height: 30
- color: highlighted ? highlightedTextColor : textColor
-
- background: Rectangle {
- color: highlighted || hovered ? highlightColor : listBackgroundColor
- opacity: highlighted || hovered ? 0.5 : 0.3
- }
- }
- }
+ height: 24
+ color: highlighted ? highlightedTextColor : textColor
- onClicked: {
- variants.model.currentIndex = index
- variants.positionViewAtIndex(index, ListView.Center)
+ background: Rectangle {
+ color: highlighted || hovered ? highlightColor : listBackgroundColor
+ opacity: highlighted || hovered ? 0.5 : 0.3
}
}
}
- Button {
- Layout.fillWidth: true
- anchors.verticalCenter: parent.verticalCenter
- anchors.verticalCenterOffset: -parent.height / 3.5
- anchors.left: parent.left
- anchors.leftMargin: parent.width / 15
- icon.name: "go-previous"
- text: qsTr("Layouts")
- onClicked: stack.pop()
+ onClicked: {
+ variants.model.currentIndex = index
+ variants.positionViewAtIndex(index, ListView.Center)
}
}
}
@@ -264,7 +310,7 @@ Item {
id: textInput
placeholderText: qsTr("Type here to test your keyboard")
height: 36
- width: parent.width / 1.5
+ width: parent.width / 1.6
horizontalAlignment: TextInput.AlignHCenter
anchors.horizontalCenter: parent.horizontalCenter
anchors.bottom: keyboard.top
diff --git a/src/modules/keyboardq/keyboardq.qrc b/src/modules/keyboardq/keyboardq.qrc
index 6fd2a317be4226b9335ae0ba7cb37ddce3ea5f1c..ad777fd1c2181760e4212c014cae29ef4bcc0fa9 100644
--- a/src/modules/keyboardq/keyboardq.qrc
+++ b/src/modules/keyboardq/keyboardq.qrc
@@ -24,5 +24,6 @@
<file>data/button_bkg_center.png</file>
<file>data/button_bkg_left.png</file>
<file>data/button_bkg_right.png</file>
+ <file>data/pan-end-symbolic.svg</file>
</qresource>
</RCC>