make TimeColumn not rely on autocascade, rename centerGlow -> hourMarks

This commit is contained in:
end-4
2025-10-06 10:09:06 +02:00
parent 07a3edf020
commit 122c1f8e37
6 changed files with 74 additions and 42 deletions
@@ -7,7 +7,6 @@ import qs.modules.common.widgets
import qs.modules.common.functions
import QtQuick
import QtQuick.Layouts
import Quickshell
import Qt5Compat.GraphicalEffects
Item {
@@ -23,7 +22,7 @@ Item {
Config.options.background.clock.cookie.minuteHandStyle === "medium" ? 12 : 5
property real centerDotSize: 10
property real hourDotSize: 12
property real centerGlowSize: 135
property real hourMarkSize: 135
property real secondDotSize: 20
property real secondHandWidth: 2
property real secondHandLength: 100
@@ -75,12 +74,18 @@ Item {
anchors.fill: parent
}
HourMarks {
anchors.fill: parent
anchors.centerIn: parent
implicitSize: root.hourMarkSize
markLength: root.hourDotSize
color: root.colTimeIndicators
colOnBackground: root.colOnBackground
}
// Number column in the middle
TimeColumn {
anchors.centerIn: parent
color: root.colOnBackground
clockNumbers: root.clockNumbers
}
// Hour hand
@@ -132,6 +137,7 @@ Item {
}
}
// Date
DateIndicator {
anchors.fill: parent
colOnBackground: root.colOnBackground
@@ -8,13 +8,21 @@ import qs.modules.common.functions
import QtQuick
Item {
id: root
property real implicitSize: 135
property real markLength: 10
property color color: Appearance.colors.colOnSecondaryContainer
property color colOnBackground: Appearance.colors.colSecondaryContainer
property bool isEnabled: Config.options.background.clock.cookie.hourMarks
Rectangle {
opacity: Config.options.background.clock.cookie.centerGlow ? 1.0 : 0
opacity: root.isEnabled ? 1.0 : 0
z: 0
color: root.colTimeIndicators
color: root.color
anchors.centerIn: parent
implicitWidth: Config.options.background.clock.cookie.centerGlow ? centerGlowSize : centerGlowSize * 1.75
implicitHeight: Config.options.background.clock.cookie.centerGlow ? centerGlowSize : centerGlowSize * 1.75 // Not using implicitHeight to allow smooth transition
implicitWidth: root.isEnabled ? root.implicitSize : root.implicitSize * 1.75
implicitHeight: root.isEnabled ? root.implicitSize : root.implicitSize * 1.75 // Not using implicitHeight to allow smooth transition
radius: implicitWidth / 2
Behavior on opacity {
animation: Appearance.animation.elementResize.numberAnimation.createObject(this)
@@ -27,7 +35,7 @@ Item {
}
}
// Center glow lines
// Hour mark lines
Rectangle {
id: glowLines
z: 1
@@ -36,23 +44,28 @@ Item {
model: 12
Item {
required property int index
opacity: Config.options.background.clock.cookie.centerGlow ? 1.0 : 0
rotation: 360 / 12 * index
anchors.fill: parent
rotation: 360 / 12 * index
opacity: root.isEnabled ? 1.0 : 0
Behavior on opacity {
animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this)
}
Rectangle {
anchors {
left: parent.left
verticalCenter: parent.verticalCenter
leftMargin: Config.options.background.clock.cookie.centerGlow ? 50 : 75
leftMargin: root.isEnabled ? 50 : 75
}
implicitWidth: root.hourDotSize
implicitWidth: root.markLength
implicitHeight: implicitWidth / 2
radius: implicitWidth / 2
color: root.colOnBackground
opacity: Config.options.background.clock.cookie.centerGlow ? 0.5 : 0
opacity: root.isEnabled ? 0.5 : 0
Behavior on opacity {
animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this)
}
@@ -8,30 +8,43 @@ import qs.modules.common.functions
import QtQuick
Column {
id: timeIndicators
id: root
required property list<string> clockNumbers
property bool isEnabled: Config.options.background.clock.cookie.timeIndicators
property color color: Appearance.colors.colOnSecondaryContainer
z: 1
spacing: -16
Repeater {
model: root.clockNumbers
delegate: StyledText {
required property string modelData
opacity: Config.options.background.clock.cookie.timeIndicators ? 1.0 : 0 // Not using visible to allow smooth transition
anchors.horizontalCenter: parent?.horizontalCenter
color: root.colOnBackground
property bool hourMarksEnabled: Config.options.background.clock.cookie.hourMarks
property bool isAmPm: !!modelData.match(/am|pm/i)
property real numberSizeWithoutGlow: isAmPm ? 26 : 68
property real numberSizeWithGlow: isAmPm ? 10 : 40
property real numberSize: root.isEnabled ? (hourMarksEnabled ? numberSizeWithGlow : numberSizeWithoutGlow) : 100 // open/close animation
anchors.horizontalCenter: root.horizontalCenter
visible: opacity > 0
color: root.color
opacity: root.isEnabled ? 1.0 : 0
Behavior on opacity {
animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this)
}
text: modelData.padStart(2, "0")
font {
property real numberSizeWithoutGlow: modelData.match(/am|pm/i) ? 26 : 68
property real numberSizeWithGlow: modelData.match(/am|pm/i) ? 10 : 40
pixelSize: !Config.options.background.clock.cookie.timeIndicators ? 100 : // open/close animation
Config.options.background.clock.cookie.centerGlow ? numberSizeWithGlow : numberSizeWithoutGlow // changing size according to center glow
family: Appearance.font.family.expressive
weight: Font.Bold
pixelSize: numberSize
Behavior on pixelSize {
animation: Appearance.animation.elementResize.numberAnimation.createObject(this)
}
family: Appearance.font.family.expressive
weight: Font.Bold
}
Behavior on opacity {
animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this)
}
}
}