Shinonome/dots-hyprland
1
0
Fork 1
mirror of https://github.com/end-4/dots-hyprland.git synced 2026-06-07 07:49:28 -05:00
Code Issues Actions Packages Projects Releases Wiki Activity

cookie clock: put hands in loaders

Browse Source
This commit is contained in:
end-4
2025-10-11 16:55:20 +02:00
parent 22316b4684
commit 410da66834
6 changed files with 71 additions and 104 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.config/quickshell/ii/modules/background/cookieClock/CookieClock.qml
+32 -45
View File
@@ -18,17 +18,7 @@ Item {
readonly property string clockStyle: Config.options.background.clock.style
property real implicitSize: 230
property real hourHandLength: 72
property real hourHandWidth: 20
property real minuteHandLength: 95
property real minuteHandWidth: Config.options.background.clock.cookie.minuteHandStyle === "bold" ? hourHandWidth :
Config.options.background.clock.cookie.minuteHandStyle === "medium" ? 12 : 5
property real centerDotSize: 10
property real hourDotSize: 12
property real hourMarkSize: 135
property real secondDotSize: 20
property real secondHandWidth: 2
property real secondHandLength: 100
property real hourLineSize: 4
property real minuteLineSize: 2
property real hourNumberSize: 36
@@ -37,7 +27,7 @@ Item {
property color colShadow: Appearance.colors.colShadow
property color colBackground: Appearance.colors.colSecondaryContainer
property color colOnBackground: ColorUtils.mix(Appearance.colors.colPrimary, Appearance.colors.colSecondaryContainer, 0.5)
property color colHourHand: Appearance.colors.colPrimaryContainer
property color colHourHand: Appearance.colors.colPrimary
property color colMinuteHand: Appearance.colors.colSecondary
property color colSecondHand: Appearance.colors.colTertiary
property color colOnHourHand: Appearance.colors.colOnPrimary
@@ -52,7 +42,7 @@ Item {
implicitHeight: implicitSize
DropShadow {
source: cookie
source: cookie
anchors.fill: source
horizontalOffset: 0
verticalOffset: 2
@@ -77,14 +67,14 @@ Item {
anchors.fill: parent
color: root.colOnBackground
}
// Stupid extra hour marks in the middle
FadeLoader {
id: hourMarksLoader
anchors.centerIn: parent
shown: Config.options.background.clock.cookie.hourMarks
sourceComponent: HourMarks {
implicitSize: root.hourMarkSize * (1.75 - 0.75 * hourMarksLoader.opacity)
implicitSize: 135 * (1.75 - 0.75 * hourMarksLoader.opacity)
color: root.colTimeIndicators
colOnBackground: root.colOnBackground
}
@@ -99,45 +89,45 @@ Item {
Behavior on scale {
animation: Appearance.animation.elementResize.numberAnimation.createObject(this)
}
sourceComponent: TimeColumn {
color: root.colOnBackground
}
}
// Hour hand
HourHand {
FadeLoader {
anchors.fill: parent
handLength: root.hourHandLength
handWidth: root.hourHandWidth
clockHour: root.clockHour
clockMinute: root.clockMinute
style: Config.options.background.clock.cookie.hourHandStyle
color: root.colHourHand
z: Config.options.background.clock.cookie.hourHandStyle === "fill" ? 3 : 1
shown: Config.options.background.clock.cookie.hourHandStyle !== "hide"
sourceComponent: HourHand {
clockHour: root.clockHour
clockMinute: root.clockMinute
style: Config.options.background.clock.cookie.hourHandStyle
color: root.colHourHand
}
}
// Minute hand
MinuteHand {
FadeLoader {
anchors.fill: parent
handWidth: root.minuteHandWidth
handLength: root.minuteHandLength
clockMinute: root.clockMinute
style: Config.options.background.clock.cookie.minuteHandStyle
color: root.colMinuteHand
shown: Config.options.background.clock.cookie.minuteHandStyle !== "hide"
sourceComponent: MinuteHand {
anchors.fill: parent
clockMinute: root.clockMinute
style: Config.options.background.clock.cookie.minuteHandStyle
color: root.colMinuteHand
}
}
// Second hand
Loader {
FadeLoader {
id: secondHandLoader
active: Config.options.time.secondPrecision && Config.options.background.clock.cookie.secondHandStyle !== "none"
z: (Config.options.background.clock.cookie.secondHandStyle === "line") ? 2 : 3
shown: Config.options.time.secondPrecision && Config.options.background.clock.cookie.secondHandStyle !== "none"
anchors.fill: parent
z: 2
sourceComponent: SecondHand {
id: secondHand
handWidth: root.secondHandWidth
handLength: root.secondHandLength
dotSize: root.secondDotSize
clockSecond: root.clockSecond
style: Config.options.background.clock.cookie.secondHandStyle
color: root.colSecondHand
@@ -145,17 +135,15 @@ Item {
}
// Center dot
Rectangle {
visible: Config.options.background.clock.cookie.minuteHandStyle === "hide" && Config.options.background.clock.cookie.hourHandStyle === "hide" ? false : true
FadeLoader {
z: 4
opacity: Config.options.background.clock.cookie.minuteHandStyle !== "bold" ? 1.0 : 0
color: Config.options.background.clock.cookie.minuteHandStyle === "medium" ? root.colBackground : root.colMinuteHand
anchors.centerIn: parent
implicitWidth: centerDotSize
implicitHeight: implicitWidth
radius: implicitWidth / 2
Behavior on opacity {
animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this)
shown: Config.options.background.clock.cookie.minuteHandStyle !== "bold"
sourceComponent: Rectangle {
color: Config.options.background.clock.cookie.minuteHandStyle === "medium" ? root.colBackground : root.colMinuteHand
implicitWidth: 8
implicitHeight: implicitWidth
radius: width / 2
}
}
@@ -166,5 +154,4 @@ Item {
style: Config.options.background.clock.cookie.dateStyle
dateSquareSize: root.dateSquareSize
}
}
.config/quickshell/ii/modules/background/cookieClock/HourHand.qml
+4 -19
View File
@@ -5,45 +5,30 @@ import QtQuick
Item {
id: root
anchors.fill: parent
required property int clockHour
required property int clockMinute
property real handLength: 72
property real handWidth: 16
property real handWidth: 18
property string style: "fill"
property color color: Appearance.colors.colPrimary
property real fillColorAlpha: root.style === "stroke" ? 0.0 : 1.0 // for animation
property real fillColorAlpha: root.style === "stroke" ? 0 : 1
Behavior on fillColorAlpha {
animation: Appearance.animation.elementResize.numberAnimation.createObject(this)
}
rotation: -90 + (360 / 12) * (root.clockHour + root.clockMinute / 60)
z: root.style === "fill" ? 3 : 1
opacity: root.style === "hide" ? 0.0 : 1.0
Behavior on opacity {
animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this)
}
Rectangle {
anchors.verticalCenter: parent.verticalCenter
x: {
let position = parent.width / 2 - root.handWidth / 2;
if (root.style === "classic") position -= 15;
return position;
}
x: (parent.width - root.handWidth) / 2 - 15 * (root.style === "classic")
width: root.handLength
height: root.style === "classic" ? 8 : root.handWidth
radius: root.style === "classic" ? 2 : root.handWidth / 2
color : Qt.rgba(root.color.r, root.color.g, root.color.b, fillColorAlpha)
color : Qt.rgba(root.color.r, root.color.g, root.color.b, root.fillColorAlpha)
border.color: root.color
border.width: 4
Behavior on x {
animation: Appearance.animation.elementResize.numberAnimation.createObject(this)
.config/quickshell/ii/modules/background/cookieClock/MinuteHand.qml
+2 -6
View File
@@ -8,21 +8,17 @@ Item {
anchors.fill: parent
required property int clockMinute
property real handWidth: 16
property real handLength: 95
property string style: "medium"
property real handLength: 95
property real handWidth: style === "bold" ? 18 : style === "medium" ? 12 : 5
property color color: Appearance.colors.colSecondary
z: root.style === "thin" ? 1 : 3
rotation: -90 + (360 / 60) * root.clockMinute
opacity: root.style === "hide" ? 0.0 : 1.0
Behavior on rotation {
animation: Appearance.animation.elementResize.numberAnimation.createObject(this)
}
Behavior on opacity {
animation: Appearance.animation.elementResize.numberAnimation.createObject(this)
}
Rectangle {
anchors.verticalCenter: parent.verticalCenter
.config/quickshell/ii/modules/background/cookieClock/SecondHand.qml
+31 -32
View File
@@ -1,6 +1,7 @@
pragma ComponentBehavior: Bound
import qs.modules.common
import qs.modules.common.widgets
import QtQuick
Item {
@@ -14,50 +15,23 @@ Item {
property string style: "hide"
property color color: Appearance.colors.colSecondary
z: root.style === "line" ? 2 : 3
rotation: (360 / 60 * clockSecond) + 90 // +90 degrees to align with minute hand
opacity: root.style !== "hide" ? 1.0 : 0
rotation: (360 / 60 * clockSecond) + 90
Behavior on opacity {
animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this)
}
Behavior on rotation {
enabled: Config.options.background.clock.cookie.constantlyRotate // Animating every second is expensive...
animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this)
}
Rectangle {
implicitWidth: root.style === "dot" ? root.dotSize : root.handLength
implicitHeight: root.style === "dot" ? root.dotSize : root.handWidth
radius: root.style === "dot" ? implicitWidth / 2 : root.handWidth / 2
color: root.color
Behavior on implicitHeight {
animation: Appearance.animation.elementResize.numberAnimation.createObject(this)
}
Behavior on implicitWidth {
animation: Appearance.animation.elementResize.numberAnimation.createObject(this)
}
anchors {
left: parent.left
verticalCenter: parent.verticalCenter
leftMargin: 10
}
}
Rectangle {
// Dot on the classic style
opacity: root.style === "classic" ? 1.0 : 0.0
implicitHeight: root.style === "classic" ? 14 : 0
implicitWidth: root.style === "classic" ? 14 : 0
implicitWidth: root.style === "dot" ? root.dotSize : root.handLength
implicitHeight: root.style === "dot" ? root.dotSize : root.handWidth
radius: Math.min(width, height) / 2
color: root.color
radius: Appearance.rounding.small
anchors {
left: parent.left
verticalCenter: parent.verticalCenter
leftMargin: 40
}
Behavior on opacity {
animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this)
}
Behavior on implicitHeight {
animation: Appearance.animation.elementResize.numberAnimation.createObject(this)
}
@@ -65,4 +39,29 @@ Item {
animation: Appearance.animation.elementResize.numberAnimation.createObject(this)
}
}
}
// Classic style dot in the middle of the hand
FadeLoader {
id: classicDotLoader
anchors {
left: parent.left
verticalCenter: parent.verticalCenter
}
shown: root.style === "classic"
Rectangle {
anchors {
left: parent.left
verticalCenter: parent.verticalCenter
leftMargin: 40
}
implicitWidth: root.style === "classic" ? 14 : 0
implicitHeight: implicitWidth
color: root.color
radius: Appearance.rounding.small
Behavior on implicitWidth {
animation: Appearance.animation.elementResize.numberAnimation.createObject(this)
}
}
}
}
.config/quickshell/ii/modules/background/cookieClock/minuteMarks/MinuteMarks.qml
+1 -1
View File
@@ -30,7 +30,7 @@ Item {
sourceComponent: BigHourNumbers {
numberSize: 80
color: root.color
margins: 70 - bigHourNumbersLoader.opacity * 40
margins: 20 - 10 * bigHourNumbersLoader.opacity
}
}
.config/quickshell/ii/modules/common/widgets/MaterialCookie.qml
+1 -1
View File
@@ -54,7 +54,7 @@ Item {
var radius = root.implicitSize / 2 - root.amplitude
for (var i = 0; i <= steps; i++) {
var angle = (i / steps) * 2 * Math.PI
var rotatedAngle = angle * root.sides + Math.PI/2 + (root.shapeRotation * -root.constantlyRotate)
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 y = Math.sin(angle) * (radius + wave) + cy