drawers: better show/hide anims
Use m3 expressive curves
This commit is contained in:
parent
cdc6776eeb
commit
016a7c0763
10 changed files with 24 additions and 47 deletions
|
|
@ -62,6 +62,9 @@ Singleton {
|
|||
readonly property list<real> standard: [0.2, 0, 0, 1, 1, 1]
|
||||
readonly property list<real> standardAccel: [0.3, 0, 1, 1, 1, 1]
|
||||
readonly property list<real> standardDecel: [0, 0, 0, 1, 1, 1]
|
||||
readonly property list<real> expressiveFastSpatial: [0.42, 1.67, 0.21, 0.9, 1, 1]
|
||||
readonly property list<real> expressiveDefaultSpatial: [0.38, 1.21, 0.22, 1, 1, 1]
|
||||
readonly property list<real> expressiveEffects: [0.34, 0.8, 0.34, 1, 1, 1]
|
||||
}
|
||||
|
||||
component AnimDurations: QtObject {
|
||||
|
|
|
|||
|
|
@ -65,9 +65,6 @@ Item {
|
|||
}
|
||||
|
||||
transitions: Transition {
|
||||
from: "*"
|
||||
to: "*"
|
||||
|
||||
NumberAnimation {
|
||||
target: img
|
||||
properties: "opacity,scale"
|
||||
|
|
|
|||
|
|
@ -28,9 +28,9 @@ Item {
|
|||
NumberAnimation {
|
||||
target: root
|
||||
property: "implicitHeight"
|
||||
duration: Appearance.anim.durations.large
|
||||
duration: Appearance.anim.durations.normal
|
||||
easing.type: Easing.BezierSpline
|
||||
easing.bezierCurve: Appearance.anim.curves.emphasizedDecel
|
||||
easing.bezierCurve: Appearance.anim.curves.expressiveDefaultSpatial
|
||||
}
|
||||
},
|
||||
Transition {
|
||||
|
|
@ -42,7 +42,7 @@ Item {
|
|||
property: "implicitHeight"
|
||||
duration: Appearance.anim.durations.normal
|
||||
easing.type: Easing.BezierSpline
|
||||
easing.bezierCurve: Appearance.anim.curves.emphasizedAccel
|
||||
easing.bezierCurve: Appearance.anim.curves.emphasized
|
||||
}
|
||||
}
|
||||
]
|
||||
|
|
|
|||
|
|
@ -51,9 +51,6 @@ Item {
|
|||
]
|
||||
|
||||
transitions: Transition {
|
||||
from: "*"
|
||||
to: "*"
|
||||
|
||||
SequentialAnimation {
|
||||
NumberAnimation {
|
||||
target: root
|
||||
|
|
|
|||
|
|
@ -28,9 +28,9 @@ Item {
|
|||
NumberAnimation {
|
||||
target: root
|
||||
property: "implicitHeight"
|
||||
duration: Appearance.anim.durations.large
|
||||
duration: Appearance.anim.durations.normal
|
||||
easing.type: Easing.BezierSpline
|
||||
easing.bezierCurve: Appearance.anim.curves.emphasizedDecel
|
||||
easing.bezierCurve: Appearance.anim.curves.expressiveDefaultSpatial
|
||||
}
|
||||
},
|
||||
Transition {
|
||||
|
|
@ -42,7 +42,7 @@ Item {
|
|||
property: "implicitHeight"
|
||||
duration: Appearance.anim.durations.normal
|
||||
easing.type: Easing.BezierSpline
|
||||
easing.bezierCurve: Appearance.anim.curves.emphasizedAccel
|
||||
easing.bezierCurve: Appearance.anim.curves.emphasized
|
||||
}
|
||||
}
|
||||
]
|
||||
|
|
|
|||
|
|
@ -102,6 +102,6 @@ Item {
|
|||
component Anim: NumberAnimation {
|
||||
duration: Appearance.anim.durations.normal
|
||||
easing.type: Easing.BezierSpline
|
||||
easing.bezierCurve: Appearance.anim.curves.standard
|
||||
easing.bezierCurve: Appearance.anim.curves.expressiveDefaultSpatial
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -20,32 +20,15 @@ Item {
|
|||
}
|
||||
}
|
||||
|
||||
transitions: [
|
||||
Transition {
|
||||
from: ""
|
||||
to: "visible"
|
||||
|
||||
NumberAnimation {
|
||||
target: root
|
||||
property: "implicitHeight"
|
||||
duration: Appearance.anim.durations.large
|
||||
easing.type: Easing.BezierSpline
|
||||
easing.bezierCurve: Appearance.anim.curves.emphasizedDecel
|
||||
}
|
||||
},
|
||||
Transition {
|
||||
from: "visible"
|
||||
to: ""
|
||||
|
||||
NumberAnimation {
|
||||
target: root
|
||||
property: "implicitHeight"
|
||||
duration: Appearance.anim.durations.normal
|
||||
easing.type: Easing.BezierSpline
|
||||
easing.bezierCurve: Appearance.anim.curves.standard
|
||||
}
|
||||
transitions: Transition {
|
||||
NumberAnimation {
|
||||
target: root
|
||||
property: "implicitHeight"
|
||||
duration: Appearance.anim.durations.normal
|
||||
easing.type: Easing.BezierSpline
|
||||
easing.bezierCurve: Appearance.anim.curves.expressiveDefaultSpatial
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
Content {
|
||||
id: content
|
||||
|
|
|
|||
|
|
@ -30,9 +30,9 @@ Item {
|
|||
NumberAnimation {
|
||||
target: root
|
||||
property: "implicitWidth"
|
||||
duration: Appearance.anim.durations.large
|
||||
duration: Appearance.anim.durations.normal
|
||||
easing.type: Easing.BezierSpline
|
||||
easing.bezierCurve: Appearance.anim.curves.emphasizedDecel
|
||||
easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial
|
||||
}
|
||||
},
|
||||
Transition {
|
||||
|
|
@ -44,7 +44,7 @@ Item {
|
|||
property: "implicitWidth"
|
||||
duration: Appearance.anim.durations.normal
|
||||
easing.type: Easing.BezierSpline
|
||||
easing.bezierCurve: Appearance.anim.curves.emphasizedAccel
|
||||
easing.bezierCurve: Appearance.anim.curves.emphasized
|
||||
}
|
||||
}
|
||||
]
|
||||
|
|
|
|||
|
|
@ -29,9 +29,9 @@ Item {
|
|||
NumberAnimation {
|
||||
target: root
|
||||
property: "implicitWidth"
|
||||
duration: Appearance.anim.durations.large
|
||||
duration: Appearance.anim.durations.normal
|
||||
easing.type: Easing.BezierSpline
|
||||
easing.bezierCurve: Appearance.anim.curves.emphasizedDecel
|
||||
easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial
|
||||
}
|
||||
},
|
||||
Transition {
|
||||
|
|
@ -43,7 +43,7 @@ Item {
|
|||
property: "implicitWidth"
|
||||
duration: Appearance.anim.durations.normal
|
||||
easing.type: Easing.BezierSpline
|
||||
easing.bezierCurve: Appearance.anim.curves.emphasizedAccel
|
||||
easing.bezierCurve: root.visibilities.osd ? Appearance.anim.curves.expressiveFastSpatial : Appearance.anim.curves.emphasized
|
||||
}
|
||||
}
|
||||
]
|
||||
|
|
|
|||
|
|
@ -81,9 +81,6 @@ Slider {
|
|||
}
|
||||
|
||||
transitions: Transition {
|
||||
from: "*"
|
||||
to: "*"
|
||||
|
||||
NumberAnimation {
|
||||
target: icon
|
||||
property: "scale"
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue