feat: improve utilities open/close

This commit is contained in:
2 * r + 2 * t 2026-03-26 16:46:28 +11:00
parent 528a282e45
commit 600182ae00

View file

@ -21,77 +21,32 @@ Item {
reloadableId: "utilities" reloadableId: "utilities"
} }
readonly property bool shouldBeActive: visibilities.sidebar || (visibilities.utilities && Config.utilities.enabled && !(visibilities.session && Config.session.enabled)) readonly property bool shouldBeActive: visibilities.sidebar || (visibilities.utilities && Config.utilities.enabled && !(visibilities.session && Config.session.enabled))
property real offsetScale: shouldBeActive ? 0 : 1
visible: anchors.bottomMargin > -implicitHeight - 5 visible: offsetScale < 1
anchors.bottomMargin: -implicitHeight - 5 anchors.bottomMargin: (-implicitHeight - 5) * offsetScale
implicitHeight: content.implicitHeight implicitHeight: content.implicitHeight + content.anchors.margins * 2
implicitWidth: sidebar.visible ? sidebar.width : Config.utilities.sizes.width implicitWidth: sidebar.visible ? sidebar.width : Config.utilities.sizes.width
onStateChanged: { Behavior on offsetScale {
if (state === "visible" && timer.running) { Anim {
timer.triggered(); duration: Appearance.anim.durations.expressiveDefaultSpatial
timer.stop(); easing.bezierCurve: Appearance.anim.curves.expressiveDefaultSpatial
}
}
states: State {
name: "visible"
when: root.shouldBeActive
PropertyChanges {
root.anchors.bottomMargin: 0
}
}
transitions: [
Transition {
// from: ""
// to: "visible"
Anim {
target: root.anchors
property: "bottomMargin"
duration: Appearance.anim.durations.expressiveDefaultSpatial
easing.bezierCurve: Appearance.anim.curves.expressiveDefaultSpatial
}
}
// Transition {
// from: "visible"
// to: ""
// Anim {
// target: root
// property: "implicitHeight"
// easing.bezierCurve: Appearance.anim.curves.emphasized
// }
// }
]
Timer {
id: timer
running: true
interval: Appearance.anim.durations.extraLarge
onTriggered: {
content.active = Qt.binding(() => root.shouldBeActive || root.visible);
content.visible = true;
} }
} }
Loader { Loader {
id: content id: content
asynchronous: true
anchors.top: parent.top anchors.top: parent.top
anchors.left: parent.left anchors.left: parent.left
anchors.margins: Appearance.padding.large anchors.margins: Appearance.padding.large
visible: false asynchronous: true
active: true active: root.shouldBeActive || root.visible
sourceComponent: Content { sourceComponent: Content {
implicitWidth: root.implicitWidth - Appearance.padding.large * 2 implicitWidth: root.implicitWidth - content.anchors.margins * 2
props: root.props props: root.props
visibilities: root.visibilities visibilities: root.visibilities
popouts: root.popouts popouts: root.popouts