kenji/illogical-impulse
1
0
Fork 0
forked from Shinonome/dots-hyprland
Code Pull Requests Activity

refractor some animations

Browse Source
This commit is contained in:
end-4
2025-05-18 01:50:12 +02:00
parent 9385961fb8
commit b14df306ce
30 changed files with 94 additions and 310 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.config/quickshell/modules/common/Appearance.qml
+27
View File
@@ -4,6 +4,7 @@ pragma Singleton
pragma ComponentBehavior: Bound
Singleton {
id: root
property QtObject m3colors
property QtObject animation
property QtObject animationCurves
@@ -189,12 +190,33 @@ Singleton {
property int type: Easing.BezierSpline
property list<real> bezierCurve: animationCurves.emphasized
property int velocity: 650
property Component numberAnimation: Component {
NumberAnimation {
duration: root.animation.elementMove.duration
easing.type: root.animation.elementMove.type
easing.bezierCurve: root.animation.elementMove.bezierCurve
}
}
property Component colorAnimation: Component {
ColorAnimation {
duration: root.animation.elementMove.duration
easing.type: root.animation.elementMove.type
easing.bezierCurve: root.animation.elementMove.bezierCurve
}
}
}
property QtObject elementMoveEnter: QtObject {
property int duration: 400
property int type: Easing.BezierSpline
property list<real> bezierCurve: animationCurves.emphasizedDecel
property int velocity: 650
property Component numberAnimation: Component {
NumberAnimation {
duration: root.animation.elementMoveEnter.duration
easing.type: root.animation.elementMoveEnter.type
easing.bezierCurve: root.animation.elementMoveEnter.bezierCurve
}
}
}
property QtObject elementMoveExit: QtObject {
property int duration: 200
@@ -207,6 +229,11 @@ Singleton {
property int type: Easing.BezierSpline
property list<real> bezierCurve: animationCurves.standardDecel
property int velocity: 850
property Component colorAnimation: Component {ColorAnimation {
duration: root.animation.elementMoveFast.duration
easing.type: root.animation.elementMoveFast.type
easing.bezierCurve: root.animation.elementMoveFast.bezierCurve
}}
}
property QtObject scroll: QtObject {
property int duration: 400
.config/quickshell/modules/common/widgets/DialogButton.qml
+2 -10
View File
@@ -20,11 +20,7 @@ Button {
color: (button.down && button.enabled) ? Appearance.colors.colLayer1Active : ((button.hovered && button.enabled) ? Appearance.colors.colLayer1Hover : Appearance.transparentize(Appearance.m3colors.m3surfaceContainerHigh, 1))
Behavior on color {
ColorAnimation {
duration: Appearance.animation.elementMove.duration
easing.type: Appearance.animation.elementMove.type
easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
}
animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
}
@@ -41,11 +37,7 @@ Button {
color: button.enabled ? Appearance.m3colors.m3primary : Appearance.m3colors.m3outline
Behavior on color {
ColorAnimation {
duration: Appearance.animation.elementMove.duration
easing.type: Appearance.animation.elementMove.type
easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
}
animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
}
}
.config/quickshell/modules/common/widgets/MenuButton.qml
+2 -11
View File
@@ -21,12 +21,7 @@ Button {
Appearance.transparentize(Appearance.m3colors.m3onSurface, 1))
Behavior on color {
ColorAnimation {
duration: Appearance.animation.elementMove.duration
easing.type: Appearance.animation.elementMove.type
easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
}
animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
}
}
@@ -42,11 +37,7 @@ Button {
color: button.enabled ? Appearance.m3colors.m3onSurface : Appearance.m3colors.m3outline
Behavior on color {
ColorAnimation {
duration: Appearance.animation.elementMove.duration
easing.type: Appearance.animation.elementMove.type
easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
}
animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
}
}
.config/quickshell/modules/common/widgets/NavRailButton.qml
+2 -10
View File
@@ -33,11 +33,7 @@ Button {
(button.down ? Appearance.colors.colLayer1Active : button.hovered ? Appearance.colors.colLayer1Hover : Appearance.transparentize(Appearance.colors.colLayer1Hover, 1))
Behavior on color {
ColorAnimation {
duration: Appearance.animation.elementMove.duration
easing.type: Appearance.animation.elementMove.type
easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
}
animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
}
MaterialSymbol {
id: navRailButtonIcon
@@ -48,11 +44,7 @@ Button {
color: toggled ? Appearance.m3colors.m3onSecondaryContainer : Appearance.colors.colOnLayer1
Behavior on color {
ColorAnimation {
duration: Appearance.animation.elementMove.duration
easing.type: Appearance.animation.elementMove.type
easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
}
animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
}
}
}
.config/quickshell/modules/common/widgets/NotificationWidget.qml
+1 -7
View File
@@ -425,14 +425,8 @@ Item {
color: (expandButton.down) ? Appearance.colors.colLayer2Active : (expandButton.hovered ? Appearance.colors.colLayer2Hover : Appearance.transparentize(Appearance.colors.colLayer2, 1))
Behavior on color {
ColorAnimation {
duration: Appearance.animation.elementMoveFast.duration
easing.type: Appearance.animation.elementMoveFast.type
easing.bezierCurve: Appearance.animation.elementMoveFast.bezierCurve
}
animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
}
}
contentItem: MaterialSymbol {
.config/quickshell/modules/common/widgets/PrimaryTabBar.qml
+2 -10
View File
@@ -71,19 +71,11 @@ ColumnLayout {
radius: Appearance.rounding.full
Behavior on x {
NumberAnimation {
duration: Appearance.animation.elementMove.duration
easing.type: Appearance.animation.elementMove.type
easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
}
animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
}
Behavior on implicitWidth {
NumberAnimation {
duration: Appearance.animation.elementMove.duration
easing.type: Appearance.animation.elementMove.type
easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
}
animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
}
}
}
.config/quickshell/modules/common/widgets/PrimaryTabButton.qml
+3 -15
View File
@@ -98,11 +98,7 @@ TabButton {
}
Behavior on color {
ColorAnimation {
duration: Appearance.animation.elementMove.duration
easing.type: Appearance.animation.elementMove.type
easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
}
animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
}
Rectangle {
@@ -133,11 +129,7 @@ TabButton {
fill: selected ? 1 : 0
color: selected ? Appearance.m3colors.m3primary : Appearance.colors.colOnLayer1
Behavior on color {
ColorAnimation {
duration: Appearance.animation.elementMove.duration
easing.type: Appearance.animation.elementMove.type
easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
}
animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
}
}
StyledText {
@@ -148,11 +140,7 @@ TabButton {
color: selected ? Appearance.m3colors.m3primary : Appearance.colors.colOnLayer1
text: buttonText
Behavior on color {
ColorAnimation {
duration: Appearance.animation.elementMove.duration
easing.type: Appearance.animation.elementMove.type
easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
}
animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
}
}
}
.config/quickshell/modules/common/widgets/Revealer.qml
+2 -10
View File
@@ -16,18 +16,10 @@ Item {
Behavior on implicitWidth {
enabled: !vertical
NumberAnimation {
duration: Appearance.animation.elementMoveEnter.duration
easing.type: Appearance.animation.elementMoveEnter.type
easing.bezierCurve: Appearance.animation.elementMoveEnter.bezierCurve
}
animation: Appearance.animation.elementMoveEnter.numberAnimation
}
Behavior on implicitHeight {
enabled: vertical
NumberAnimation {
duration: Appearance.animation.elementMoveEnter.duration
easing.type: Appearance.animation.elementMoveEnter.type
easing.bezierCurve: Appearance.animation.elementMoveEnter.bezierCurve
}
animation: Appearance.animation.elementMoveEnter.numberAnimation
}
}
.config/quickshell/modules/common/widgets/SecondaryTabButton.qml
+3 -15
View File
@@ -100,11 +100,7 @@ TabButton {
}
Behavior on color {
ColorAnimation {
duration: Appearance.animation.elementMove.duration
easing.type: Appearance.animation.elementMove.type
easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
}
animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
}
Rectangle {
@@ -143,11 +139,7 @@ TabButton {
fill: selected ? 1 : 0
color: selected ? Appearance.m3colors.m3primary : Appearance.colors.colOnLayer1
Behavior on color {
ColorAnimation {
duration: Appearance.animation.elementMove.duration
easing.type: Appearance.animation.elementMove.type
easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
}
animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
}
}
}
@@ -158,11 +150,7 @@ TabButton {
color: selected ? Appearance.m3colors.m3primary : Appearance.colors.colOnLayer1
text: buttonText
Behavior on color {
ColorAnimation {
duration: Appearance.animation.elementMove.duration
easing.type: Appearance.animation.elementMove.type
easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
}
animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
}
}
}
.config/quickshell/modules/common/widgets/StyledSwitch.qml
+6 -30
View File
@@ -22,18 +22,10 @@ Switch {
border.color: root.checked ? Appearance.m3colors.m3primary : Appearance.m3colors.m3outline
Behavior on color {
ColorAnimation {
duration: Appearance.animation.elementMove.duration
easing.type: Appearance.animation.elementMove.type
easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
}
animation: Appearance.animation.elementMove.colorAnimation.createObject(this)
}
Behavior on border.color {
ColorAnimation {
duration: Appearance.animation.elementMove.duration
easing.type: Appearance.animation.elementMove.type
easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
}
animation: Appearance.animation.elementMove.colorAnimation.createObject(this)
}
}
@@ -48,32 +40,16 @@ Switch {
anchors.leftMargin: root.checked ? (root.pressed ? (22 * root.scale) : 24 * root.scale) : (root.pressed ? (2 * root.scale) : 8 * root.scale)
Behavior on anchors.leftMargin {
NumberAnimation {
duration: Appearance.animation.elementMove.duration
easing.type: Appearance.animation.elementMove.type
easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
}
animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
}
Behavior on width {
NumberAnimation {
duration: Appearance.animation.elementMove.duration
easing.type: Appearance.animation.elementMove.type
easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
}
animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
}
Behavior on height {
NumberAnimation {
duration: Appearance.animation.elementMove.duration
easing.type: Appearance.animation.elementMove.type
easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
}
animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
}
Behavior on color {
ColorAnimation {
duration: Appearance.animation.elementMove.duration
easing.type: Appearance.animation.elementMove.type
easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
}
animation: Appearance.animation.elementMove.colorAnimation.createObject(this)
}
}
}