lockscreen: Refactor and lazy load notifications

look-and-feel/contents/lockscreen/HeaderComponent.qml

@@ -12,20 +12,15 @@ import org.kde.plasma.private.mobileshell 1.0 as MobileShell
 
 import org.kde.notificationmanager 1.0 as NotificationManager
 
-Loader {
+Item {
     id: root
-    
     required property real openFactor
-    
-    readonly property real statusBarHeight: PlasmaCore.Units.gridUnit * 1.25
+    required property real statusBarHeight
 
     property var notificationsModel: []
 
     signal passwordRequested()
 
-    asynchronous: true
-    
-    sourceComponent: Item {
     // top status bar
     MobileShell.StatusBar {
         id: statusBar
@@ -57,6 +52,7 @@ Loader {
         id: drawer
         anchors.fill: parent
 
+        visible: offset !== 0
         restrictedPermissions: true
 
         notificationSettings: NotificationManager.Settings {}
@@ -88,4 +84,3 @@ Loader {
         }
     }
 }
-}

look-and-feel/contents/lockscreen/LockScreen.qml

@@ -20,7 +20,7 @@ import org.kde.kirigami 2.12 as Kirigami
  *
  * Special attention must be paid to ensuring the GUI loads as fast as possible.
  */
-PlasmaCore.ColorScope {
+Item {
     id: root
 
     property var lockScreenState: LockScreenState {}
@@ -33,9 +33,6 @@ PlasmaCore.ColorScope {
     readonly property bool drawerOpen: flickable.openFactor >= 1
     property var passwordBar: keypadLoader.item.passwordBar
 
-    colorGroup: PlasmaCore.Theme.ComplementaryColorGroup
-    anchors.fill: parent
-    
     // listen for keyboard events, and focus on input area
     Component.onCompleted: forceActiveFocus();
     Keys.onPressed: {
@@ -66,17 +63,6 @@ PlasmaCore.ColorScope {
         }
     }
 
-    // header bar and action drawer
-    HeaderComponent {
-        id: headerBar
-        z: 1 // on top of flick area
-        anchors.fill: parent
-        
-        openFactor: flickable.openFactor
-        notificationsModel: root.notifModel
-        onPasswordRequested: root.askPassword()
-    }
-    
     Connections {
         target: root.lockScreenState
 
@@ -86,6 +72,27 @@ PlasmaCore.ColorScope {
         }
     }
 
+    PlasmaCore.ColorScope {
+        anchors.fill: parent
+        colorGroup: PlasmaCore.Theme.ComplementaryColorGroup
+
+        // header bar and action drawer
+        Loader {
+            id: headerBarLoader
+            z: 1 // on top of flick area
+            readonly property real statusBarHeight: PlasmaCore.Units.gridUnit * 1.25
+
+            anchors.fill: parent
+            asynchronous: true
+
+            sourceComponent: HeaderComponent {
+                statusBarHeight: headerBarLoader.statusBarHeight
+                openFactor: flickable.openFactor
+                notificationsModel: root.notifModel
+                onPasswordRequested: root.askPassword()
+            }
+        }
+
         FlickContainer {
             id: flickable
             anchors.fill: parent
@@ -158,7 +165,7 @@ PlasmaCore.ColorScope {
 
                     onPasswordRequested: flickable.goToOpenPosition()
 
-                anchors.topMargin: headerBar.statusBarHeight
+                    anchors.topMargin: headerBarLoader.statusBarHeight
                     anchors.top: parent.top
                     anchors.bottom: scrollUpIconLoader.top
                     anchors.left: parent.left
@@ -246,3 +253,4 @@ PlasmaCore.ColorScope {
             }
         }
     }
+}

look-and-feel/contents/lockscreen/LockScreenNarrowContent.qml

@@ -15,8 +15,8 @@ Loader {
     id: root
 
     required property var lockScreenState
-    property var notificationsModel: []
 
+    property var notificationsModel: []
     property bool notificationsShown: false
 
     property real fullHeight
@@ -27,11 +27,11 @@ Loader {
     onLoaded: loadTimer.restart();
     Timer {
         id: loadTimer
-        interval: PlasmaCore.Units.longDuration
+        interval: 200
     }
 
     // move while swiping up
-    transform: Translate { y: Math.round((1 - phoneComponent.opacity) * (-root.height / 6)) }
+    transform: Translate { y: Math.round((1 - root.opacity) * (-root.height / 6)) }
 
     asynchronous: true
     sourceComponent: Item {
@@ -47,8 +47,8 @@ Loader {
             // animate
             Behavior on anchors.topMargin {
                 NumberAnimation {
-                    duration: loadTimer.running ? 0 : PlasmaCore.Units.longDuration
-                    easing.type: Easing.InOutQuad
+                    duration: loadTimer.running ? 0 : PlasmaCore.Units.veryLongDuration
+                    easing.type: Easing.InOutExpo
                 }
             }
 

look-and-feel/contents/lockscreen/LockScreenWideScreenContent.qml

@@ -15,8 +15,8 @@ Loader {
     id: root
     
     required property var lockScreenState
-    property var notificationsModel: []
     
+    property var notificationsModel: []
     property bool notificationsShown: false
     
     signal passwordRequested()

look-and-feel/contents/lockscreen/NotificationsComponent.qml

@@ -14,23 +14,30 @@ import org.kde.plasma.private.mobileshell 1.0 as MobileShell
 
 import org.kde.notificationmanager 1.0 as NotificationManager
 
-Rectangle {
+Loader {
     id: root
     required property var lockScreenState
+
     property var notificationsModel: []
     property var notificationSettings: NotificationManager.Settings {}
 
-    readonly property bool notificationsShown: notificationsList.hasNotifications
-    
-    signal passwordRequested()
-    
     property real leftMargin: 0
     property real rightMargin: 0
     property real topMargin: 0
     property real bottomMargin: 0
+    readonly property bool notificationsShown: item && item.notificationsList.hasNotifications
 
-    color: "transparent"
-    clip: true
+    property var notificationsList: item ? item.notificationsList : null
+
+    signal passwordRequested()
+
+    // perform delayed loading of notifications
+    active: false
+    Timer {
+        interval: 500
+        running: true
+        onTriggered: root.active = true
+    }
 
     Connections {
         target: lockScreenState
@@ -48,6 +55,11 @@ Rectangle {
         }
     }
 
+    sourceComponent: Item {
+        clip: true
+
+        property alias notificationsList: notificationsList
+
         PlasmaCore.ColorScope {
             anchors.fill: parent
             anchors.topMargin: root.topMargin
@@ -74,3 +86,4 @@ Rectangle {
             }
         }
     }
+}