feat: lock screen copy and transitions

RainAfterDark · RainAfterDark · commit fcc44c042c8b · 2026-04-01T23:15:22.000+08:00
- additionally add python3 and lefthook install shellHook in shell.nix
diff --git a/Assets/Translations/en-GB.json b/Assets/Translations/en-GB.json
@@ -1424,8 +1424,10 @@
       "enable-lockscreen-media-controls-label": "Lock screen media controls",
       "lock-on-suspend-description": "Automatically lock the screen when suspending the system.",
       "lock-on-suspend-label": "Lock on suspend",
-      "lock-screen-animations-description": "Enable or disable lockscreen animations.",
-      "lock-screen-animations-label": "Lockscreen animations",
+      "lock-screen-animations-description": "Enable or disable lock screen animations and transitions.",
+      "lock-screen-animations-label": "Lock screen animations",
+      "lock-screen-copy-bg-description": "Instead of the wallpaper, use a screenshot of the desktop as the background of the lockscreen.",
+      "lock-screen-copy-bg-label": "Use screenshot as background",
       "lock-screen-blur-strength-description": "Applies a blur effect to the lock screen wallpaper.",
       "lock-screen-blur-strength-label": "Lock screen blur strength",
       "lock-screen-tint-strength-description": "Applies a tint overlay to the lock screen wallpaper.",
@@ -2246,4 +2248,4 @@
       "weak": "Weak"
     }
   }
-}
+}
diff --git a/Assets/Translations/en.json b/Assets/Translations/en.json
@@ -1424,8 +1424,10 @@
       "enable-lockscreen-media-controls-label": "Lock screen media controls",
       "lock-on-suspend-description": "Automatically lock the screen when suspending the system.",
       "lock-on-suspend-label": "Lock on suspend",
-      "lock-screen-animations-description": "Enable or disable lockscreen animations.",
-      "lock-screen-animations-label": "Lockscreen animations",
+      "lock-screen-animations-description": "Enable or disable lock screen animations and transitions.",
+      "lock-screen-animations-label": "Lock screen animations",
+      "lock-screen-copy-bg-description": "Instead of the wallpaper, use a screenshot of the desktop as the background of the lockscreen.",
+      "lock-screen-copy-bg-label": "Use screenshot as background",
       "lock-screen-blur-strength-description": "Applies a blur effect to the lock screen wallpaper.",
       "lock-screen-blur-strength-label": "Lock screen blur strength",
       "lock-screen-tint-strength-description": "Applies a tint overlay to the lock screen wallpaper.",
@@ -2246,4 +2248,4 @@
       "weak": "Weak"
     }
   }
-}
+}
diff --git a/Assets/settings-search-index.json b/Assets/settings-search-index.json
@@ -1718,6 +1718,15 @@
     "subTab": 0,
     "subTabLabel": "common.appearance"
   },
+  {
+    "labelKey": "panels.lock-screen.lock-screen-copy-bg-label",
+    "descriptionKey": "panels.lock-screen.lock-screen-copy-bg-description",
+    "widget": "NToggle",
+    "tab": 11,
+    "tabLabel": "panels.lock-screen.title",
+    "subTab": 0,
+    "subTabLabel": "common.appearance"
+  },
   {
     "labelKey": "panels.lock-screen.lock-screen-blur-strength-label",
     "descriptionKey": "panels.lock-screen.lock-screen-blur-strength-description",
diff --git a/Commons/Settings.qml b/Commons/Settings.qml
@@ -286,6 +286,7 @@ Singleton {
       property bool animationDisabled: false
       property bool compactLockScreen: false
       property bool lockScreenAnimations: false
+      property bool lockScreenCopyBg: false
       property bool lockOnSuspend: true
       property bool showSessionButtonsOnLockScreen: true
       property bool showHibernateOnLockScreen: false
diff --git a/Modules/LockScreen/LockScreen.qml b/Modules/LockScreen/LockScreen.qml
@@ -66,12 +66,45 @@ Loader {
     Item {
       id: lockContainer
 
+      readonly property bool transitionsEnabled: Settings.data.general.lockScreenAnimations
+
+      property real transitionProgress: transitionsEnabled ? 0.0 : 1.0
+
+      NumberAnimation {
+        id: lockEnter
+        target: lockContainer
+        property: "transitionProgress"
+        to: 1.0
+        duration: Style.animationNormal
+        easing.type: Easing.OutCubic
+        running: transitionsEnabled
+      }
+
+      function unlockScreen() {
+        lockSession.locked = false;
+        root.scheduleUnloadAfterUnlock();
+        lockContext.currentText = "";
+      }
+
+      NumberAnimation {
+        id: lockExit
+        target: lockContainer
+        property: "transitionProgress"
+        to: 0.0
+        duration: Style.animationNormal
+        easing.type: Easing.InCubic
+        onFinished: unlockScreen()
+      }
+
       LockContext {
         id: lockContext
         onUnlocked: {
-          lockSession.locked = false;
-          root.scheduleUnloadAfterUnlock();
-          lockContext.currentText = "";
+          if (transitionsEnabled) {
+            lockEnter.stop();
+            lockExit.start();
+            return;
+          }
+          unlockScreen();
         }
         onFailed: {
           lockContext.currentText = "";
@@ -123,10 +156,12 @@ Loader {
               LockScreenBackground {
                 id: backgroundComponent
                 screen: lockSurface.screen
+                transitionProgress: lockContainer.transitionProgress
               }
 
               Item {
                 anchors.fill: parent
+                opacity: lockContainer.transitionProgress
 
                 // Mouse area to trigger focus on cursor movement (workaround for Hyprland focus issues)
                 MouseArea {
diff --git a/Modules/LockScreen/LockScreenBackground.qml b/Modules/LockScreen/LockScreenBackground.qml
@@ -1,6 +1,7 @@
 import QtQuick
 import QtQuick.Effects
 import Quickshell
+import Quickshell.Wayland
 import qs.Commons
 import qs.Services.Compositor
 import qs.Services.Power
@@ -10,11 +11,18 @@ Item {
   id: root
   anchors.fill: parent
 
+  required property ShellScreen screen
+
   // Cached wallpaper path - exposed for parent components
   property string resolvedWallpaperPath: ""
-  property color tintColor: Settings.data.colorSchemes.darkMode ? Color.mSurface : Color.mOnSurface
 
-  required property var screen
+  // Enter / exit transtion value
+  property real transitionProgress: 1.0
+
+  readonly property color tintColor: Settings.data.colorSchemes.darkMode ? Color.mSurface : Color.mOnSurface
+  readonly property bool useEffects: !PowerProfileService.noctaliaPerformanceMode || !Settings.data.noctaliaPerformance.disableWallpaper
+  readonly property bool useScreencopy: Settings.data.general.lockScreenCopyBg
+  readonly property bool useWallpaper: Settings.data.wallpaper.enabled && resolvedWallpaperPath !== ""
 
   // Request preprocessed wallpaper when lock screen becomes active or dimensions change
   Component.onCompleted: {
@@ -103,35 +111,56 @@ Item {
     });
   }
 
-  // Background - solid color or black fallback
+  // Opaque black at the very bottom to prevent white flash
   Rectangle {
     anchors.fill: parent
-    color: Settings.data.wallpaper.useSolidColor ? Settings.data.wallpaper.solidColor : "#000000"
+    color: "black"
   }
 
+  // A copy of the screen to use as background
+  // Also used as fade in / fade out backdrop
+  ScreencopyView {
+    id: lockBgScreencopy
+    visible: useEffects && (useScreencopy || useWallpaper)
+    anchors.fill: parent
+    captureSource: screen
+  }
+
+  // If using a solid color wallpaper
+  Rectangle {
+    anchors.fill: parent
+    opacity: (Settings.data.wallpaper.useSolidColor && useEffects) ? transitionProgress : 0.0
+    color: Settings.data.wallpaper.solidColor
+  }
+
+  // If using an image wallpaper
   Image {
     id: lockBgImage
-    visible: source !== "" && Settings.data.wallpaper.enabled && !Settings.data.wallpaper.useSolidColor && (!PowerProfileService.noctaliaPerformanceMode || !Settings.data.noctaliaPerformance.disableWallpaper)
+    visible: false // rendered with effects below
     anchors.fill: parent
     fillMode: Image.PreserveAspectCrop
     source: resolvedWallpaperPath
     cache: false
     smooth: true
     mipmap: false
     antialiasing: true
+  }
 
-    layer.enabled: Settings.data.general.lockScreenBlur > 0 && !PowerProfileService.noctaliaPerformanceMode
-    layer.smooth: false
-    layer.effect: MultiEffect {
-      blurEnabled: true
-      blur: Settings.data.general.lockScreenBlur
-      blurMax: 48
-    }
+  // Applies the image wallpaper or screen copy with effects
+  MultiEffect {
+    id: lockBgRender
+    anchors.fill: parent
+    opacity: transitionProgress
+    visible: useEffects && (useScreencopy || useWallpaper)
+    source: useScreencopy ? lockBgScreencopy : lockBgImage
+
+    blurEnabled: Settings.data.general.lockScreenBlur > 0
+    blur: Settings.data.general.lockScreenBlur
+    blurMax: 128
 
-    // Tint overlay
     Rectangle {
       anchors.fill: parent
-      color: root.tintColor
+      color: tintColor
       opacity: Settings.data.general.lockScreenTint
     }
   }
diff --git a/Modules/Panels/Settings/Tabs/LockScreen/AppearanceSubTab.qml b/Modules/Panels/Settings/Tabs/LockScreen/AppearanceSubTab.qml
@@ -93,6 +93,14 @@ ColumnLayout {
     defaultValue: Settings.getDefaultValue("general.lockScreenAnimations")
   }
 
+  NToggle {
+    label: I18n.tr("panels.lock-screen.lock-screen-copy-bg-label")
+    description: I18n.tr("panels.lock-screen.lock-screen-copy-bg-description")
+    checked: Settings.data.general.lockScreenCopyBg
+    onToggled: checked => Settings.data.general.lockScreenCopyBg = checked
+    defaultValue: Settings.getDefaultValue("general.lockScreenCopyBg")
+  }
+
   NValueSlider {
     Layout.fillWidth: true
     label: I18n.tr("panels.lock-screen.lock-screen-blur-strength-label")
diff --git a/nix/shell.nix b/nix/shell.nix
@@ -7,6 +7,7 @@
   shellcheck,
   jsonfmt,
   lefthook,
+  python3,
   kdePackages,
   mkShellNoCC,
 }:
@@ -29,6 +30,11 @@ mkShellNoCC {
 
     # CoC
     lefthook # githooks
+    python3 # dev scripts
     kdePackages.qtdeclarative # qmlfmt, qmllint, qmlls and etc; Qt6
   ];
+
+  shellHook = ''
+    lefthook install
+  '';
 }
