marcoallegretti/shift-shell
1
0
Fork 0
mirror of https://invent.kde.org/marcoa/shift-shell.git synced 2026-04-26 14:23:09 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

lockscreen: Add support for overflow in the password bar

Browse source 
This is a followup to https://invent.kde.org/plasma/plasma-mobile/-/merge_requests/517 and implements support for passwords longer than the width of the password bar.
This commit is contained in:
Devin Lin 2024-07-14 18:51:58 -04:00
parent 452f0df68b
commit 3ca8e47b29
1 changed files with 32 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

37
shell/contents/lockscreen/PasswordBar.qml
View file

@ -163,10 +163,16 @@ Rectangle {
// toggle between showing keypad and not // toggle between showing keypad and not
ToolButton { ToolButton {
id: keyboardToggle
anchors.right: parent.right anchors.right: parent.right
anchors.top: parent.top anchors.top: parent.top
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
anchors.margins: Kirigami.Units.smallSpacing anchors.margins: Kirigami.Units.smallSpacing
// Don't show if the PIN display overlaps it
visible: (dotDisplay.width / 2) < ((root.width / 2) - keyboardToggle.width - Kirigami.Units.smallSpacing)
implicitWidth: height implicitWidth: height
icon.name: root.lockScreenState.isKeyboardMode ? "input-dialpad-symbolic" : "input-keyboard-virtual-symbolic" icon.name: root.lockScreenState.isKeyboardMode ? "input-dialpad-symbolic" : "input-keyboard-virtual-symbolic"
onClicked: { onClicked: {
@ -177,6 +183,13 @@ Rectangle {
} }
} }
// PIN font metrics
FontMetrics {
id: pinFontMetrics
font.family: Kirigami.Theme.defaultFont.family
font.pointSize: 12
}
// pin dot display // pin dot display
ColumnLayout { ColumnLayout {
anchors.fill: parent anchors.fill: parent
@ -188,9 +201,13 @@ Rectangle {
Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
Layout.bottomMargin: Math.round(dotWidth / 2) Layout.bottomMargin: Math.round(dotWidth / 2)
Layout.maximumWidth: root.width - (Kirigami.Units.largeSpacing * 2)
implicitHeight: dotWidth readonly property real delegateHeight: Math.max(pinFontMetrics.height, dotWidth)
implicitWidth: count * dotWidth + spacing * (count - 1) readonly property real delegateWidth: dotWidth
implicitHeight: delegateHeight
implicitWidth: count * delegateWidth + spacing * (count - 1)
orientation: ListView.Horizontal orientation: ListView.Horizontal
spacing: 8 spacing: 8
@ -200,9 +217,17 @@ Rectangle {
NumberAnimation { duration: 50 } NumberAnimation { duration: 50 }
} }
onImplicitWidthChanged: {
if (contentWidth > Layout.maximumWidth) {
// When character is created and ListView is in overflow,
// scroll to the end of the ListView to show it
dotDisplay.positionViewAtEnd();
}
}
delegate: Item { delegate: Item {
width: dotDisplay.dotWidth width: dotDisplay.delegateWidth
height: dotDisplay.dotWidth height: dotDisplay.delegateHeight
property bool showChar: index === root.previewCharIndex property bool showChar: index === root.previewCharIndex
Component.onCompleted: { Component.onCompleted: {
@ -229,7 +254,9 @@ Rectangle {
Rectangle { // dot Rectangle { // dot
id: dot id: dot
scale: 0 scale: 0
anchors.fill: parent width: dotDisplay.dotWidth
height: dotDisplay.dotWidth
anchors.centerIn: parent
radius: width radius: width
color: lockScreenState.waitingForAuth ? root.headerTextInactiveColor : root.headerTextColor // dim when waiting for auth color: lockScreenState.waitingForAuth ? root.headerTextInactiveColor : root.headerTextColor // dim when waiting for auth