Fix: Removed useless KeyNavigation and key events. Fixed typos. Cleaned up some code.

Components/Clock.qml

@@ -8,11 +8,15 @@ import QtQuick.Controls 2.15
 
 Column {
     id: clock
-    spacing: 0
+
     width: parent.width / 2
+    spacing: 0
 
     Label {
+        id:headerTextLabel
+
         anchors.horizontalCenter: parent.horizontalCenter
+
         font.pointSize: root.font.pointSize * 3
         color: config.HeaderTextColor
         renderType: Text.QtRendering
@@ -21,11 +25,14 @@ Column {
 
     Label {
         id: timeLabel
+
         anchors.horizontalCenter: parent.horizontalCenter
+
         font.pointSize: root.font.pointSize * 9
         font.bold: true
         color: config.TimeTextColor
         renderType: Text.QtRendering
+
         function updateTime() {
             text = new Date().toLocaleTimeString(Qt.locale(config.Locale), config.HourFormat == "long" ? Locale.LongFormat : config.HourFormat !== "" ? config.HourFormat : Locale.ShortFormat)
         }
@@ -33,11 +40,14 @@ Column {
 
     Label {
         id: dateLabel
+
         anchors.horizontalCenter: parent.horizontalCenter
+        
         color: config.DateTextColor
         font.pointSize: root.font.pointSize * 2
         font.bold: true
         renderType: Text.QtRendering
+
         function updateTime() {
             text = new Date().toLocaleDateString(Qt.locale(config.Locale), config.DateFormat == "short" ? Locale.ShortFormat : config.DateFormat !== "" ? config.DateFormat : Locale.LongFormat)
         }

Components/Input.qml

@@ -9,25 +9,32 @@ import QtQuick.Controls 2.15
 
 Column {
     id: inputContainer
+    
     Layout.fillWidth: true
 
     property ComboBox exposeSession: sessionSelect.exposeSession
     property bool failed
 
     Item {
+        id: errorMessageField
+
         // change also in selectSession
         height: root.font.pointSize * 2
         width: parent.width / 2
         anchors.horizontalCenter: parent.horizontalCenter
+
         Label {
             id: errorMessage
+
             width: parent.width
-            text: failed ? config.TranslateLoginFailedWarning || textConstants.loginFailed + "!" : keyboard.capsLock ? config.TranslateCapslockWarning || textConstants.capslockWarning : null
             horizontalAlignment: Text.AlignHCenter
+            
+            text: failed ? config.TranslateLoginFailedWarning || textConstants.loginFailed + "!" : keyboard.capsLock ? config.TranslateCapslockWarning || textConstants.capslockWarning : null
             font.pointSize: root.font.pointSize * 0.8
             font.italic: true
             color: config.WarningColor
             opacity: 0
+            
             states: [
                 State {
                     name: "fail"
@@ -65,22 +72,11 @@ Column {
         anchors.horizontalCenter: parent.horizontalCenter
 
         ComboBox {
-
             id: selectUser
 
             width: parent.height
             height: parent.height
             anchors.left: parent.left
-
-            property var popkey: config.RightToLeftLayout == "true" ? Qt.Key_Right : Qt.Key_Left
-            Keys.onPressed: function(event) {
-                if (event.key == Qt.Key_Down && !popup.opened)
-                    username.forceActiveFocus();
-                if ((event.key == Qt.Key_Up || event.key == popkey) && !popup.opened)
-                    popup.open();
-                }
-            KeyNavigation.down: username
-            KeyNavigation.right: username
             z: 2
 
             model: userModel
@@ -91,42 +87,56 @@ Column {
                 username.text = currentText
             }
 
+            property var popkey: config.RightToLeftLayout == "true" ? Qt.Key_Right : Qt.Key_Left
+            Keys.onPressed: function(event) {
+                if (event.key == Qt.Key_Down && !popup.opened)
+                    username.forceActiveFocus();
+                if ((event.key == Qt.Key_Up || event.key == popkey) && !popup.opened)
+                    popup.open();
+                }
+            KeyNavigation.down: username
+            KeyNavigation.right: username
+
             delegate: ItemDelegate {
                 //  minus padding
                 width: popupHandler.width - 20
                 anchors.horizontalCenter: popupHandler.horizontalCenter
+                
                 contentItem: Text {
+                    verticalAlignment: Text.AlignVCenter
+                    horizontalAlignment: Text.AlignHCenter
+
                     text: model.name
                     font.pointSize: root.font.pointSize * 0.8
                     font.capitalization: Font.AllLowercase
                     font.family: root.font.family
                     color: config.DropdownTextColor
-                    verticalAlignment: Text.AlignVCenter
-                    horizontalAlignment: Text.AlignHCenter
                 }
-                // highlighted: parent.highlightedIndex === index
+                
                 background: Rectangle {
                     color: selectUser.highlightedIndex === index ? config.DropdownSelectedBackgroundColor : "transparent"
                 }
             }
 
             indicator: Button {
-                    id: usernameIcon
+                id: usernameIcon
-                    width: selectUser.height * 1
-                    height: parent.height
-                    anchors.left: parent.left
-                    anchors.verticalCenter: parent.verticalCenter
-                    anchors.leftMargin: selectUser.height * 0
-                    icon.height: parent.height * 0.25
-                    icon.width: parent.height * 0.25
-                    enabled: false
-                    icon.color: config.UserIconColor
-                    icon.source: Qt.resolvedUrl("../Assets/User.svg")
                     
-                    background: Rectangle {
+                width: selectUser.height * 1
-                        color: "transparent"
+                height: parent.height
-                        border.color: "transparent"
+                anchors.left: parent.left
-                    }
+                anchors.verticalCenter: parent.verticalCenter
+                anchors.leftMargin: selectUser.height * 0
+                
+                icon.height: parent.height * 0.25
+                icon.width: parent.height * 0.25
+                enabled: false
+                icon.color: config.UserIconColor
+                icon.source: Qt.resolvedUrl("../Assets/User.svg")
+                    
+                background: Rectangle {
+                    color: "transparent"
+                    border.color: "transparent"
+                }
             }
 
             background: Rectangle {
@@ -136,16 +146,18 @@ Column {
 
             popup: Popup {
                 id: popupHandler
+
+                implicitHeight: contentItem.implicitHeight
+                width: usernameField.width
                 y: parent.height - username.height / 3
                 x: config.RightToLeftLayout == "true" ? -loginButton.width + selectUser.width : 0
                 rightMargin: config.RightToLeftLayout == "true" ? root.padding + usernameField.width / 2 : undefined
-                width: usernameField.width
-                implicitHeight: contentItem.implicitHeight
                 padding: 10
 
                 contentItem: ListView {
-                    clip: true
                     implicitHeight: contentHeight + 20
+                    
+                    clip: true
                     model: selectUser.popup.visible ? selectUser.delegateModel : null
                     currentIndex: selectUser.highlightedIndex
                     ScrollIndicator.vertical: ScrollIndicator { }
@@ -188,7 +200,6 @@ Column {
                     }
                 }
             ]
-
             transitions: [
                 Transition {
                     PropertyAnimation {
@@ -202,22 +213,27 @@ Column {
 
         TextField {
             id: username
+
+            anchors.centerIn: parent
+            height: root.font.pointSize * 3
+            width: parent.width
+            horizontalAlignment: TextInput.AlignHCenter
+            z: 1
+
             text: config.ForceLastUser == "true" ? selectUser.currentText : null
             color: config.LoginFieldTextColor
             font.bold: true
             font.capitalization: config.AllowUppercaseLettersInUsernames == "false" ? Font.AllLowercase : Font.MixedCase
-            anchors.centerIn: parent
-            height: root.font.pointSize * 3
-            width: parent.width
             placeholderText: config.TranslatePlaceholderUsername || textConstants.userName
-            placeholderTextColor: config.PlacholderTextColor
+            placeholderTextColor: config.PlaceholderTextColor
             selectByMouse: true
-            horizontalAlignment: TextInput.AlignHCenter
             renderType: Text.QtRendering
+            
             onFocusChanged:{
                 if(focus)
                     selectAll()
             }
+
             background: Rectangle {
                 color: config.LoginFieldBackgroundColor
                 opacity: 0.2
@@ -225,9 +241,9 @@ Column {
                 border.width: parent.activeFocus ? 2 : 1
                 radius: config.RoundCorners || 0
             }
+            
             onAccepted: config.AllowUppercaseLettersInUsernames == "false" ? sddm.login(username.text.toLowerCase(), password.text, sessionSelect.selectedSession) : sddm.login(username.text, password.text, sessionSelect.selectedSession)
-            KeyNavigation.down: showPassword
+            KeyNavigation.down: passwordIcon
-            z: 1
 
             states: [
                 State {
@@ -254,13 +270,15 @@ Column {
         anchors.horizontalCenter: parent.horizontalCenter
         
         Button {
-            id: showPassword
+            id: passwordIcon
-            z: 2
+            
-            width: selectUser.height * 1
             height: parent.height
+            width: selectUser.height * 1
             anchors.left: parent.left
-            anchors.verticalCenter: parent.verticalCenter
             anchors.leftMargin: selectUser.height * 0
+            anchors.verticalCenter: parent.verticalCenter
+            z: 2
+            
             icon.height: parent.height * 0.25
             icon.width: parent.height * 0.25
             icon.color: config.PasswordIconColor
@@ -274,44 +292,44 @@ Column {
             states: [
                 State {
                     name: "visiblePasswordFocused"
-                    when: showPassword.checked && showPassword.activeFocus
+                    when: passwordIcon.checked && passwordIcon.activeFocus
                     PropertyChanges {
-                        target: showPassword
+                        target: passwordIcon
                         icon.source: Qt.resolvedUrl("../Assets/Password.svg")
                         icon.color: config.HoverPasswordIconColor
                     }
                 },
                 State {
                     name: "visiblePasswordHovered"
-                    when: showPassword.checked && showPassword.hovered
+                    when: passwordIcon.checked && passwordIcon.hovered
                     PropertyChanges {
-                        target: showPassword
+                        target: passwordIcon
                         icon.source: Qt.resolvedUrl("../Assets/Password.svg")
                         icon.color: config.HoverPasswordIconColor
                     }
                 },
                 State {
                     name: "visiblePassword"
-                    when: showPassword.checked
+                    when: passwordIcon.checked
                     PropertyChanges {
-                        target: showPassword
+                        target: passwordIcon
                         icon.source: Qt.resolvedUrl("../Assets/Password.svg")
                     }
                 },
                 State {
                     name: "hiddenPasswordFocused"
-                    when:  showPassword.enabled && showPassword.activeFocus
+                    when:  passwordIcon.enabled && passwordIcon.activeFocus
                     PropertyChanges {
-                        target: showPassword
+                        target: passwordIcon
                         icon.source: Qt.resolvedUrl("../Assets/Password2.svg")
                         icon.color: config.HoverPasswordIconColor
                     }
                 },
                 State {
                     name: "hiddenPasswordHovered"
-                    when: showPassword.hovered
+                    when: passwordIcon.hovered
                     PropertyChanges {
-                        target: showPassword
+                        target: passwordIcon
                         icon.source: Qt.resolvedUrl("../Assets/Password2.svg")
                         icon.color: config.HoverPasswordIconColor
                     }
@@ -327,20 +345,23 @@ Column {
 
         TextField {
             id: password
-            anchors.centerIn: parent
+
-            color: config.PasswordFieldTextColor
             height: root.font.pointSize * 3
             width: parent.width
-            font.bold: true
+            anchors.centerIn: parent
-            focus: config.PasswordFocus == "true" ? true : false
-            selectByMouse: true
-            echoMode: showPassword.checked ? TextInput.Normal : TextInput.Password
-            placeholderText: config.TranslatePlaceholderPassword || textConstants.password
-            placeholderTextColor: config.PlacholderTextColor
             horizontalAlignment: TextInput.AlignHCenter
+            
+            font.bold: true
+            color: config.PasswordFieldTextColor
+            focus: config.PasswordFocus == "true" ? true : false
+            echoMode: passwordIcon.checked ? TextInput.Normal : TextInput.Password
+            placeholderText: config.TranslatePlaceholderPassword || textConstants.password
+            placeholderTextColor: config.PlaceholderTextColor
             passwordCharacter: "•"
             passwordMaskDelay: config.HideCompletePassword == "true" ? undefined : 1000
             renderType: Text.QtRendering
+            selectByMouse: true
+            
             background: Rectangle {
                 color: config.PasswordFieldBackgroundColor
                 opacity: 0.2
@@ -366,7 +387,6 @@ Column {
                 }
             }
         ]
-
         transitions: [
             Transition {
                 PropertyAnimation {
@@ -379,35 +399,42 @@ Column {
 
     Item {
         id: login
+
         // important
         // try 4 or 9 ...
         height: root.font.pointSize * 9
         width: parent.width / 2
         anchors.horizontalCenter: parent.horizontalCenter
+
         visible: config.HideLoginButton == "true" ? false : true
+        
         Button {
             id: loginButton
-            anchors.horizontalCenter: parent.horizontalCenter
+
-            anchors.verticalCenter: parent.verticalCenter
-            text: config.TranslateLogin || textConstants.login
             height: root.font.pointSize * 3
             implicitWidth: parent.width
+            anchors.horizontalCenter: parent.horizontalCenter
+            anchors.verticalCenter: parent.verticalCenter
+            
+            text: config.TranslateLogin || textConstants.login
             enabled: config.AllowEmptyPassword == "true" || username.text != "" && password.text != "" ? true : false
             hoverEnabled: true
 
             contentItem: Text {
-                font.bold: true
-                text: parent.text
-                color: config.LoginButtonTextColor
-                font.pointSize: root.font.pointSize
-                font.family: root.font.family
                 horizontalAlignment: Text.AlignHCenter
                 verticalAlignment: Text.AlignVCenter
+
+                font.bold: true
+                font.pointSize: root.font.pointSize
+                font.family: root.font.family
+                color: config.LoginButtonTextColor
+                text: parent.text
                 opacity: 0.5
             }
 
             background: Rectangle {
                 id: buttonBackground
+
                 color: config.LoginButtonBackgroundColor
                 opacity: 0.2
                 radius: config.RoundCorners || 0
@@ -466,7 +493,6 @@ Column {
                     }
                 }
             ]
-
             transitions: [
                 Transition {
                     PropertyAnimation {
@@ -475,10 +501,12 @@ Column {
                     }
                 }
             ]
+
             onClicked: config.AllowUppercaseLettersInUsernames == "false" ? sddm.login(username.text.toLowerCase(), password.text, sessionSelect.selectedSession) : sddm.login(username.text, password.text, sessionSelect.selectedSession)
             Keys.onReturnPressed: clicked()
             Keys.onEnterPressed: clicked()
-            KeyNavigation.down: sessionSelect.exposeSession
+            
+            KeyNavigation.down: config.HideSystemButtons == "true" ? virtualKeyboard : systemButtons.children[0]
         }
     }
 

Components/LoginForm.qml

@@ -16,6 +16,7 @@ ColumnLayout {
 
     Clock {
         id: clock
+
         Layout.alignment: Qt.AlignHCenter | Qt.AlignBottom
         // important
         Layout.preferredHeight: root.height / 3
@@ -24,6 +25,7 @@ ColumnLayout {
 
     Input {
         id: input
+
         Layout.alignment: Qt.AlignVCenter
         Layout.preferredHeight: root.height / 10
         Layout.leftMargin: p != "0" ? a == "left" ? -p : a == "right" ? p : 0 : 0
@@ -32,15 +34,18 @@ ColumnLayout {
 
     SystemButtons {
         id: systemButtons
+
         Layout.alignment: Qt.AlignHCenter | Qt.AlignBottom
         Layout.preferredHeight: root.height / 5
         Layout.maximumHeight: root.height / 5
         Layout.leftMargin: p != "0" ? a == "left" ? -p : a == "right" ? p : 0 : 0
+        
         exposedSession: input.exposeSession
     }
     
     SessionButton {
         id: sessionSelect
+
         Layout.alignment: Qt.AlignHCenter | Qt.AlignBottom
         Layout.preferredHeight: root.height / 54
         Layout.maximumHeight: root.height / 54
@@ -49,6 +54,7 @@ ColumnLayout {
 
     VirtualKeyboardButton {
         id: virtualKeyboardButton
+
         Layout.alignment: Qt.AlignHCenter | Qt.AlignTop
         Layout.preferredHeight: root.height / 27
         Layout.maximumHeight: root.height / 27

Components/SessionButton.qml

@@ -8,9 +8,10 @@ import QtQuick.Controls 2.15
 
 Item {
     id: sessionButton
+
     height: root.font.pointSize
     width: parent.width / 2
-    // anchors.horizontalCenter: parent.horizontalCenter
+    
     property var selectedSession: selectSession.currentIndex
     property string textConstantSession
     property int loginButtonWidth
@@ -18,49 +19,38 @@ Item {
 
     ComboBox {
         id: selectSession
+
         // important
         // change also in errorMessage
         height: root.font.pointSize * 2
-        hoverEnabled: true
         anchors.horizontalCenter: parent.horizontalCenter
-        Keys.onPressed: function(event) {
-        if (event.key == Qt.Key_Up && loginButton.state != "enabled" && !popup.opened) {
-            revealSecret.focus = true;
-            revealSecret.state = "focused";
-            currentIndex = currentIndex + 1;
-        }
-        if (event.key == Qt.Key_Up && loginButton.state == "enabled" && !popup.opened) {
-            loginButton.focus = true;
-            loginButton.state = "focused";
-            currentIndex = currentIndex + 1;
-        }
-        if (event.key == Qt.Key_Down && !popup.opened) {
-            systemButtons.children[0].focus = true;
-            systemButtons.children[0].state = "focused";
-            currentIndex = currentIndex - 1;
-        }
-        if ((event.key == Qt.Key_Left || event.key == Qt.Key_Right) && !popup.opened) {
-            popup.open();
-        }
-        }
 
+        hoverEnabled: true
         model: sessionModel
         currentIndex: model.lastIndex
         textRole: "name"
         
+        Keys.onPressed: function(event) {
+            if ((event.key == Qt.Key_Left || event.key == Qt.Key_Right) && !popup.opened) {
+                popup.open();
+            }
+        }
+
         delegate: ItemDelegate {
             // minus padding
             width: popupHandler.width - 20
             anchors.horizontalCenter: popupHandler.horizontalCenter
+            
             contentItem: Text {
+                verticalAlignment: Text.AlignVCenter
+                horizontalAlignment: Text.AlignHCenter
+
                 text: model.name
                 font.pointSize: root.font.pointSize * 0.8
                 font.family: root.font.family
                 color: config.DropdownTextColor
-                verticalAlignment: Text.AlignVCenter
-                horizontalAlignment: Text.AlignHCenter
             }
-            // highlighted: parent.highlightedIndex === index
+            
             background: Rectangle {
                 color: selectSession.highlightedIndex === index ? config.DropdownSelectedBackgroundColor : "transparent"
             }
@@ -72,34 +62,37 @@ Item {
 
         contentItem: Text {
             id: displayedItem
+
+            verticalAlignment: Text.AlignVCenter
+            
             text: (config.TranslateSessionSelection || "Session") + " (" + selectSession.currentText + ")"
             color: config.SessionButtonTextColor
-            verticalAlignment: Text.AlignVCenter
             font.pointSize: root.font.pointSize * 0.8
             font.family: root.font.family
+
             Keys.onReleased: parent.popup.open()
         }
 
         background: Rectangle {
-            color: "transparent"
             height: parent.visualFocus ? 2 : 0
             width: displayedItem.implicitWidth
-            // anchors.top: parent.bottom
+
-            // anchors.left: parent.left
+            color: "transparent"
-            // anchors.leftMargin: 3
         }
 
         popup: Popup {
             id: popupHandler
+
+            implicitHeight: contentItem.implicitHeight
             width: sessionButton.width
             y: parent.height - 1
             x:  -popupHandler.width/2 + displayedItem.width/2
-            implicitHeight: contentItem.implicitHeight
             padding: 10
 
             contentItem: ListView {
-                clip: true
                 implicitHeight: contentHeight + 20
+
+                clip: true
                 model: selectSession.popup.visible ? selectSession.delegateModel : null
                 currentIndex: selectSession.highlightedIndex
                 ScrollIndicator.vertical: ScrollIndicator { }
@@ -142,7 +135,6 @@ Item {
                 }
             }
         ]
-
         transitions: [
             Transition {
                 PropertyAnimation {

Components/SystemButtons.qml

@@ -19,27 +19,30 @@ RowLayout {
     property ComboBox exposedSession
 
     Repeater {
-
         id: systemButtons
+        
         model: [shutdown, reboot, suspend, hibernate]
 
         RoundButton {
-            text: modelData[1]
-            font.pointSize: root.font.pointSize * 0.8
             Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
             Layout.topMargin: root.font.pointSize * 6.5
+
+            text: modelData[1]
+            font.pointSize: root.font.pointSize * 0.8
             icon.source: modelData ? Qt.resolvedUrl("../Assets/" + modelData[0] + ".svg") : ""
             icon.height: 2 * Math.round((root.font.pointSize * 3) / 2)
             icon.width: 2 * Math.round((root.font.pointSize * 3) / 2)
             icon.color: config.SystemButtonsIconsColor
+            palette.buttonText: config.SystemButtonsIconsColor
             display: AbstractButton.TextUnderIcon
             visible: config.HideSystemButtons != "true" && (config.BypassSystemButtonsChecks == "true" ? 1 : modelData[2])
             hoverEnabled: true
-            palette.buttonText: config.SystemButtonsIconsColor
+            
             background: Rectangle {
                 height: 2
-                color: "transparent"
                 width: parent.width
+
+                color: "transparent"
             }
 
             Keys.onReturnPressed: clicked()
@@ -78,7 +81,6 @@ RowLayout {
                     }
                 }
             ]
-
             transitions: [
                 Transition {
                     PropertyAnimation {

Components/VirtualKeyboard.qml

@@ -8,6 +8,7 @@ import QtQuick.VirtualKeyboard 2.3
 
 InputPanel {
     id: virtualKeyboard
+    
     property bool activated: false
     active: activated && Qt.inputMethod.visible
     visible: active

Components/VirtualKeyboardButton.qml

@@ -7,64 +7,65 @@ import QtQuick.Controls 2.15
 
 Item {
     Button {
-            id: virtualKeyboardButton
+        id: virtualKeyboardButton
-            checkable: true
-            onClicked: virtualKeyboard.switchState()
 
-            Keys.onReturnPressed: {
+        anchors.horizontalCenter: parent.horizontalCenter
-                toggle();
+        z: 1
-                virtualKeyboard.switchState();
+
-            }
+        visible: virtualKeyboard.status == Loader.Ready && config.HideVirtualKeyboard == "false"
-            Keys.onEnterPressed: {
+        checkable: true
-                toggle();
+        onClicked: virtualKeyboard.switchState()
-                virtualKeyboard.switchState();
+        
-            }
+        Keys.onReturnPressed: {
-            visible: virtualKeyboard.status == Loader.Ready && config.HideVirtualKeyboard == "false"
+            toggle();
-            // anchors.bottom: parent.bottom
+            virtualKeyboard.switchState();
-            // anchors.bottomMargin: implicitHeight
+        }
-            anchors.horizontalCenter: parent.horizontalCenter
+        Keys.onEnterPressed: {
-            z: 1
+            toggle();
-            contentItem: Text {
+            virtualKeyboard.switchState();
-                id: virtualKeyboardButtonText
-                text: config.TranslateVirtualKeyboardButtonOff || "Virtual Keyboard (off)"
-                color: parent.visualFocus ? config.HoverVirtualKeyboardButtonTextColor : config.VirtualKeyboardButtonTextColor
-                font.pointSize: root.font.pointSize * 0.8
-                font.family: root.font.family
-            }
-            background: Rectangle {
-                id: virtualKeyboardButtonBackground
-                color: "transparent"
-            }
-            states: [
-                State {
-                    name: "HoveredAndChecked"
-                    when: virtualKeyboardButton.checked && virtualKeyboardButton.hovered
-                    PropertyChanges {
-                        target: virtualKeyboardButtonText
-                        text: config.TranslateVirtualKeyboardButtonOn || "Virtual Keyboard (on)"
-                        color: config.HoverVirtualKeyboardButtonTextColor
-                    }
-                },
-                State {
-                    name: "checked"
-                    when: virtualKeyboardButton.checked
-                    PropertyChanges {
-                        target: virtualKeyboardButtonText
-                        text: config.TranslateVirtualKeyboardButtonOn || "Virtual Keyboard (on)"
-                    }
-                },
-                State {
-                    name: "hovered"
-                    when: virtualKeyboardButton.hovered
-                    PropertyChanges {
-                        target: virtualKeyboardButtonText
-                        text: config.TranslateVirtualKeyboardButtonOff || "Virtual Keyboard (off)"
-                        color: config.HoverVirtualKeyboardButtonTextColor
-                    }
-                }
-            ]
         }
 
+        contentItem: Text {
+            id: virtualKeyboardButtonText
 
+            text: config.TranslateVirtualKeyboardButtonOff || "Virtual Keyboard (off)"
+            font.pointSize: root.font.pointSize * 0.8
+            font.family: root.font.family
+            color: parent.visualFocus ? config.HoverVirtualKeyboardButtonTextColor : config.VirtualKeyboardButtonTextColor
+        }
 
+        background: Rectangle {
+            id: virtualKeyboardButtonBackground
+
+            color: "transparent"
+        }
+        states: [
+            State {
+                name: "HoveredAndChecked"
+                when: virtualKeyboardButton.checked && virtualKeyboardButton.hovered
+                PropertyChanges {
+                    target: virtualKeyboardButtonText
+                    text: config.TranslateVirtualKeyboardButtonOn || "Virtual Keyboard (on)"
+                    color: config.HoverVirtualKeyboardButtonTextColor
+                }
+            },
+            State {
+                name: "checked"
+                when: virtualKeyboardButton.checked
+                PropertyChanges {
+                    target: virtualKeyboardButtonText
+                    text: config.TranslateVirtualKeyboardButtonOn || "Virtual Keyboard (on)"
+                }
+            },
+            State {
+                name: "hovered"
+                when: virtualKeyboardButton.hovered
+                PropertyChanges {
+                    target: virtualKeyboardButtonText
+                    text: config.TranslateVirtualKeyboardButtonOff || "Virtual Keyboard (off)"
+                    color: config.HoverVirtualKeyboardButtonTextColor
+                }
+            }
+        ]
+    }
 }

Main.qml

@@ -53,35 +53,40 @@ Pane {
     Item {
         id: sizeHelper
 
-        anchors.fill: parent
         height: parent.height
         width: parent.width
+        anchors.fill: parent
         
         Rectangle {
             id: tintLayer
-            anchors.fill: parent
+
-            width: parent.width
             height: parent.height
-            opacity: config.DimBackground
+            width: parent.width
+            anchors.fill: parent
             z: 1
+
+            opacity: config.DimBackground
         }
 
         Rectangle {
             id: formBackground
+
             anchors.fill: form
             anchors.centerIn: form
+            z: 1
+
             color: config.FormBackgroundColor
             visible: config.HaveFormBackground == "true" ? true : false
             opacity: config.PartialBlur == "true" ? 0.3 : 1
-            z: 1
         }
 
         LoginForm {
             id: form
+
             height: parent.height
             width: parent.width / 2.5
-            anchors.horizontalCenter: config.FormPosition == "center" ? parent.horizontalCenter : undefined
             anchors.left: config.FormPosition == "left" ? parent.left : undefined
+            anchors.horizontalCenter: config.FormPosition == "center" ? parent.horizontalCenter : undefined
             anchors.right: config.FormPosition == "right" ? parent.right : undefined
             z: 1
         }
@@ -89,16 +94,18 @@ Pane {
         Loader {
             id: virtualKeyboard
             source: "Components/VirtualKeyboard.qml"
-            state: "hidden"
+
-            property bool keyboardActive: item ? item.active : false
             // x * 0.4 = x / 2.5
             width: config.KeyboardSize == "" ? parent.width * 0.4 : parent.width * config.KeyboardSize
             anchors.bottom: parent.bottom
             anchors.left: config.VirtualKeyboardPosition == "left" ? parent.left : undefined;
             anchors.horizontalCenter: config.VirtualKeyboardPosition == "center" ? parent.horizontalCenter : undefined;
             anchors.right: config.VirtualKeyboardPosition == "right" ? parent.right : undefined;
-
             z: 1
+            
+            state: "hidden"
+            property bool keyboardActive: item ? item.active : false
+
             function switchState() { state = state == "hidden" ? "visible" : "hidden"}
             states: [
                 State {
@@ -177,13 +184,8 @@ Pane {
 
             height: parent.height
             width: config.HaveFormBackground == "true" && config.FormPosition != "center" && config.PartialBlur != "true" ? parent.width - formBackground.width : parent.width
-            anchors.left: leftleft ||
+            anchors.left: leftleft || leftcenter ? formBackground.right : undefined
-                          leftcenter ?
+            anchors.right: rightright || rightcenter ? formBackground.left : undefined
-                                formBackground.right : undefined
-
-            anchors.right: rightright ||
-                           rightcenter ?
-                                formBackground.left : undefined
 
             horizontalAlignment: config.BackgroundHorizontalAlignment == "left" ?
                                  Image.AlignLeft :
@@ -211,10 +213,11 @@ Pane {
         ShaderEffectSource {
             id: blurMask
 
-            sourceItem: backgroundImage
-            width: form.width
             height: parent.height
+            width: form.width
             anchors.centerIn: form
+
+            sourceItem: backgroundImage
             sourceRect: Qt.rect(x,y,width,height)
             visible: config.FullBlur == "true" || config.PartialBlur == "true" ? true : false
         }
@@ -224,12 +227,13 @@ Pane {
 
             height: parent.height
             width: config.FullBlur == "true" ? parent.width : form.width
+            anchors.centerIn: config.FullBlur == "true" ? parent : form
+
             source: config.FullBlur == "true" ? backgroundImage : blurMask
             blurEnabled: true
             autoPaddingEnabled: false
             blur: config.Blur == "" ? 2.0 : config.Blur
             blurMax: config.BlurMax == "" ? 48 : config.BlurMax
-            anchors.centerIn: config.FullBlur == "true" ? parent : form
             visible: config.FullBlur == "true" || config.PartialBlur == "true" ? true : false
         }
     }