1
0
mirror of https://github.com/AvengeMedia/DankMaterialShell.git synced 2025-12-06 21:45:38 -05:00

revise notification position and animations

This commit is contained in:
bbedward
2025-07-26 10:08:56 -04:00
parent 308d84bfa1
commit 7b8efd9114
7 changed files with 118 additions and 57 deletions

View File

@@ -7,44 +7,79 @@ import Quickshell
Singleton { Singleton {
id: root id: root
// Durations match M3 token tiers: short4/medium4/long4
readonly property int durShort: 200 readonly property int durShort: 200
readonly property int durMed: 400 readonly property int durMed: 450
readonly property int durLong: 600 readonly property int durLong: 600
readonly property int slidePx: 80 readonly property int slidePx: 80
// Material Design 3 motion curves
readonly property var emphasized: [0.05, 0, 2/15, 0.06, 1/6, 0.4, 5/24, 0.82, 0.25, 1, 1, 1]
readonly property var emphasizedDecel: [0.05, 0.7, 0.1, 1, 1, 1]
readonly property var standard: [0.2, 0, 0, 1, 1, 1]
readonly property QtObject direction: QtObject { // Material Design 3 motion curves (for QML BezierSpline)
readonly property int fromLeft: 0 // Use groups of: [cx1, cy1, cx2, cy2, endX, endY, ...]
readonly property int fromRight: 1 // Single-segment cubics end with 1,1.
readonly property int fadeOnly: 2
}
readonly property Component slideInLeft: Transition { // Emphasized (multi-segment) for on-screen-to-on-screen moves
NumberAnimation { properties: "x"; from: -Anims.slidePx; to: 0; duration: Anims.durMed; easing.type: Easing.OutQuart } readonly property var emphasized: [
} 0.05, 0.00, 0.133333, 0.06, 0.166667, 0.40,
0.208333, 0.82, 0.25, 1.00, 1.00, 1.00
]
readonly property Component slideOutLeft: Transition { // Emphasized decelerate entering
NumberAnimation { properties: "x"; to: -Anims.slidePx; duration: Anims.durShort; easing.type: Easing.InQuart } readonly property var emphasizedDecel: [ 0.05, 0.70, 0.10, 1.00, 1.00, 1.00 ]
}
readonly property Component slideInRight: Transition { // Emphasized accelerate exiting
NumberAnimation { properties: "x"; from: Anims.slidePx; to: 0; duration: Anims.durMed; easing.type: Easing.OutQuart } readonly property var emphasizedAccel: [ 0.30, 0.00, 0.80, 0.15, 1.00, 1.00 ]
}
readonly property Component slideOutRight: Transition { // Standard set for small/subtle transitions
NumberAnimation { properties: "x"; to: Anims.slidePx; duration: Anims.durShort; easing.type: Easing.InQuart } readonly property var standard: [ 0.20, 0.00, 0.00, 1.00, 1.00, 1.00 ]
} readonly property var standardDecel: [ 0.00, 0.00, 0.00, 1.00, 1.00, 1.00 ]
readonly property var standardAccel: [ 0.30, 0.00, 1.00, 1.00, 1.00, 1.00 ]
readonly property Component fadeIn: Transition { // readonly property QtObject direction: QtObject {
NumberAnimation { properties: "opacity"; from: 0.0; to: 1.0; duration: Anims.durMed; easing.type: Easing.OutQuart } // readonly property int fromLeft: 0
} // readonly property int fromRight: 1
// readonly property int fadeOnly: 2
// }
readonly property Component fadeOut: Transition { // // Slide transitions (surface/large moves)
NumberAnimation { properties: "opacity"; to: 0.0; duration: Anims.durShort; easing.type: Easing.InQuart } // // Enter = emphasizedDecel, Exit = emphasizedAccel
} // readonly property Component slideInLeft: Transition {
} // NumberAnimation {
// properties: "x"; from: -root.slidePx; to: 0; duration: root.durMed
// easing.type: Easing.BezierSpline; easing.bezierCurve: root.emphasizedDecel
// }
// }
// readonly property Component slideOutLeft: Transition {
// NumberAnimation {
// properties: "x"; to: -root.slidePx; duration: root.durShort
// easing.type: Easing.BezierSpline; easing.bezierCurve: root.emphasizedAccel
// }
// }
// readonly property Component slideInRight: Transition {
// NumberAnimation {
// properties: "x"; from: root.slidePx; to: 0; duration: root.durMed
// easing.type: Easing.BezierSpline; easing.bezierCurve: root.emphasizedDecel
// }
// }
// readonly property Component slideOutRight: Transition {
// NumberAnimation {
// properties: "x"; to: root.slidePx; duration: root.durShort
// easing.type: Easing.BezierSpline; easing.bezierCurve: root.emphasizedAccel
// }
// }
// // Fade transitions (small/subtle moves)
// // Enter = standardDecel, Exit = standardAccel
// readonly property Component fadeIn: Transition {
// NumberAnimation {
// properties: "opacity"; from: 0.0; to: 1.0; duration: root.durMed
// easing.type: Easing.BezierSpline; easing.bezierCurve: root.standardDecel
// }
// }
// readonly property Component fadeOut: Transition {
// NumberAnimation {
// properties: "opacity"; to: 0.0; duration: root.durShort
// easing.type: Easing.BezierSpline; easing.bezierCurve: root.standardAccel
// }
// }
}

View File

@@ -70,7 +70,9 @@ Column {
Behavior on width { Behavior on width {
NumberAnimation { NumberAnimation {
duration: 100 duration: Anims.durShort
easing.type: Easing.BezierSpline
easing.bezierCurve: Anims.standardDecel
} }
} }
} }
@@ -90,7 +92,9 @@ Column {
Behavior on scale { Behavior on scale {
NumberAnimation { NumberAnimation {
duration: 150 duration: Anims.durShort
easing.type: Easing.BezierSpline
easing.bezierCurve: Anims.standard
} }
} }

View File

@@ -411,8 +411,8 @@ Item {
SequentialAnimation on scale { SequentialAnimation on scale {
running: root.unlocking running: root.unlocking
NumberAnimation { from: 0; to: 1.2; duration: 200; easing.type: Easing.OutBack } NumberAnimation { from: 0; to: 1.2; duration: Anims.durShort; easing.type: Easing.BezierSpline; easing.bezierCurve: Anims.emphasizedDecel }
NumberAnimation { from: 1.2; to: 1; duration: 150; easing.type: Easing.InBack } NumberAnimation { from: 1.2; to: 1; duration: Anims.durShort; easing.type: Easing.BezierSpline; easing.bezierCurve: Anims.emphasizedAccel }
} }
} }
@@ -450,7 +450,7 @@ Item {
RotationAnimation on rotation { RotationAnimation on rotation {
running: pam.active && !root.unlocking running: pam.active && !root.unlocking
loops: Animation.Infinite loops: Animation.Infinite
duration: 1000 duration: Anims.durLong
from: 0 from: 0
to: 360 to: 360
} }

View File

@@ -27,19 +27,23 @@ PanelWindow {
} }
margins { margins {
top: Theme.barHeight + 16 top: Theme.barHeight + 4
right: 12 right: 12
} }
// Manager drives vertical stacking with this proxy: // Manager drives vertical stacking with this proxy:
property int screenY: 0 property int screenY: 0
onScreenYChanged: margins.top = Theme.barHeight + 16 + screenY onScreenYChanged: margins.top = Theme.barHeight + 4 + screenY
// Disable vertical tween while exiting so there is never diagonal motion // Disable vertical tween while exiting so there is never diagonal motion
Behavior on screenY { Behavior on screenY {
id: screenYAnim id: screenYAnim
enabled: !exiting enabled: !exiting
NumberAnimation { duration: 220; easing.type: Easing.OutCubic } NumberAnimation {
duration: Anims.durShort
easing.type: Easing.BezierSpline
easing.bezierCurve: Anims.standardDecel
}
} }
// State // State
@@ -47,13 +51,12 @@ PanelWindow {
signal entered() signal entered()
signal exitFinished() signal exitFinished()
// ---------------- CONTENT: animate this (not the Window) ----------------
Item { Item {
id: content id: content
anchors.fill: parent anchors.fill: parent
// We animate a Translate so anchors never override horizontal motion // We animate a Translate so anchors never override horizontal motion
transform: Translate { id: tx; x: 400 } // start off-screen right transform: Translate { id: tx; x: Anims.slidePx } // start off-screen right
// Optional: layer while animating for smoothness // Optional: layer while animating for smoothness
layer.enabled: (enterX.running || exitAnim.running) layer.enabled: (enterX.running || exitAnim.running)
@@ -303,21 +306,37 @@ PanelWindow {
} }
} }
// ---------------- EXPLICIT ANIMATIONS (no Behavior races) ---------------- // Entrance: slide in from right using slowed Anims curves
// Entrance (guaranteed): 400 -> 0
NumberAnimation { NumberAnimation {
id: enterX id: enterX
target: tx; property: "x"; from: 400; to: 0 target: tx; property: "x"; from: Anims.slidePx; to: 0
duration: 240; easing.type: Easing.OutCubic duration: Anims.durMed
easing.type: Easing.BezierSpline
easing.bezierCurve: Anims.emphasizedDecel
onStopped: if (!win.exiting && Math.abs(tx.x) < 0.5) win.entered(); onStopped: if (!win.exiting && Math.abs(tx.x) < 0.5) win.entered();
} }
// Exit (guaranteed): (x: 0 -> 96) + (opacity: 1 -> 0) // Exit: slide out to right + fade using slowed Anims curves
ParallelAnimation { ParallelAnimation {
id: exitAnim id: exitAnim
PropertyAnimation { target: tx; property: "x"; from: 0; to: 96; duration: 200; easing.type: Easing.OutCubic } PropertyAnimation {
NumberAnimation { target: content; property: "opacity"; from: 1; to: 0; duration: 200; easing.type: Easing.OutCubic } target: tx; property: "x"; from: 0; to: Anims.slidePx
NumberAnimation { target: content; property: "scale"; from: 1; to: 0.98; duration: 160; easing.type: Easing.OutCubic } duration: Anims.durShort
easing.type: Easing.BezierSpline
easing.bezierCurve: Anims.emphasizedAccel
}
NumberAnimation {
target: content; property: "opacity"; from: 1; to: 0
duration: Anims.durShort
easing.type: Easing.BezierSpline
easing.bezierCurve: Anims.standardAccel
}
NumberAnimation {
target: content; property: "scale"; from: 1; to: 0.98
duration: Anims.durShort
easing.type: Easing.BezierSpline
easing.bezierCurve: Anims.emphasizedAccel
}
onStopped: finalizeExit("animStopped") onStopped: finalizeExit("animStopped")
} }

View File

@@ -5,8 +5,8 @@ import qs.Services
QtObject { QtObject {
id: manager id: manager
property int topMargin: 48 property int topMargin: 0
property int baseNotificationHeight: 132 property int baseNotificationHeight: 120
property int maxTargetNotifications: 3 property int maxTargetNotifications: 3
property var popupWindows: [] // strong refs to windows (live until exitFinished) property var popupWindows: [] // strong refs to windows (live until exitFinished)

View File

@@ -99,8 +99,9 @@ Item {
Behavior on height { Behavior on height {
NumberAnimation { NumberAnimation {
duration: 80 duration: Anims.durShort
easing.type: Easing.OutQuad easing.type: Easing.BezierSpline
easing.bezierCurve: Anims.standardDecel
} }
} }

View File

@@ -44,14 +44,16 @@ Rectangle {
NumberAnimation { NumberAnimation {
to: 0.6 to: 0.6
duration: 1000 duration: Anims.durLong
easing.type: Easing.InOutQuad easing.type: Easing.BezierSpline
easing.bezierCurve: Anims.standard
} }
NumberAnimation { NumberAnimation {
to: 1 to: 1
duration: 1000 duration: Anims.durLong
easing.type: Easing.InOutQuad easing.type: Easing.BezierSpline
easing.bezierCurve: Anims.standard
} }
} }