animate date bubbles with MaterialCookie on constantlyRotate

This commit is contained in:
darksignal7
2025-10-06 19:25:46 +03:00
parent 924a01bca6
commit fc8985b242
@@ -92,24 +92,33 @@ Item {
} }
// Date bubble style left side // Date bubble style left side
Rectangle { Item {
z: 5 width: root.style === "bubble" ? dateSquareSize : 0
implicitWidth: root.style === "bubble" ? dateSquareSize : 0 height: root.style === "bubble" ? dateSquareSize : 0
implicitHeight: root.style === "bubble" ? dateSquareSize : 0
color: Appearance.colors.colPrimaryContainer
radius: Appearance.rounding.large
anchors { anchors {
left: parent.left left: parent.left
bottom: parent.bottom bottom: parent.bottom
bottomMargin: 5 topMargin: 50
} }
Behavior on implicitWidth { Behavior on width {
animation: Appearance.animation.elementResize.numberAnimation.createObject(this) animation: Appearance.animation.elementResize.numberAnimation.createObject(this)
} }
Behavior on implicitHeight { Behavior on height {
animation: Appearance.animation.elementResize.numberAnimation.createObject(this) animation: Appearance.animation.elementResize.numberAnimation.createObject(this)
} }
MaterialCookie {
z: 5
sides: 4
anchors.centerIn: parent
color: Appearance.colors.colPrimaryContainer
implicitSize: root.style === "bubble" ? dateSquareSize : 0
constantlyRotate: Config.options.background.clock.cookie.constantlyRotate
Behavior on implicitSize {
animation: Appearance.animation.elementResize.numberAnimation.createObject(this)
}
}
StyledText { StyledText {
z: 6
anchors.centerIn: parent anchors.centerIn: parent
text: DateTime.date.substring(5, 7) text: DateTime.date.substring(5, 7)
color: Appearance.colors.colPrimary color: Appearance.colors.colPrimary
@@ -126,26 +135,35 @@ Item {
} }
// Date bubble style right side // Date bubble style right side
Rectangle { Item {
z: 5 width: root.style === "bubble" ? dateSquareSize : 0
implicitWidth: root.style === "bubble" ? dateSquareSize : 0 height: root.style === "bubble" ? dateSquareSize : 0
implicitHeight: root.style === "bubble" ? dateSquareSize : 0
color: Appearance.colors.colTertiaryContainer
radius: Appearance.rounding.verylarge
anchors { anchors {
right: parent.right right: parent.right
top: parent.top top: parent.top
topMargin: 5 bottomMargin: 50
} }
Behavior on implicitWidth { Behavior on width {
animation: Appearance.animation.elementResize.numberAnimation.createObject(this) animation: Appearance.animation.elementResize.numberAnimation.createObject(this)
} }
Behavior on implicitHeight { Behavior on height {
animation: Appearance.animation.elementResize.numberAnimation.createObject(this) animation: Appearance.animation.elementResize.numberAnimation.createObject(this)
} }
MaterialCookie {
z: 5
sides: 1
anchors.centerIn: parent
color: Appearance.colors.colTertiaryContainer
implicitSize: root.style === "bubble" ? dateSquareSize : 0
constantlyRotate: Config.options.background.clock.cookie.constantlyRotate
Behavior on implicitSize {
animation: Appearance.animation.elementResize.numberAnimation.createObject(this)
}
}
StyledText { StyledText {
z: 6
anchors.centerIn: parent anchors.centerIn: parent
text: DateTime.date.substring(8, 10) text: DateTime.date.substring(5, 7)
color: Appearance.colors.colTertiary color: Appearance.colors.colTertiary
opacity: root.style === "bubble" ? 1.0 : 0 opacity: root.style === "bubble" ? 1.0 : 0
font { font {