130 lines
2.7 KiB
QML
130 lines
2.7 KiB
QML
import QtQuick
|
|
import ZShell.Blobs
|
|
import qs.Components
|
|
import ZShell.Config
|
|
import qs.Services
|
|
|
|
Item {
|
|
id: root
|
|
|
|
property real animDriver
|
|
property alias color: blobGroup.color
|
|
default required property Item content
|
|
property bool hoverOverride
|
|
readonly property alias hovered: btn.containsMouse
|
|
property alias icon: icon.text
|
|
property bool open
|
|
property int padding
|
|
property bool pressOverride
|
|
property int topMovement: Tokens.padding.large
|
|
|
|
implicitHeight: btn.implicitHeight * 0.9
|
|
implicitWidth: btn.implicitWidth * 0.9
|
|
|
|
Binding {
|
|
property: "opacity"
|
|
target: root.content
|
|
value: root.animDriver
|
|
}
|
|
|
|
BlobGroup {
|
|
id: blobGroup
|
|
|
|
color: Colors.palette.m3surfaceContainerHighest
|
|
cornerFill: false
|
|
smoothing: Tokens.rounding.medium
|
|
|
|
Behavior on color {
|
|
CAnim {
|
|
}
|
|
}
|
|
}
|
|
|
|
BlobRect {
|
|
id: btnRect
|
|
|
|
anchors.fill: parent
|
|
anchors.margins: (!(btn.pressed || root.pressOverride) && (btn.containsMouse || root.hoverOverride) ? -Tokens.padding.extraSmall : 0) + (root.open ? -Tokens.padding.extraSmall : 0)
|
|
group: blobGroup
|
|
radius: root.open ? Tokens.rounding.large : Tokens.rounding.medium
|
|
|
|
Behavior on anchors.margins {
|
|
Anim {
|
|
}
|
|
}
|
|
Behavior on radius {
|
|
Anim {
|
|
type: Anim.DefaultEffects
|
|
}
|
|
}
|
|
}
|
|
|
|
BlobRect {
|
|
id: rect
|
|
|
|
anchors.right: parent.right
|
|
anchors.top: parent.top
|
|
deformScale: 0.00001
|
|
group: blobGroup
|
|
implicitHeight: parent.height
|
|
implicitWidth: parent.width
|
|
radius: Tokens.rounding.small + Tokens.padding.small
|
|
|
|
states: State {
|
|
name: "open"
|
|
when: root.open
|
|
|
|
PropertyChanges {
|
|
rect.anchors.rightMargin: root.width - Tokens.spacing.small
|
|
rect.anchors.topMargin: -root.topMovement
|
|
rect.implicitHeight: root.content.implicitHeight + root.padding * 2
|
|
rect.implicitWidth: root.content.implicitWidth + root.padding * 2
|
|
root.animDriver: 1
|
|
}
|
|
}
|
|
transitions: Transition {
|
|
Anim {
|
|
properties: "rightMargin,implicitWidth"
|
|
}
|
|
|
|
Anim {
|
|
duration: Tokens.anim.durations.expressiveFastEffects
|
|
easing.bezierCurve: Tokens.anim.curves.expressiveFastEffects
|
|
properties: "topMargin,implicitHeight"
|
|
}
|
|
|
|
Anim {
|
|
property: "animDriver"
|
|
type: Anim.DefaultEffects
|
|
}
|
|
}
|
|
|
|
MouseArea { // MouseArea to catch inputs
|
|
anchors.fill: parent
|
|
children: [root.content]
|
|
clip: true
|
|
}
|
|
}
|
|
|
|
MouseArea {
|
|
id: btn
|
|
|
|
anchors.centerIn: parent
|
|
cursorShape: Qt.PointingHandCursor
|
|
hoverEnabled: true
|
|
implicitHeight: icon.implicitHeight + Tokens.padding.extraSmall * 2
|
|
implicitWidth: implicitHeight
|
|
|
|
onClicked: root.open = !root.open
|
|
|
|
MaterialIcon {
|
|
id: icon
|
|
|
|
anchors.centerIn: parent
|
|
color: Colors.palette.m3onSurfaceVariant
|
|
font.pointSize: Tokens.font.size.medium
|
|
text: "view_apps"
|
|
}
|
|
}
|
|
}
|