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 qs.modules.common.functions
import QtQuick import QtQuick
import QtQuick.Layouts import QtQuick.Layouts
import Quickshell
import Qt5Compat.GraphicalEffects import Qt5Compat.GraphicalEffects
Item { Item {
@@ -23,7 +22,7 @@ Item {
Config.options.background.clock.cookie.minuteHandStyle === "medium" ? 12 : 5 Config.options.background.clock.cookie.minuteHandStyle === "medium" ? 12 : 5
property real centerDotSize: 10 property real centerDotSize: 10
property real hourDotSize: 12 property real hourDotSize: 12
property real centerGlowSize: 135 property real hourMarkSize: 135
property real secondDotSize: 20 property real secondDotSize: 20
property real secondHandWidth: 2 property real secondHandWidth: 2
property real secondHandLength: 100 property real secondHandLength: 100
@@ -75,12 +74,18 @@ Item {
anchors.fill: parent anchors.fill: parent
} }
HourMarks { HourMarks {
anchors.fill: parent anchors.centerIn: parent
implicitSize: root.hourMarkSize
markLength: root.hourDotSize
color: root.colTimeIndicators
colOnBackground: root.colOnBackground
} }
// Number column in the middle // Number column in the middle
TimeColumn { TimeColumn {
anchors.centerIn: parent anchors.centerIn: parent
color: root.colOnBackground
clockNumbers: root.clockNumbers
} }
// Hour hand // Hour hand
@@ -132,6 +137,7 @@ Item {
} }
} }
// Date
DateIndicator { DateIndicator {
anchors.fill: parent anchors.fill: parent
colOnBackground: root.colOnBackground colOnBackground: root.colOnBackground
@@ -8,13 +8,21 @@ import qs.modules.common.functions
import QtQuick import QtQuick
Item { 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 { Rectangle {
opacity: Config.options.background.clock.cookie.centerGlow ? 1.0 : 0 opacity: root.isEnabled ? 1.0 : 0
z: 0 z: 0
color: root.colTimeIndicators color: root.color
anchors.centerIn: parent anchors.centerIn: parent
implicitWidth: Config.options.background.clock.cookie.centerGlow ? centerGlowSize : centerGlowSize * 1.75 implicitWidth: root.isEnabled ? root.implicitSize : root.implicitSize * 1.75
implicitHeight: Config.options.background.clock.cookie.centerGlow ? centerGlowSize : centerGlowSize * 1.75 // Not using implicitHeight to allow smooth transition implicitHeight: root.isEnabled ? root.implicitSize : root.implicitSize * 1.75 // Not using implicitHeight to allow smooth transition
radius: implicitWidth / 2 radius: implicitWidth / 2
Behavior on opacity { Behavior on opacity {
animation: Appearance.animation.elementResize.numberAnimation.createObject(this) animation: Appearance.animation.elementResize.numberAnimation.createObject(this)
@@ -27,7 +35,7 @@ Item {
} }
} }
// Center glow lines // Hour mark lines
Rectangle { Rectangle {
id: glowLines id: glowLines
z: 1 z: 1
@@ -36,23 +44,28 @@ Item {
model: 12 model: 12
Item { Item {
required property int index required property int index
opacity: Config.options.background.clock.cookie.centerGlow ? 1.0 : 0
rotation: 360 / 12 * index
anchors.fill: parent anchors.fill: parent
rotation: 360 / 12 * index
opacity: root.isEnabled ? 1.0 : 0
Behavior on opacity { Behavior on opacity {
animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this) animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this)
} }
Rectangle { Rectangle {
anchors { anchors {
left: parent.left left: parent.left
verticalCenter: parent.verticalCenter 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 implicitHeight: implicitWidth / 2
radius: implicitWidth / 2 radius: implicitWidth / 2
color: root.colOnBackground color: root.colOnBackground
opacity: Config.options.background.clock.cookie.centerGlow ? 0.5 : 0 opacity: root.isEnabled ? 0.5 : 0
Behavior on opacity { Behavior on opacity {
animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this) animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this)
} }
@@ -8,30 +8,43 @@ import qs.modules.common.functions
import QtQuick import QtQuick
Column { 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 z: 1
spacing: -16 spacing: -16
Repeater { Repeater {
model: root.clockNumbers model: root.clockNumbers
delegate: StyledText { delegate: StyledText {
required property string modelData required property string modelData
opacity: Config.options.background.clock.cookie.timeIndicators ? 1.0 : 0 // Not using visible to allow smooth transition property bool hourMarksEnabled: Config.options.background.clock.cookie.hourMarks
anchors.horizontalCenter: parent?.horizontalCenter property bool isAmPm: !!modelData.match(/am|pm/i)
color: root.colOnBackground 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") text: modelData.padStart(2, "0")
font { font {
property real numberSizeWithoutGlow: modelData.match(/am|pm/i) ? 26 : 68 family: Appearance.font.family.expressive
property real numberSizeWithGlow: modelData.match(/am|pm/i) ? 10 : 40 weight: Font.Bold
pixelSize: !Config.options.background.clock.cookie.timeIndicators ? 100 : // open/close animation pixelSize: numberSize
Config.options.background.clock.cookie.centerGlow ? numberSizeWithGlow : numberSizeWithoutGlow // changing size according to center glow
Behavior on pixelSize { Behavior on pixelSize {
animation: Appearance.animation.elementResize.numberAnimation.createObject(this) 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)
} }
} }
} }
@@ -137,7 +137,7 @@ Singleton {
property string secondHandStyle: "dot" // Options: "dot", "line" , "none" property string secondHandStyle: "dot" // Options: "dot", "line" , "none"
property string dateStyle: "rotating" // Options: "rotating", "rect", "bubble" , "none" property string dateStyle: "rotating" // Options: "rotating", "rect", "bubble" , "none"
property bool timeIndicators: true property bool timeIndicators: true
property bool centerGlow: true property bool hourMarks: true
property bool dateInClock: true property bool dateInClock: true
property bool constantlyRotate: false property bool constantlyRotate: false
} }
@@ -20,8 +20,7 @@ Item {
property real shapeRotation: 0 property real shapeRotation: 0
Loader {
Loader{
active: constantlyRotate active: constantlyRotate
sourceComponent: FrameAnimation{ sourceComponent: FrameAnimation{
running: true running: true
@@ -52,7 +51,8 @@ Item {
var radius = root.implicitSize / 2 - root.amplitude var radius = root.implicitSize / 2 - root.amplitude
for (var i = 0; i <= steps; i++) { for (var i = 0; i <= steps; i++) {
var angle = (i / steps) * 2 * Math.PI var angle = (i / steps) * 2 * Math.PI
var wave = constantlyRotate ? Math.sin(angle * root.sides + Math.PI/2 - root.shapeRotation) * root.amplitude : Math.sin(angle * root.sides + Math.PI/2) * root.amplitude var rotatedAngle = angle * root.sides + Math.PI/2 + (root.shapeRotation * root.constantlyRotate)
var wave = Math.sin(rotatedAngle) * root.amplitude
var x = Math.cos(angle) * (radius + wave) + cx var x = Math.cos(angle) * (radius + wave) + cx
var y = Math.sin(angle) * (radius + wave) + cy var y = Math.sin(angle) * (radius + wave) + cy
points.push(Qt.point(x, y)) points.push(Qt.point(x, y))
@@ -64,7 +64,7 @@ ContentPage {
onSelected: newValue => { onSelected: newValue => {
Config.options.background.clock.cookie.dialNumberStyle = newValue; Config.options.background.clock.cookie.dialNumberStyle = newValue;
if (newValue !== "dots" && newValue !== "full") { if (newValue !== "dots" && newValue !== "full") {
Config.options.background.clock.cookie.centerGlow = false; Config.options.background.clock.cookie.hourMarks = false;
} }
if (newValue === "numbers") { if (newValue === "numbers") {
Config.options.background.clock.cookie.timeIndicators = false; Config.options.background.clock.cookie.timeIndicators = false;
@@ -183,6 +183,11 @@ ContentPage {
Config.options.background.clock.cookie.secondHandStyle = newValue; Config.options.background.clock.cookie.secondHandStyle = newValue;
} }
options: [ options: [
{
displayName: "",
icon: "block",
value: "hide"
},
{ {
displayName: Translation.tr("Classic"), displayName: Translation.tr("Classic"),
icon: "radio", icon: "radio",
@@ -198,11 +203,6 @@ ContentPage {
icon: "adjust", icon: "adjust",
value: "dot" value: "dot"
}, },
{
displayName: Translation.tr("Hide"),
icon: "deselect",
value: "hide"
}
] ]
} }
} }
@@ -218,8 +218,8 @@ ContentPage {
} }
options: [ options: [
{ {
displayName: Translation.tr("None"), displayName: "",
icon: "deselect", icon: "block",
value: "none" value: "none"
}, },
{ {
@@ -273,13 +273,13 @@ ContentPage {
ConfigSwitch { ConfigSwitch {
enabled: Config.options.background.clock.style === "cookie" && Config.options.background.clock.cookie.dialNumberStyle === "dots" || Config.options.background.clock.cookie.dialNumberStyle === "full" enabled: Config.options.background.clock.style === "cookie" && Config.options.background.clock.cookie.dialNumberStyle === "dots" || Config.options.background.clock.cookie.dialNumberStyle === "full"
buttonIcon: "brightness_7" buttonIcon: "brightness_7"
text: Translation.tr("Center glow") text: Translation.tr("Hour marks")
checked: Config.options.background.clock.cookie.centerGlow checked: Config.options.background.clock.cookie.hourMarks
onEnabledChanged: { onEnabledChanged: {
checked = Config.options.background.clock.cookie.centerGlow; checked = Config.options.background.clock.cookie.hourMarks;
} }
onCheckedChanged: { onCheckedChanged: {
Config.options.background.clock.cookie.centerGlow = checked; Config.options.background.clock.cookie.hourMarks = checked;
} }
StyledToolTip { StyledToolTip {
text: "Can only be turned on using the 'Dots' or 'Full' dial style for aesthetic reasons" text: "Can only be turned on using the 'Dots' or 'Full' dial style for aesthetic reasons"