Made notification panel scrollable

This commit is contained in:
2026-05-12 00:00:38 -04:00
parent 5d7d03a441
commit 2b6c1b1fc8
2 changed files with 106 additions and 114 deletions

View File

@@ -14,14 +14,11 @@ Item {
required property real notificationRounding required property real notificationRounding
property real spacing: 8 property real spacing: 8
Layout.fillWidth: true implicitWidth: textWidth
implicitHeight: content.implicitHeight implicitHeight: content.implicitHeight
ColumnLayout { ColumnLayout {
id: content id: content
Layout.fillWidth: true
spacing: 0 spacing: 0
Rectangle { Rectangle {
implicitHeight: appTitle.implicitHeight implicitHeight: appTitle.implicitHeight
@@ -33,8 +30,8 @@ Item {
RowLayout { RowLayout {
spacing: 0 // For some reason, adding a spacing of just the value will not work properly spacing: 0 // For some reason, adding a spacing of just the value will not work properly
IconImage { IconImage {
visible: root.notif.appIcon.length > 0
id: appIcon id: appIcon
visible: root.notif.appIcon.length > 0
source: Quickshell.iconPath(root.notif.appIcon) source: Quickshell.iconPath(root.notif.appIcon)
width: appTitle.height - root.spacing width: appTitle.height - root.spacing
height: appTitle.height - root.spacing height: appTitle.height - root.spacing
@@ -61,20 +58,20 @@ Item {
id: body id: body
spacing: root.spacing spacing: root.spacing
Text { Text {
id: notifSummary
visible: root.notif.summary.length > 0 visible: root.notif.summary.length > 0
Layout.leftMargin: root.spacing Layout.leftMargin: root.spacing
Layout.rightMargin: root.spacing Layout.rightMargin: root.spacing
id: notifSummary
text: root.notif.summary text: root.notif.summary
color: Appearance.colors.colOnLayer2 color: Appearance.colors.colOnLayer2
wrapMode: Text.WordWrap wrapMode: Text.WordWrap
} }
Text { Text {
id: notifBody
visible: root.notif.body.length > 0 visible: root.notif.body.length > 0
Layout.leftMargin: root.spacing Layout.leftMargin: root.spacing
Layout.rightMargin: root.spacing Layout.rightMargin: root.spacing
Layout.preferredWidth: textWidth Layout.preferredWidth: textWidth
id: notifBody
text: root.notif.body text: root.notif.body
color: Appearance.colors.colOnLayer2 color: Appearance.colors.colOnLayer2
wrapMode: Text.WordWrap wrapMode: Text.WordWrap

View File

@@ -64,32 +64,27 @@ Scope {
hideTimer.stop(); hideTimer.stop();
} }
ColumnLayout { ListView {
id: notifs id: notifs
anchors.fill: parent
anchors.margins: 4 anchors.margins: 4
Layout.fillWidth: true clip: true
anchors.left: parent.left spacing: 4
anchors.right: parent.right model: NotificationService.notifications
visible: NotificationService.amountNotifications > 0 header: RippleButton {
// Dismiss All Button
RippleButton {
buttonText: "Dismiss All" buttonText: "Dismiss All"
buttonTextColor: Appearance.m3colors.m3onTertiaryContainer buttonTextColor: Appearance.m3colors.m3onTertiaryContainer
colBackground: Appearance.m3colors.m3tertiaryContainer colBackground: Appearance.m3colors.m3tertiaryContainer
releaseAction: NotificationService.dismissAll releaseAction: NotificationService.dismissAll
buttonRadius: Appearance.rounding.unsharpenmore buttonRadius: Appearance.rounding.unsharpenmore
Layout.fillWidth: true width: notifs.width - 8
} }
delegate: NotificationItem {
Repeater {
model: NotificationService.notifications
NotificationItem {
required property Notification modelData required property Notification modelData
notif: modelData notif: modelData
textWidth: root.panelWidth - 14 textWidth: notifs.width - 8
notificationRounding: Appearance.rounding.unsharpenmore notificationRounding: Appearance.rounding.unsharpenmore
} Layout.fillWidth: true
} }
} }
} }