diff --git a/shell/contents/lockscreen/LockScreen.qml b/shell/contents/lockscreen/LockScreen.qml index 314e8c71..e9bf43e6 100644 --- a/shell/contents/lockscreen/LockScreen.qml +++ b/shell/contents/lockscreen/LockScreen.qml @@ -9,7 +9,6 @@ import QtQuick.Layouts import org.kde.plasma.core as PlasmaCore import org.kde.notificationmanager as Notifications import org.kde.plasma.private.mobileshell as MobileShell -import org.kde.plasma.private.mobileshell.shellsettingsplugin as ShellSettings import org.kde.plasma.private.mobileshell.dpmsplugin as DPMS import org.kde.plasma.components 3.0 as PC3 @@ -27,7 +26,7 @@ Item { readonly property var notifModel: Notifications.WatchedNotificationsModel {} // Only show widescreen mode for short height devices (ex. phone landscape) - readonly property bool isWidescreen: root.height < 720 && (root.height < root.width * 0.75) + readonly property bool isWidescreen: root.height < Kirigami.Units.gridUnit * 25 && (root.height < root.width * 0.75) property bool notificationsShown: false property var passwordBar: flickableLoader.item ? flickableLoader.item.flickable.passwordBar : null @@ -189,18 +188,6 @@ Item { } } - QuickActionButton { - id: leftButton - buttonAction: ShellSettings.Settings.lockscreenLeftButtonAction - opacity: Math.max(0, 1 - flickable.openFactor * 2) - anchors { - bottom: parent.bottom - left: parent.left - bottomMargin: Kirigami.Units.largeSpacing * 3 - leftMargin: Kirigami.Units.largeSpacing * 3 - } - } - // scroll up icon BottomIconIndicator { id: scrollUpIconLoader @@ -212,18 +199,6 @@ Item { anchors.horizontalCenter: parent.horizontalCenter } - QuickActionButton { - id: rightButton - buttonAction: ShellSettings.Settings.lockscreenRightButtonAction - opacity: Math.max(0, 1 - flickable.openFactor * 2) - anchors { - bottom: parent.bottom - right: parent.right - bottomMargin: Kirigami.Units.largeSpacing * 3 - rightMargin: Kirigami.Units.largeSpacing * 3 - } - } - Rectangle { id: keypadScrim anchors.fill: parent diff --git a/shell/contents/lockscreen/LockScreenContent.qml b/shell/contents/lockscreen/LockScreenContent.qml index d5acc97e..dd689242 100644 --- a/shell/contents/lockscreen/LockScreenContent.qml +++ b/shell/contents/lockscreen/LockScreenContent.qml @@ -9,6 +9,7 @@ import org.kde.kirigami 2.20 as Kirigami import org.kde.plasma.workspace.keyboardlayout 1.0 import org.kde.notificationmanager as Notifications import org.kde.plasma.private.mobileshell as MobileShell +import org.kde.plasma.private.mobileshell.shellsettingsplugin as ShellSettings Item { id: root @@ -37,6 +38,7 @@ Item { LayoutItemProxy { target: clockAndMediaWidget } LayoutItemProxy { target: notificationComponent } + LayoutItemProxy { target: actionButtons } } // Horizontal layout (landscape on smaller devices) @@ -47,12 +49,13 @@ Item { ColumnLayout { id: leftLayout - width: parent.width / 2 + width: Math.round(parent.width / 2.15) anchors { top: parent.top bottom: parent.bottom left: parent.left leftMargin: Kirigami.Units.gridUnit * 3 + bottomMargin: Kirigami.Units.gridUnit * 3 } LayoutItemProxy { target: clockAndMediaWidget } @@ -70,6 +73,15 @@ Item { LayoutItemProxy { target: notificationComponent } } + + ColumnLayout { + anchors.bottomMargin: Kirigami.Units.gridUnit + anchors.leftMargin: Kirigami.Units.gridUnit + anchors.rightMargin: Kirigami.Units.gridUnit + anchors.fill: parent + + LayoutItemProxy { target: actionButtons } + } } // Clock and media widget column @@ -111,10 +123,43 @@ Item { leftMargin: root.isVertical ? 0 : Kirigami.Units.gridUnit rightMargin: root.isVertical ? 0 : Kirigami.Units.gridUnit topMargin: root.isVertical ? 0 : MobileShell.Constants.topPanelHeight - bottomMargin: Kirigami.Units.gridUnit * 2 + bottomMargin: root.isVertical && (Kirigami.Units.gridUnit * 35 < root.width) && actionButtons.isVisible ? 0 : Kirigami.Units.gridUnit scrollLock: root.scrollLock onPasswordRequested: root.passwordRequested() onNotificationsShownChanged: root.notificationsShown = notificationsShown } + + RowLayout { + id: actionButtons + + readonly property int sideMargin: Kirigami.Units.gridUnit * 2 + readonly property bool isVisible: leftButton.visible || rightButton.visible + + Layout.fillWidth: true + Layout.alignment: Qt.AlignHCenter | Qt.AlignBottom + Layout.leftMargin: actionButtons.sideMargin + Layout.rightMargin: actionButtons.sideMargin + + // Left quick action button. + QuickActionButton { + id: leftButton + buttonAction: ShellSettings.Settings.lockscreenLeftButtonAction + opacity: Math.max(0, 1 - flickable.openFactor * 2) + + Layout.alignment: Qt.AlignVCenter + } + + // Spacer + Item { Layout.fillWidth: true } + + // Right quick action button. + QuickActionButton { + id: rightButton + buttonAction: ShellSettings.Settings.lockscreenRightButtonAction + opacity: Math.max(0, 1 - flickable.openFactor * 2) + + Layout.alignment: Qt.AlignVCenter + } + } } diff --git a/shell/contents/lockscreen/QuickActionButton.qml b/shell/contents/lockscreen/QuickActionButton.qml index bdfbf278..82719ade 100644 --- a/shell/contents/lockscreen/QuickActionButton.qml +++ b/shell/contents/lockscreen/QuickActionButton.qml @@ -10,38 +10,89 @@ import org.kde.plasma.private.mobileshell as MobileShell import org.kde.plasma.private.mobileshell.shellsettingsplugin as ShellSettings import org.kde.kirigami as Kirigami -Button { +AbstractButton { id: root + property int buttonAction + property bool buttonHeld: false + property double scale: pressed ? (buttonHeld ? 1.7 : 1.5) : 1 + + Behavior on scale { + NumberAnimation { + duration: Kirigami.Units.longDuration + easing.type: Easing.OutBack + } + } + + MobileShell.HapticsEffect { + id: haptics + } + visible: buttonAction !== ShellSettings.Settings.None - highlighted: buttonAction === ShellSettings.Settings.Flashlight ? FlashlightUtil.torchEnabled() : false - display: Button.IconOnly - icon.name: { - switch (buttonAction) { - case ShellSettings.Settings.Flashlight: - return "flashlight-on-symbolic" - case ShellSettings.Settings.Camera: - return "camera-photo-symbolic" + padding: Math.round(Kirigami.Units.gridUnit * 1.25) + + transform: Scale { + origin.x: width / 2 + origin.y: height / 2 + xScale: scale + yScale: scale + } + + background: Rectangle { + radius: width + color: Qt.rgba(255, 255, 255, pressed ? (buttonHeld ? 0.7 : 0.5) : 0.2) + } + + contentItem: Item { + Kirigami.Icon { + anchors.centerIn: parent + width: Kirigami.Units.iconSizes.small + height: Kirigami.Units.iconSizes.small + source: { + switch (buttonAction) { + case ShellSettings.Settings.Flashlight: + return "flashlight-on-symbolic" + case ShellSettings.Settings.Camera: + return "camera-photo-symbolic" + } + } + Kirigami.Theme.inherit: false + Kirigami.Theme.colorSet: Kirigami.Theme.Complementary } } - text: { - switch (buttonAction) { - case ShellSettings.Settings.Flashlight: - return i18nc("@action:button", "Turn flashlight on"); - case ShellSettings.Settings.Camera: - return i18nc("@action:button", "Open camera"); + + onPressedChanged: { + if (pressed) { + pressedTimer.restart(); + buttonHeld = false; + } else{ + pressedTimer.stop(); } } - onClicked: { + + onReleased: { + if (!buttonHeld) { + return + } switch (buttonAction) { - case ShellSettings.Settings.Flashlight: - FlashlightUtil.toggleTorch(); - return; - case ShellSettings.Settings.Camera: - MobileShell.ShellUtil.launchApp("org.kde.plasma.camera"); - flickable.goToOpenPosition(); - return; + case ShellSettings.Settings.Flashlight: + FlashlightUtil.toggleTorch(); + return; + case ShellSettings.Settings.Camera: + MobileShell.ShellUtil.launchApp("org.kde.plasma.camera"); + flickable.goToOpenPosition(); + return; } } -} \ No newline at end of file + + Timer { + id: pressedTimer + interval: Kirigami.Units.longDuration + repeat: false + onTriggered: { + haptics.buttonVibrate(); + buttonHeld = true; + } + } +}