notifs: lock notif object until anim finish

Also fix notif y position during remove anim
This commit is contained in:
2 * r + 2 * t 2025-06-06 17:47:28 +10:00
parent 9743b34245
commit b5c65ee0bf
3 changed files with 38 additions and 30 deletions

View file

@ -72,7 +72,7 @@ Item {
readonly property alias nonAnimHeight: notif.nonAnimHeight readonly property alias nonAnimHeight: notif.nonAnimHeight
implicitWidth: notif.implicitWidth implicitWidth: notif.implicitWidth
implicitHeight: notif.implicitHeight + (index > 0 ? Appearance.spacing.smaller : 0) implicitHeight: notif.implicitHeight + (index === 0 ? 0 : Appearance.spacing.smaller)
ListView.onRemove: removeAnim.start() ListView.onRemove: removeAnim.start()
@ -115,7 +115,7 @@ Item {
ClippingRectangle { ClippingRectangle {
anchors.top: parent.top anchors.top: parent.top
anchors.topMargin: wrapper.index > 0 ? Appearance.spacing.smaller : 0 anchors.topMargin: wrapper.index === 0 ? 0 : Appearance.spacing.smaller
color: "transparent" color: "transparent"
radius: notif.radius radius: notif.radius

View file

@ -13,12 +13,12 @@ StyledRect {
id: root id: root
required property Notifs.Notif modelData required property Notifs.Notif modelData
readonly property bool hasImage: modelData?.image.length > 0 readonly property bool hasImage: modelData.image.length > 0
readonly property bool hasAppIcon: modelData?.appIcon.length > 0 readonly property bool hasAppIcon: modelData.appIcon.length > 0
readonly property int nonAnimHeight: summary.implicitHeight + (root.expanded ? appName.height + body.height + actions.height + actions.anchors.topMargin : bodyPreview.height) + inner.anchors.margins * 2 readonly property int nonAnimHeight: summary.implicitHeight + (root.expanded ? appName.height + body.height + actions.height + actions.anchors.topMargin : bodyPreview.height) + inner.anchors.margins * 2
property bool expanded property bool expanded
color: root.modelData?.urgency === NotificationUrgency.Critical ? Colours.palette.m3secondaryContainer : Colours.palette.m3surfaceContainer color: root.modelData.urgency === NotificationUrgency.Critical ? Colours.palette.m3secondaryContainer : Colours.palette.m3surfaceContainer
radius: Appearance.rounding.normal radius: Appearance.rounding.normal
implicitWidth: NotifsConfig.sizes.width implicitWidth: NotifsConfig.sizes.width
implicitHeight: inner.implicitHeight implicitHeight: inner.implicitHeight
@ -26,6 +26,11 @@ StyledRect {
x: NotifsConfig.sizes.width x: NotifsConfig.sizes.width
Component.onCompleted: x = 0 Component.onCompleted: x = 0
RetainableLock {
object: root.modelData.notification
locked: true
}
MouseArea { MouseArea {
property int startY property int startY
@ -35,8 +40,8 @@ StyledRect {
acceptedButtons: Qt.LeftButton | Qt.MiddleButton acceptedButtons: Qt.LeftButton | Qt.MiddleButton
preventStealing: true preventStealing: true
onEntered: root.modelData?.timer.stop() onEntered: root.modelData.timer.stop()
onExited: root.modelData?.timer.start() onExited: root.modelData.timer.start()
drag.target: parent drag.target: parent
drag.axis: Drag.XAxis drag.axis: Drag.XAxis
@ -44,12 +49,12 @@ StyledRect {
onPressed: event => { onPressed: event => {
startY = event.y; startY = event.y;
if (event.button === Qt.MiddleButton) if (event.button === Qt.MiddleButton)
root.modelData?.notification.dismiss(); root.modelData.notification.dismiss();
} }
onReleased: event => { onReleased: event => {
if (Math.abs(root.x) < NotifsConfig.sizes.width * NotifsConfig.clearThreshold) if (Math.abs(root.x) < NotifsConfig.sizes.width * NotifsConfig.clearThreshold)
root.x = 0; root.x = 0;
else if (root.modelData) else
root.modelData.popup = false; root.modelData.popup = false;
} }
onPositionChanged: event => { onPositionChanged: event => {
@ -63,7 +68,7 @@ StyledRect {
if (!NotifsConfig.actionOnClick || event.button !== Qt.LeftButton) if (!NotifsConfig.actionOnClick || event.button !== Qt.LeftButton)
return; return;
const actions = root.modelData?.actions; const actions = root.modelData.actions;
if (actions?.length === 1) if (actions?.length === 1)
actions[0].invoke(); actions[0].invoke();
} }
@ -110,7 +115,7 @@ StyledRect {
Image { Image {
anchors.fill: parent anchors.fill: parent
source: Qt.resolvedUrl(root.modelData?.image) source: Qt.resolvedUrl(root.modelData.image)
fillMode: Image.PreserveAspectCrop fillMode: Image.PreserveAspectCrop
cache: false cache: false
asynchronous: true asynchronous: true
@ -131,7 +136,7 @@ StyledRect {
sourceComponent: StyledRect { sourceComponent: StyledRect {
radius: Appearance.rounding.full radius: Appearance.rounding.full
color: root.modelData?.urgency === NotificationUrgency.Critical ? Colours.palette.m3error : root.modelData?.urgency === NotificationUrgency.Low ? Colours.palette.m3surfaceContainerHighest : Colours.palette.m3tertiaryContainer color: root.modelData.urgency === NotificationUrgency.Critical ? Colours.palette.m3error : root.modelData.urgency === NotificationUrgency.Low ? Colours.palette.m3surfaceContainerHighest : Colours.palette.m3tertiaryContainer
implicitWidth: root.hasImage ? NotifsConfig.sizes.badge : NotifsConfig.sizes.image implicitWidth: root.hasImage ? NotifsConfig.sizes.badge : NotifsConfig.sizes.image
implicitHeight: root.hasImage ? NotifsConfig.sizes.badge : NotifsConfig.sizes.image implicitHeight: root.hasImage ? NotifsConfig.sizes.badge : NotifsConfig.sizes.image
@ -142,26 +147,26 @@ StyledRect {
asynchronous: true asynchronous: true
anchors.centerIn: parent anchors.centerIn: parent
visible: !root.modelData?.appIcon.endsWith("symbolic") visible: !root.modelData.appIcon.endsWith("symbolic")
width: Math.round(parent.width * 0.6) width: Math.round(parent.width * 0.6)
height: Math.round(parent.width * 0.6) height: Math.round(parent.width * 0.6)
sourceComponent: IconImage { sourceComponent: IconImage {
implicitSize: Math.round(parent.width * 0.6) implicitSize: Math.round(parent.width * 0.6)
source: Quickshell.iconPath(root.modelData?.appIcon) source: Quickshell.iconPath(root.modelData.appIcon)
asynchronous: true asynchronous: true
} }
} }
Loader { Loader {
active: root.modelData?.appIcon.endsWith("symbolic") ?? false active: root.modelData.appIcon.endsWith("symbolic")
asynchronous: true asynchronous: true
anchors.fill: icon anchors.fill: icon
sourceComponent: Colouriser { sourceComponent: Colouriser {
source: icon source: icon
colorizationColor: root.modelData?.urgency === NotificationUrgency.Critical ? Colours.palette.m3onError : root.modelData?.urgency === NotificationUrgency.Low ? Colours.palette.m3onSurface : Colours.palette.m3onTertiaryContainer colorizationColor: root.modelData.urgency === NotificationUrgency.Critical ? Colours.palette.m3onError : root.modelData.urgency === NotificationUrgency.Low ? Colours.palette.m3onSurface : Colours.palette.m3onTertiaryContainer
} }
} }
@ -172,7 +177,7 @@ StyledRect {
sourceComponent: MaterialIcon { sourceComponent: MaterialIcon {
text: { text: {
const summary = root.modelData?.summary.toLowerCase() ?? ""; const summary = root.modelData.summary.toLowerCase();
if (summary.includes("reboot")) if (summary.includes("reboot"))
return "restart_alt"; return "restart_alt";
if (summary.includes("recording")) if (summary.includes("recording"))
@ -191,12 +196,12 @@ StyledRect {
return "update"; return "update";
if (summary.startsWith("file")) if (summary.startsWith("file"))
return "folder_copy"; return "folder_copy";
if (root.modelData?.urgency === NotificationUrgency.Critical) if (root.modelData.urgency === NotificationUrgency.Critical)
return "release_alert"; return "release_alert";
return "chat"; return "chat";
} }
color: root.modelData?.urgency === NotificationUrgency.Critical ? Colours.palette.m3onError : root.modelData?.urgency === NotificationUrgency.Low ? Colours.palette.m3onSurface : Colours.palette.m3onTertiaryContainer color: root.modelData.urgency === NotificationUrgency.Critical ? Colours.palette.m3onError : root.modelData.urgency === NotificationUrgency.Low ? Colours.palette.m3onSurface : Colours.palette.m3onTertiaryContainer
font.pointSize: Appearance.font.size.large font.pointSize: Appearance.font.size.large
} }
} }
@ -226,7 +231,7 @@ StyledRect {
TextMetrics { TextMetrics {
id: appNameMetrics id: appNameMetrics
text: root.modelData?.appName ?? "" text: root.modelData.appName
font.family: appName.font.family font.family: appName.font.family
font.pointSize: appName.font.pointSize font.pointSize: appName.font.pointSize
elide: Text.ElideRight elide: Text.ElideRight
@ -279,7 +284,7 @@ StyledRect {
TextMetrics { TextMetrics {
id: summaryMetrics id: summaryMetrics
text: root.modelData?.summary ?? "" text: root.modelData.summary
font.family: summary.font.family font.family: summary.font.family
font.pointSize: summary.font.pointSize font.pointSize: summary.font.pointSize
elide: Text.ElideRight elide: Text.ElideRight
@ -325,7 +330,7 @@ StyledRect {
animate: true animate: true
horizontalAlignment: Text.AlignLeft horizontalAlignment: Text.AlignLeft
text: root.modelData?.timeStr ?? "" text: root.modelData.timeStr
color: Colours.palette.m3onSurfaceVariant color: Colours.palette.m3onSurfaceVariant
font.pointSize: Appearance.font.size.small font.pointSize: Appearance.font.size.small
} }
@ -382,7 +387,7 @@ StyledRect {
TextMetrics { TextMetrics {
id: bodyPreviewMetrics id: bodyPreviewMetrics
text: root.modelData?.body ?? "" text: root.modelData.body
font.family: bodyPreview.font.family font.family: bodyPreview.font.family
font.pointSize: bodyPreview.font.pointSize font.pointSize: bodyPreview.font.pointSize
elide: Text.ElideRight elide: Text.ElideRight
@ -399,7 +404,7 @@ StyledRect {
animate: true animate: true
textFormat: Text.MarkdownText textFormat: Text.MarkdownText
text: root.modelData?.body ?? "" text: root.modelData.body
color: Colours.palette.m3onSurfaceVariant color: Colours.palette.m3onSurfaceVariant
font.pointSize: Appearance.font.size.small font.pointSize: Appearance.font.size.small
wrapMode: Text.WrapAtWordBoundaryOrAnywhere wrapMode: Text.WrapAtWordBoundaryOrAnywhere
@ -427,7 +432,7 @@ StyledRect {
} }
Repeater { Repeater {
model: root.modelData?.actions ?? 0 model: root.modelData.actions
delegate: StyledRect { delegate: StyledRect {
id: action id: action
@ -446,7 +451,7 @@ StyledRect {
radius: Appearance.rounding.full radius: Appearance.rounding.full
function onClicked(): void { function onClicked(): void {
action.modelData?.invoke(); action.modelData.invoke();
} }
} }
@ -462,12 +467,12 @@ StyledRect {
TextMetrics { TextMetrics {
id: actionTextMetrics id: actionTextMetrics
text: modelData?.text ?? "" text: modelData.text
font.family: actionText.font.family font.family: actionText.font.family
font.pointSize: actionText.font.pointSize font.pointSize: actionText.font.pointSize
elide: Text.ElideRight elide: Text.ElideRight
elideWidth: { elideWidth: {
const numActions = root.modelData?.actions.length; const numActions = root.modelData.actions.length;
return (inner.width - actions.spacing * (numActions - 1)) / numActions - Appearance.padding.normal * 2; return (inner.width - actions.spacing * (numActions - 1)) / numActions - Appearance.padding.normal * 2;
} }
} }

View file

@ -78,10 +78,13 @@ Singleton {
} }
readonly property Connections conn: Connections { readonly property Connections conn: Connections {
target: notif.notification target: notif.notification.Retainable
function onClosed(): void { function onDropped(): void {
root.list.splice(root.list.indexOf(notif), 1); root.list.splice(root.list.indexOf(notif), 1);
}
function onAboutToDestroy(): void {
notif.destroy(); notif.destroy();
} }
} }