diff --git a/.config/quickshell/ii/modules/background/Background.qml b/.config/quickshell/ii/modules/background/Background.qml index 5a075d781..2dc14a31f 100644 --- a/.config/quickshell/ii/modules/background/Background.qml +++ b/.config/quickshell/ii/modules/background/Background.qml @@ -241,6 +241,7 @@ Variants { style: Text.Raised styleColor: Appearance.colors.colShadow text: DateTime.date + animateChange: true } StyledText { Layout.fillWidth: true diff --git a/.config/quickshell/ii/modules/common/widgets/MaterialSymbol.qml b/.config/quickshell/ii/modules/common/widgets/MaterialSymbol.qml index 92da9918e..126845313 100644 --- a/.config/quickshell/ii/modules/common/widgets/MaterialSymbol.qml +++ b/.config/quickshell/ii/modules/common/widgets/MaterialSymbol.qml @@ -1,12 +1,11 @@ import qs.modules.common import QtQuick -Text { +StyledText { id: root property real iconSize: Appearance?.font.pixelSize.small ?? 16 property real fill: 0 property real truncatedFill: Math.round(fill * 100) / 100 // Reduce memory consumption spikes from constant font remapping - renderType: Text.NativeRendering font { hintingPreference: Font.PreferFullHinting family: Appearance?.font.family.iconMaterial ?? "Material Symbols Rounded" @@ -19,10 +18,8 @@ Text { "opsz": iconSize, } } - verticalAlignment: Text.AlignVCenter - color: Appearance.m3colors.m3onBackground - // Behavior on fill { + // Behavior on fill { // Leaky leaky, no good // NumberAnimation { // duration: Appearance?.animation.elementMoveFast.duration ?? 200 // easing.type: Appearance?.animation.elementMoveFast.type ?? Easing.BezierSpline diff --git a/.config/quickshell/ii/modules/common/widgets/StyledText.qml b/.config/quickshell/ii/modules/common/widgets/StyledText.qml index 6024fc67a..de4e2be96 100644 --- a/.config/quickshell/ii/modules/common/widgets/StyledText.qml +++ b/.config/quickshell/ii/modules/common/widgets/StyledText.qml @@ -3,6 +3,11 @@ import QtQuick import QtQuick.Layouts Text { + id: root + property bool animateChange: false + property real animationDistanceX: 0 + property real animationDistanceY: 6 + renderType: Text.NativeRendering verticalAlignment: Text.AlignVCenter font { @@ -12,4 +17,73 @@ Text { } color: Appearance?.m3colors.m3onBackground ?? "black" linkColor: Appearance?.m3colors.m3primary + + component Anim: NumberAnimation { + target: root + duration: 300 / 2 + easing.type: Easing.BezierSpline + easing.bezierCurve: Appearance.animation.elementMoveFast.bezierCurve + } + + Behavior on text { + id: textAnimationBehavior + property real originalX: root.x + property real originalY: root.y + enabled: root.animateChange + + SequentialAnimation { + alwaysRunToEnd: true + ScriptAction { + script: textAnimationBehavior.originalX = root.x; + } + ScriptAction { + script: textAnimationBehavior.originalY = root.y; + } + ParallelAnimation { + Anim { + property: "x" + to: textAnimationBehavior.originalX - root.animationDistanceX + easing.type: Easing.InSine + } + Anim { + property: "y" + to: textAnimationBehavior.originalY - root.animationDistanceY + easing.type: Easing.InSine + } + Anim { + property: "opacity" + to: 0 + easing.type: Easing.InSine + } + } + PropertyAction {} // Tie the text update to this point (we don't want it to happen during the first slide+fade) + PropertyAction { + target: root + property: "x" + value: textAnimationBehavior.originalX + root.animationDistanceX + } + PropertyAction { + target: root + property: "y" + value: textAnimationBehavior.originalY + root.animationDistanceY + } + ParallelAnimation { + Anim { + property: "x" + to: textAnimationBehavior.originalX + easing.type: Easing.OutSine + } + Anim { + property: "y" + to: textAnimationBehavior.originalY + easing.type: Easing.OutSine + } + Anim { + property: "opacity" + to: 1 + easing.type: Easing.OutSine + } + } + } + } } diff --git a/.config/quickshell/ii/modules/mediaControls/PlayerControl.qml b/.config/quickshell/ii/modules/mediaControls/PlayerControl.qml index 673ad289f..b10781d2b 100644 --- a/.config/quickshell/ii/modules/mediaControls/PlayerControl.qml +++ b/.config/quickshell/ii/modules/mediaControls/PlayerControl.qml @@ -205,6 +205,9 @@ Item { // Player instance color: blendedColors.colOnLayer0 elide: Text.ElideRight text: StringUtils.cleanMusicTitle(playerController.player?.trackTitle) || "Untitled" + animateChange: true + animationDistanceX: 6 + animationDistanceY: 0 } StyledText { id: trackArtist @@ -213,6 +216,9 @@ Item { // Player instance color: blendedColors.colSubtext elide: Text.ElideRight text: playerController.player?.trackArtist + animateChange: true + animationDistanceX: 6 + animationDistanceY: 0 } Item { Layout.fillHeight: true } Item { diff --git a/.config/quickshell/ii/modules/sidebarLeft/AiChat.qml b/.config/quickshell/ii/modules/sidebarLeft/AiChat.qml index 3817afe50..3f4e49a22 100644 --- a/.config/quickshell/ii/modules/sidebarLeft/AiChat.qml +++ b/.config/quickshell/ii/modules/sidebarLeft/AiChat.qml @@ -224,6 +224,7 @@ Inline w/ backslash and round brackets \\(e^{i\\pi} + 1 = 0\\) font.pixelSize: Appearance.font.pixelSize.small text: statusItem.statusText color: Appearance.colors.colSubtext + animateChange: true } } diff --git a/.config/quickshell/ii/modules/sidebarLeft/ApiInputBoxIndicator.qml b/.config/quickshell/ii/modules/sidebarLeft/ApiInputBoxIndicator.qml index 13fb81ca9..878fba2b6 100644 --- a/.config/quickshell/ii/modules/sidebarLeft/ApiInputBoxIndicator.qml +++ b/.config/quickshell/ii/modules/sidebarLeft/ApiInputBoxIndicator.qml @@ -26,6 +26,7 @@ Item { // Model indicator color: Appearance.m3colors.m3onSurface elide: Text.ElideRight text: root.text + animateChange: true } } diff --git a/.config/quickshell/ii/modules/sidebarRight/volumeMixer/AudioDeviceSelectorButton.qml b/.config/quickshell/ii/modules/sidebarRight/volumeMixer/AudioDeviceSelectorButton.qml index fba430528..c8ac2df8d 100644 --- a/.config/quickshell/ii/modules/sidebarRight/volumeMixer/AudioDeviceSelectorButton.qml +++ b/.config/quickshell/ii/modules/sidebarRight/volumeMixer/AudioDeviceSelectorButton.qml @@ -49,6 +49,7 @@ RippleButton { font.pixelSize: Appearance.font.pixelSize.smaller text: (input ? Pipewire.defaultAudioSource?.description : Pipewire.defaultAudioSink?.description) ?? Translation.tr("Unknown") color: Appearance.m3colors.m3outline + animateChange: true } } } diff --git a/.config/quickshell/ii/modules/verticalBar/BatteryIndicator.qml b/.config/quickshell/ii/modules/verticalBar/BatteryIndicator.qml index d67037d9c..27d704884 100644 --- a/.config/quickshell/ii/modules/verticalBar/BatteryIndicator.qml +++ b/.config/quickshell/ii/modules/verticalBar/BatteryIndicator.qml @@ -46,6 +46,7 @@ MouseArea { fill: 1 text: isCharging ? "bolt" : "battery_android_full" iconSize: Appearance.font.pixelSize.normal + animateChange: true } StyledText { Layout.alignment: Qt.AlignHCenter