lock: show status on small screens

Hide notifs but show status
This commit is contained in:
2 * r + 2 * t 2025-07-22 16:12:21 +10:00
parent b3e9bcfc2d
commit 0b520dc28b
2 changed files with 99 additions and 97 deletions

View file

@ -69,8 +69,8 @@ WlSessionLockSurface {
weatherWidth: weather.implicitWidth weatherWidth: weather.implicitWidth
buttonsWidth: buttons.item?.nonAnimWidth ?? 0 buttonsWidth: buttons.item?.nonAnimWidth ?? 0
buttonsHeight: buttons.item?.nonAnimHeight ?? 0 buttonsHeight: buttons.item?.nonAnimHeight ?? 0
statusWidth: status.item?.nonAnimWidth ?? 0 statusWidth: status.nonAnimWidth ?? 0
statusHeight: status.item?.nonAnimHeight ?? 0 statusHeight: status.nonAnimHeight ?? 0
isNormal: root.screen.width > Config.lock.sizes.smallScreenWidth isNormal: root.screen.width > Config.lock.sizes.smallScreenWidth
isLarge: root.screen.width > Config.lock.sizes.largeScreenWidth isLarge: root.screen.width > Config.lock.sizes.largeScreenWidth
@ -162,17 +162,15 @@ WlSessionLockSurface {
sourceComponent: Buttons {} sourceComponent: Buttons {}
} }
Loader { Status {
id: status id: status
active: root.screen.width > Config.lock.sizes.largeScreenWidth
anchors.bottom: parent.top anchors.bottom: parent.top
anchors.left: parent.right anchors.left: parent.right
anchors.bottomMargin: -backgrounds.statusBottom anchors.bottomMargin: -backgrounds.statusBottom
anchors.leftMargin: -backgrounds.statusLeft anchors.leftMargin: -backgrounds.statusLeft
sourceComponent: Status {} showNotifs: root.screen.width > Config.lock.sizes.largeScreenWidth
} }
component Anim: NumberAnimation { component Anim: NumberAnimation {

View file

@ -10,13 +10,15 @@ import QtQuick
import QtQuick.Layouts import QtQuick.Layouts
WrapperItem { WrapperItem {
readonly property real nonAnimWidth: (notifs.count > 0 ? Config.notifs.sizes.width : status.implicitWidth) + margin property alias showNotifs: notifs.active
readonly property real nonAnimWidth: (notifs.item?.count > 0 ? Config.notifs.sizes.width : status.implicitWidth) + margin
readonly property real nonAnimHeight: { readonly property real nonAnimHeight: {
if (notifs.count > 0) { if (notifs.active && notifs.item.count > 0) {
const count = Math.min(notifs.count, Config.lock.maxNotifs); const count = Math.min(notifs.item.count, Config.lock.maxNotifs);
let height = status.implicitHeight + Appearance.spacing.normal + Appearance.spacing.smaller * (count - 1); let height = status.implicitHeight + Appearance.spacing.normal + Appearance.spacing.smaller * (count - 1);
for (let i = 0; i < count; i++) for (let i = 0; i < count; i++)
height += notifs.itemAtIndex(i)?.nonAnimHeight ?? 0; height += notifs.item.itemAtIndex(i)?.nonAnimHeight ?? 0;
return height + margin; return height + margin;
} }
@ -33,7 +35,7 @@ WrapperItem {
Timer { Timer {
running: true running: true
interval: 10 interval: 10
onTriggered: notifs.countChanged() onTriggered: notifs.item?.countChanged()
} }
Behavior on implicitWidth { Behavior on implicitWidth {
@ -118,113 +120,115 @@ WrapperItem {
} }
} }
ListView { Loader {
id: notifs id: notifs
Layout.fillWidth: true Layout.fillWidth: true
Layout.fillHeight: true Layout.fillHeight: true
model: ScriptModel { sourceComponent: ListView {
values: [...Notifs.list].reverse() model: ScriptModel {
} values: [...Notifs.list].reverse()
orientation: Qt.Vertical
spacing: 0
clip: true
interactive: false
delegate: Item {
id: wrapper
required property Notifs.Notif modelData
required property int index
readonly property alias nonAnimHeight: notif.nonAnimHeight
property int idx
onIndexChanged: {
if (index !== -1)
idx = index;
} }
implicitWidth: notif.implicitWidth orientation: Qt.Vertical
implicitHeight: notif.nonAnimHeight + (idx === 0 ? 0 : Appearance.spacing.smaller) spacing: 0
clip: true
interactive: false
ListView.onRemove: removeAnim.start() delegate: Item {
id: wrapper
SequentialAnimation { required property Notifs.Notif modelData
id: removeAnim required property int index
readonly property alias nonAnimHeight: notif.nonAnimHeight
property int idx
PropertyAction { onIndexChanged: {
target: wrapper if (index !== -1)
property: "ListView.delayRemove" idx = index;
value: true
} }
PropertyAction {
target: wrapper implicitWidth: notif.implicitWidth
property: "enabled" implicitHeight: notif.nonAnimHeight + (idx === 0 ? 0 : Appearance.spacing.smaller)
value: false
ListView.onRemove: removeAnim.start()
SequentialAnimation {
id: removeAnim
PropertyAction {
target: wrapper
property: "ListView.delayRemove"
value: true
}
PropertyAction {
target: wrapper
property: "enabled"
value: false
}
PropertyAction {
target: wrapper
property: "implicitHeight"
value: 0
}
PropertyAction {
target: wrapper
property: "z"
value: 1
}
Anim {
target: notif
property: "x"
to: (notif.x >= 0 ? Config.notifs.sizes.width : -Config.notifs.sizes.width) * 2
duration: Appearance.anim.durations.normal
easing.bezierCurve: Appearance.anim.curves.emphasized
}
PropertyAction {
target: wrapper
property: "ListView.delayRemove"
value: false
}
} }
PropertyAction {
target: wrapper ClippingRectangle {
property: "implicitHeight" anchors.top: parent.top
value: 0 anchors.topMargin: wrapper.idx === 0 ? 0 : Appearance.spacing.smaller
}
PropertyAction { color: "transparent"
target: wrapper radius: notif.radius
property: "z" implicitWidth: notif.implicitWidth
value: 1 implicitHeight: notif.nonAnimHeight
Notification {
id: notif
modelData: wrapper.modelData
}
} }
}
move: Transition {
Anim { Anim {
target: notif property: "y"
property: "x" duration: Appearance.anim.durations.large
to: (notif.x >= 0 ? Config.notifs.sizes.width : -Config.notifs.sizes.width) * 2
duration: Appearance.anim.durations.normal
easing.bezierCurve: Appearance.anim.curves.emphasized easing.bezierCurve: Appearance.anim.curves.emphasized
} }
PropertyAction { }
target: wrapper
property: "ListView.delayRemove" displaced: Transition {
value: false Anim {
property: "y"
duration: Appearance.anim.durations.large
easing.bezierCurve: Appearance.anim.curves.emphasized
} }
} }
ClippingRectangle { ExtraIndicator {
anchors.top: parent.top anchors.bottom: parent.bottom
anchors.topMargin: wrapper.idx === 0 ? 0 : Appearance.spacing.smaller extra: Notifs.list.length - Config.lock.maxNotifs
color: "transparent"
radius: notif.radius
implicitWidth: notif.implicitWidth
implicitHeight: notif.nonAnimHeight
Notification {
id: notif
modelData: wrapper.modelData
}
} }
} }
move: Transition {
Anim {
property: "y"
duration: Appearance.anim.durations.large
easing.bezierCurve: Appearance.anim.curves.emphasized
}
}
displaced: Transition {
Anim {
property: "y"
duration: Appearance.anim.durations.large
easing.bezierCurve: Appearance.anim.curves.emphasized
}
}
ExtraIndicator {
anchors.bottom: parent.bottom
extra: Notifs.list.length - Config.lock.maxNotifs
}
} }
} }