diff --git a/look-and-feel/contents/lockscreen/Keypad.qml b/look-and-feel/contents/lockscreen/Keypad.qml index 983da932..f19b15d9 100644 --- a/look-and-feel/contents/lockscreen/Keypad.qml +++ b/look-and-feel/contents/lockscreen/Keypad.qml @@ -32,7 +32,13 @@ Rectangle { opacity: Math.sin((Math.PI / 2) * swipeProgress + 1.5 * Math.PI) + 1 - implicitHeight: passwordBar.isPinMode ? PlasmaCore.Units.gridUnit * 17 : passwordBar.implicitHeight + implicitHeight: { + if (passwordBar.isPinMode && !Qt.inputMethod.visible) { + return PlasmaCore.Units.gridUnit * 17; + } else { + return PlasmaCore.Units.smallSpacing * 2 + Qt.inputMethod.keyboardRectangle.height + passwordBar.implicitHeight; + } + } Behavior on implicitHeight { NumberAnimation { duration: Kirigami.Units.longDuration diff --git a/look-and-feel/contents/lockscreen/LockScreen.qml b/look-and-feel/contents/lockscreen/LockScreen.qml index 106f5b9c..5f3156cc 100644 --- a/look-and-feel/contents/lockscreen/LockScreen.qml +++ b/look-and-feel/contents/lockscreen/LockScreen.qml @@ -1,5 +1,6 @@ /* SPDX-FileCopyrightText: 2019 Nicolas Fella +SPDX-FileCopyrightText: 2021 Devin Lin SPDX-License-Identifier: GPL-2.0-or-later */ diff --git a/look-and-feel/contents/lockscreen/PasswordBar.qml b/look-and-feel/contents/lockscreen/PasswordBar.qml index 31535476..e13fb89d 100644 --- a/look-and-feel/contents/lockscreen/PasswordBar.qml +++ b/look-and-feel/contents/lockscreen/PasswordBar.qml @@ -12,6 +12,7 @@ import org.kde.plasma.components 2.0 as PlasmaComponents import org.kde.plasma.core 2.0 as PlasmaCore import org.kde.plasma.workspace.keyboardlayout 1.0 import org.kde.kirigami 2.12 as Kirigami +import org.kde.plasma.workspace.keyboardlayout 1.0 as Keyboards Rectangle { id: root @@ -69,6 +70,10 @@ Rectangle { if (!authenticator.graceLocked) { authenticator.tryUnlock(root.password); } + if (keypadOpen && !isPinMode) { + // make sure keyboard doesn't close + openKeyboardTimer.restart(); + } } function keyPress(data) { @@ -85,6 +90,15 @@ Rectangle { } } + // HACK: we have to open the virtual keyboard after a certain amount of time or else it will close anyway + Timer { + id: openKeyboardTimer + interval: 10 + running: false + repeat: false + onTriggered: Keyboards.KWinVirtualKeyboard.active = true + } + // trigger turning letter into dot after 500 milliseconds Timer { id: letterTimer @@ -148,102 +162,112 @@ Rectangle { } } - // toggle between showing keypad and not - ToolButton { - anchors.right: parent.right - anchors.top: parent.top - anchors.bottom: parent.bottom - anchors.margins: units.smallSpacing - implicitWidth: height - icon.name: "input-keyboard-virtual-symbolic" - onClicked: root.isPinMode = !root.isPinMode - } - - // label ("wrong pin", "enter pin") - Label { - opacity: password.length === 0 ? 1 : 0 - anchors.centerIn: parent - text: root.pinLabel - font.pointSize: 12 - color: root.headerTextColor - - Behavior on opacity { - NumberAnimation { duration: 200 } - } - } - - // pin dot display - ColumnLayout { + MouseArea { anchors.fill: parent - - ListView { - id: dotDisplay - property int dotWidth: Math.round(units.gridUnit * 0.35) - - Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter - Layout.bottomMargin: Math.round(dotWidth / 2) - orientation: ListView.Horizontal - implicitWidth: count * dotWidth + spacing * (count - 1) - spacing: 8 - model: dotDisplayModel - - Behavior on implicitWidth { - NumberAnimation { duration: 50 } + onClicked: { + // clicking on rectangle opens keyboard if not already open + if (!isPinMode) { + Keyboards.KWinVirtualKeyboard.active = true; } + } + + // toggle between showing keypad and not + ToolButton { + anchors.right: parent.right + anchors.top: parent.top + anchors.bottom: parent.bottom + anchors.margins: units.smallSpacing + implicitWidth: height + icon.name: "input-keyboard-virtual-symbolic" + onClicked: root.isPinMode = !root.isPinMode + } + + // label ("wrong pin", "enter pin") + Label { + opacity: password.length === 0 ? 1 : 0 + anchors.centerIn: parent + text: root.pinLabel + font.pointSize: 12 + color: root.headerTextColor - delegate: Item { - implicitWidth: dotDisplay.dotWidth - implicitHeight: dotDisplay.dotWidth - property bool showChar: index === root.previewCharIndex + Behavior on opacity { + NumberAnimation { duration: 200 } + } + } + + // pin dot display + ColumnLayout { + anchors.fill: parent + + ListView { + id: dotDisplay + property int dotWidth: Math.round(units.gridUnit * 0.35) - Component.onCompleted: { - if (showChar) { - charAnimation.to = 1; - charAnimation.duration = 75; - charAnimation.restart(); - } else { - dotAnimation.to = 1; - dotAnimation.restart(); - } + Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter + Layout.bottomMargin: Math.round(dotWidth / 2) + orientation: ListView.Horizontal + implicitWidth: count * dotWidth + spacing * (count - 1) + spacing: 8 + model: dotDisplayModel + + Behavior on implicitWidth { + NumberAnimation { duration: 50 } } - onShowCharChanged: { - if (!showChar) { - charAnimation.to = 0; - charAnimation.duration = 50; - charAnimation.restart(); - dotAnimation.to = 1; - dotAnimation.start(); - } - } - - Rectangle { // dot - id: dot - scale: 0 - anchors.fill: parent - radius: width - color: root.waitingForAuth ? root.headerTextInactiveColor : root.headerTextColor // dim when waiting for auth + delegate: Item { + implicitWidth: dotDisplay.dotWidth + implicitHeight: dotDisplay.dotWidth + property bool showChar: index === root.previewCharIndex - PropertyAnimation { - id: dotAnimation - target: dot; - property: "scale"; - duration: 50 + Component.onCompleted: { + if (showChar) { + charAnimation.to = 1; + charAnimation.duration = 75; + charAnimation.restart(); + } else { + dotAnimation.to = 1; + dotAnimation.restart(); + } } - } - - Label { // number/letter - id: charLabel - scale: 0 - anchors.centerIn: parent - color: root.waitingForAuth ? root.headerTextInactiveColor : root.headerTextColor // dim when waiting for auth - text: model.char - font.pointSize: 12 - PropertyAnimation { - id: charAnimation - target: charLabel; - property: "scale"; + onShowCharChanged: { + if (!showChar) { + charAnimation.to = 0; + charAnimation.duration = 50; + charAnimation.restart(); + dotAnimation.to = 1; + dotAnimation.start(); + } + } + + Rectangle { // dot + id: dot + scale: 0 + anchors.fill: parent + radius: width + color: root.waitingForAuth ? root.headerTextInactiveColor : root.headerTextColor // dim when waiting for auth + + PropertyAnimation { + id: dotAnimation + target: dot; + property: "scale"; + duration: 50 + } + } + + Label { // number/letter + id: charLabel + scale: 0 + anchors.centerIn: parent + color: root.waitingForAuth ? root.headerTextInactiveColor : root.headerTextColor // dim when waiting for auth + text: model.char + font.pointSize: 12 + + PropertyAnimation { + id: charAnimation + target: charLabel; + property: "scale"; + } } } }