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> standard: [0.2, 0, 0, 1, 1, 1]
|
||||||
readonly property list<real> standardAccel: [0.3, 0, 1, 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> 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 {
|
component AnimDurations: QtObject {
|
||||||
|
|
|
||||||
|
|
@ -65,9 +65,6 @@ Item {
|
||||||
}
|
}
|
||||||
|
|
||||||
transitions: Transition {
|
transitions: Transition {
|
||||||
from: "*"
|
|
||||||
to: "*"
|
|
||||||
|
|
||||||
NumberAnimation {
|
NumberAnimation {
|
||||||
target: img
|
target: img
|
||||||
properties: "opacity,scale"
|
properties: "opacity,scale"
|
||||||
|
|
|
||||||
|
|
@ -28,9 +28,9 @@ Item {
|
||||||
NumberAnimation {
|
NumberAnimation {
|
||||||
target: root
|
target: root
|
||||||
property: "implicitHeight"
|
property: "implicitHeight"
|
||||||
duration: Appearance.anim.durations.large
|
duration: Appearance.anim.durations.normal
|
||||||
easing.type: Easing.BezierSpline
|
easing.type: Easing.BezierSpline
|
||||||
easing.bezierCurve: Appearance.anim.curves.emphasizedDecel
|
easing.bezierCurve: Appearance.anim.curves.expressiveDefaultSpatial
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
Transition {
|
Transition {
|
||||||
|
|
@ -42,7 +42,7 @@ Item {
|
||||||
property: "implicitHeight"
|
property: "implicitHeight"
|
||||||
duration: Appearance.anim.durations.normal
|
duration: Appearance.anim.durations.normal
|
||||||
easing.type: Easing.BezierSpline
|
easing.type: Easing.BezierSpline
|
||||||
easing.bezierCurve: Appearance.anim.curves.emphasizedAccel
|
easing.bezierCurve: Appearance.anim.curves.emphasized
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
|
|
|
||||||
|
|
@ -51,9 +51,6 @@ Item {
|
||||||
]
|
]
|
||||||
|
|
||||||
transitions: Transition {
|
transitions: Transition {
|
||||||
from: "*"
|
|
||||||
to: "*"
|
|
||||||
|
|
||||||
SequentialAnimation {
|
SequentialAnimation {
|
||||||
NumberAnimation {
|
NumberAnimation {
|
||||||
target: root
|
target: root
|
||||||
|
|
|
||||||
|
|
@ -28,9 +28,9 @@ Item {
|
||||||
NumberAnimation {
|
NumberAnimation {
|
||||||
target: root
|
target: root
|
||||||
property: "implicitHeight"
|
property: "implicitHeight"
|
||||||
duration: Appearance.anim.durations.large
|
duration: Appearance.anim.durations.normal
|
||||||
easing.type: Easing.BezierSpline
|
easing.type: Easing.BezierSpline
|
||||||
easing.bezierCurve: Appearance.anim.curves.emphasizedDecel
|
easing.bezierCurve: Appearance.anim.curves.expressiveDefaultSpatial
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
Transition {
|
Transition {
|
||||||
|
|
@ -42,7 +42,7 @@ Item {
|
||||||
property: "implicitHeight"
|
property: "implicitHeight"
|
||||||
duration: Appearance.anim.durations.normal
|
duration: Appearance.anim.durations.normal
|
||||||
easing.type: Easing.BezierSpline
|
easing.type: Easing.BezierSpline
|
||||||
easing.bezierCurve: Appearance.anim.curves.emphasizedAccel
|
easing.bezierCurve: Appearance.anim.curves.emphasized
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
|
|
|
||||||
|
|
@ -102,6 +102,6 @@ Item {
|
||||||
component Anim: NumberAnimation {
|
component Anim: NumberAnimation {
|
||||||
duration: Appearance.anim.durations.normal
|
duration: Appearance.anim.durations.normal
|
||||||
easing.type: Easing.BezierSpline
|
easing.type: Easing.BezierSpline
|
||||||
easing.bezierCurve: Appearance.anim.curves.standard
|
easing.bezierCurve: Appearance.anim.curves.expressiveDefaultSpatial
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -20,32 +20,15 @@ Item {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
transitions: [
|
transitions: Transition {
|
||||||
Transition {
|
NumberAnimation {
|
||||||
from: ""
|
target: root
|
||||||
to: "visible"
|
property: "implicitHeight"
|
||||||
|
duration: Appearance.anim.durations.normal
|
||||||
NumberAnimation {
|
easing.type: Easing.BezierSpline
|
||||||
target: root
|
easing.bezierCurve: Appearance.anim.curves.expressiveDefaultSpatial
|
||||||
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
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
]
|
}
|
||||||
|
|
||||||
Content {
|
Content {
|
||||||
id: content
|
id: content
|
||||||
|
|
|
||||||
|
|
@ -30,9 +30,9 @@ Item {
|
||||||
NumberAnimation {
|
NumberAnimation {
|
||||||
target: root
|
target: root
|
||||||
property: "implicitWidth"
|
property: "implicitWidth"
|
||||||
duration: Appearance.anim.durations.large
|
duration: Appearance.anim.durations.normal
|
||||||
easing.type: Easing.BezierSpline
|
easing.type: Easing.BezierSpline
|
||||||
easing.bezierCurve: Appearance.anim.curves.emphasizedDecel
|
easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
Transition {
|
Transition {
|
||||||
|
|
@ -44,7 +44,7 @@ Item {
|
||||||
property: "implicitWidth"
|
property: "implicitWidth"
|
||||||
duration: Appearance.anim.durations.normal
|
duration: Appearance.anim.durations.normal
|
||||||
easing.type: Easing.BezierSpline
|
easing.type: Easing.BezierSpline
|
||||||
easing.bezierCurve: Appearance.anim.curves.emphasizedAccel
|
easing.bezierCurve: Appearance.anim.curves.emphasized
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
|
|
|
||||||
|
|
@ -29,9 +29,9 @@ Item {
|
||||||
NumberAnimation {
|
NumberAnimation {
|
||||||
target: root
|
target: root
|
||||||
property: "implicitWidth"
|
property: "implicitWidth"
|
||||||
duration: Appearance.anim.durations.large
|
duration: Appearance.anim.durations.normal
|
||||||
easing.type: Easing.BezierSpline
|
easing.type: Easing.BezierSpline
|
||||||
easing.bezierCurve: Appearance.anim.curves.emphasizedDecel
|
easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
Transition {
|
Transition {
|
||||||
|
|
@ -43,7 +43,7 @@ Item {
|
||||||
property: "implicitWidth"
|
property: "implicitWidth"
|
||||||
duration: Appearance.anim.durations.normal
|
duration: Appearance.anim.durations.normal
|
||||||
easing.type: Easing.BezierSpline
|
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 {
|
transitions: Transition {
|
||||||
from: "*"
|
|
||||||
to: "*"
|
|
||||||
|
|
||||||
NumberAnimation {
|
NumberAnimation {
|
||||||
target: icon
|
target: icon
|
||||||
property: "scale"
|
property: "scale"
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue