kenji/illogical-impulse
1
0
Fork 0
forked from Shinonome/dots-hyprland
Code Pull Requests Activity

redesign stopwatch

Browse Source
This commit is contained in:
end-4
2025-08-09 12:54:53 +07:00
parent 9bc4ff16a7
commit de759b5120
1 changed files with 83 additions and 85 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.config/quickshell/ii/modules/sidebarRight/pomodoro/PomodoroWidget.qml
+62 -64
View File
@@ -15,9 +15,6 @@ Item {
{"name": Translation.tr("Pomodoro"), "icon": "timer_play"}, {"name": Translation.tr("Pomodoro"), "icon": "timer_play"},
{"name": Translation.tr("Stopwatch"), "icon": "timer"} {"name": Translation.tr("Stopwatch"), "icon": "timer"}
] ]
property int lapsListItemPadding: 8
property int lapsListItemSpacing: 5
// These are keybinds for stopwatch and pomodoro // These are keybinds for stopwatch and pomodoro
Keys.onPressed: (event) => { Keys.onPressed: (event) => {
@@ -214,7 +211,7 @@ Item {
contentItem: StyledText { contentItem: StyledText {
anchors.centerIn: parent anchors.centerIn: parent
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
text: Pomodoro.isPomodoroRunning ? Translation.tr("Stop") : Translation.tr("Start") text: Pomodoro.isPomodoroRunning ? Translation.tr("Pause") : Translation.tr("Start")
color: Appearance.colors.colSecondary color: Appearance.colors.colSecondary
} }
Layout.preferredHeight: 35 Layout.preferredHeight: 35
@@ -330,62 +327,53 @@ Item {
Layout.fillHeight: true Layout.fillHeight: true
ColumnLayout { ColumnLayout {
anchors.horizontalCenter: parent.horizontalCenter anchors {
spacing: 20 fill: parent
Layout.fillWidth: true leftMargin: 20
rightMargin: 20
RowLayout {
spacing: 40
// The Stopwatch circle
CircularProgress {
id: stopwatchClock
Layout.alignment: Qt.AlignHCenter
lineWidth: 7
gapAngle: Math.PI / 18
value: {
return Pomodoro.stopwatchTime % 6000 / 6000 // The seconds in percent
} }
size: 125 spacing: 20
primaryColor: Math.floor(Pomodoro.stopwatchTime / 6000) % 2 ? Appearance.colors.colSecondaryContainer : Appearance.m3colors.m3onSecondaryContainer
secondaryColor: Math.floor(Pomodoro.stopwatchTime / 6000) % 2 ? Appearance.m3colors.m3onSecondaryContainer : Appearance.colors.colSecondaryContainer
enableAnimation: false // The animation seems weird after each cycle
ColumnLayout { ColumnLayout {
anchors.centerIn: parent spacing: 8
spacing: 0
StyledText {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
Layout.fillWidth: false
RowLayout { // Elapsed
id: elapsedIndicator
Layout.alignment: Qt.AlignHCenter
spacing: 0
StyledText {
Layout.preferredWidth: elapsedIndicator.width * 0.6 // Prevent shakiness
font.pixelSize: 40
color: Appearance.m3colors.m3onSurface
text: { text: {
let totalSeconds = Math.floor(Pomodoro.stopwatchTime) / 100 let totalSeconds = Math.floor(Pomodoro.stopwatchTime) / 100
let minutes = Math.floor(totalSeconds / 60).toString().padStart(2, '0') let minutes = Math.floor(totalSeconds / 60).toString().padStart(2, '0')
let seconds = Math.floor(totalSeconds % 60).toString().padStart(2, '0') let seconds = Math.floor(totalSeconds % 60).toString().padStart(2, '0')
return `${minutes}:${seconds}` return `${minutes}:${seconds}`
} }
font.pixelSize: Appearance.font.pixelSize.hugeass + 4
color: Appearance.m3colors.m3onSurface
} }
StyledText { StyledText {
Layout.alignment: Qt.AlignHCenter Layout.fillWidth: true
font.pixelSize: 40
color: Appearance.colors.colSubtext
text: { text: {
return (Math.floor(Pomodoro.stopwatchTime) % 100).toString().padStart(2, '0') return `:<sub>${(Math.floor(Pomodoro.stopwatchTime) % 100).toString().padStart(2, '0')}</sub>`
}
font.pixelSize: Appearance.font.pixelSize.normal
color: Appearance.m3colors.m3onSurface
} }
} }
} }
// The Start/Stop and Reset buttons // The Start/Stop and Reset buttons
ColumnLayout { RowLayout {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
spacing: 10 spacing: 4
RippleButton { RippleButton {
contentItem: StyledText { contentItem: StyledText {
anchors.centerIn: parent anchors.centerIn: parent
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
text: Pomodoro.isStopwatchRunning ? Translation.tr("Stop") : Translation.tr("Start") text: Pomodoro.isStopwatchRunning ? Translation.tr("Pause") : Pomodoro.stopwatchTime === 0 ? Translation.tr("Start") : Translation.tr("Resume")
color: Appearance.colors.colSecondary color: Appearance.colors.colSecondary
} }
Layout.preferredHeight: 35 Layout.preferredHeight: 35
@@ -413,35 +401,51 @@ Item {
} }
} }
// Laps
StyledListView { StyledListView {
id: lapsList id: lapsList
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredHeight: stopwatchTab.height - stopwatchClock.height - 20 Layout.fillHeight: true
spacing: lapsListItemSpacing spacing: lapsListItemSpacing
clip: true clip: true
popin: true popin: true
model: Pomodoro.stopwatchLaps
model: ScriptModel {
values: Pomodoro.stopwatchLaps
}
delegate: Rectangle { delegate: Rectangle {
id: lapItem
required property int index
required property var modelData
property var horizontalPadding: 10
property var verticalPadding: 6
width: lapsList.width width: lapsList.width
implicitHeight: lapsContentText.implicitHeight + lapsListItemPadding implicitHeight: lapRow.implicitHeight + verticalPadding * 2
implicitWidth: lapRow.implicitWidth + horizontalPadding * 2
color: Appearance.colors.colLayer2 color: Appearance.colors.colLayer2
radius: Appearance.rounding.small radius: Appearance.rounding.small
RowLayout {
id: lapRow
anchors {
fill: parent
leftMargin: lapItem.horizontalPadding
rightMargin: lapItem.horizontalPadding
topMargin: lapItem.verticalPadding
bottomMargin: lapItem.verticalPadding
}
StyledText { StyledText {
id: lapsContentText font.pixelSize: Appearance.font.pixelSize.small
anchors.left: parent.left color: Appearance.colors.colSubtext
anchors.top: parent.top text: `${Pomodoro.stopwatchLaps.length - lapItem.index}.`
anchors.bottom: parent.bottom }
leftPadding: lapsListItemPadding
rightPadding: lapsListItemPadding
topPadding: lapsListItemPadding / 2
bottomPadding: lapsListItemPadding / 2
font.pixelSize: Appearance.font.pixelSize.normal
StyledText {
font.pixelSize: Appearance.font.pixelSize.small
text: { text: {
let lapTime = modelData let lapTime = lapItem.modelData
let _10ms = (Math.floor(lapTime) % 100).toString().padStart(2, '0') let _10ms = (Math.floor(lapTime) % 100).toString().padStart(2, '0')
let totalSeconds = Math.floor(lapTime) / 100 let totalSeconds = Math.floor(lapTime) / 100
let minutes = Math.floor(totalSeconds / 60).toString().padStart(2, '0') let minutes = Math.floor(totalSeconds / 60).toString().padStart(2, '0')
@@ -450,26 +454,19 @@ Item {
} }
} }
StyledText { Item { Layout.fillWidth: true }
id: lapsDiffText
anchors.right: parent.right
anchors.top: parent.top
anchors.bottom: parent.bottom
leftPadding: lapsListItemPadding
rightPadding: lapsListItemPadding * 2
topPadding: lapsListItemPadding / 2
bottomPadding: lapsListItemPadding / 2
font.pixelSize: Appearance.font.pixelSize.normal
color: Appearance.colors.colPrimary
StyledText {
font.pixelSize: Appearance.font.pixelSize.smaller
color: Appearance.colors.colPrimary
text: { text: {
if (index != Pomodoro.stopwatchLaps.length - 1) { // except first lap if (lapItem.index != Pomodoro.stopwatchLaps.length - 1) { // except first lap
let lapTime = modelData - Pomodoro.stopwatchLaps[index + 1] let lapTime = lapItem.modelData - Pomodoro.stopwatchLaps[lapItem.index + 1]
let _10ms = (Math.floor(lapTime) % 100).toString().padStart(2, '0') let _10ms = (Math.floor(lapTime) % 100).toString().padStart(2, '0')
let totalSeconds = Math.floor(lapTime) / 100 let totalSeconds = Math.floor(lapTime) / 100
let minutes = Math.floor(totalSeconds / 60).toString().padStart(2, '0') let minutes = Math.floor(totalSeconds / 60).toString().padStart(2, '0')
let seconds = Math.floor(totalSeconds % 60).toString().padStart(2, '0') let seconds = Math.floor(totalSeconds % 60).toString().padStart(2, '0')
return `+${minutes}:${seconds}.${_10ms}` return `+${minutes == "00" ? "" : minutes + ":"}${seconds}.${_10ms}`
} else { } else {
return `` // Nothing for first lap return `` // Nothing for first lap
} }
@@ -481,4 +478,5 @@ Item {
} }
} }
} }
}
} }