feat(clock): Improve digital clock style (#2593)

This commit is contained in:
end-4
2025-12-29 18:48:24 +01:00
committed by GitHub
7 changed files with 297 additions and 86 deletions
@@ -53,9 +53,9 @@ ContentPage {
}
ContentSection {
id: settingsClock
icon: "clock_loader_40"
title: Translation.tr("Widget: Clock")
id: settingsClock
function stylePresent(styleName) {
if (!Config.options.background.widgets.clock.showOnlyWhenLocked && Config.options.background.widgets.clock.style === styleName) {
@@ -120,61 +120,161 @@ ContentPage {
}
}
ContentSubsection {
visible: !Config.options.background.widgets.clock.showOnlyWhenLocked
title: Translation.tr("Clock style")
ConfigSelectionArray {
currentValue: Config.options.background.widgets.clock.style
onSelected: newValue => {
Config.options.background.widgets.clock.style = newValue;
}
options: [
{
displayName: Translation.tr("Digital"),
icon: "timer_10",
value: "digital"
},
{
displayName: Translation.tr("Cookie"),
icon: "cookie",
value: "cookie"
ConfigRow {
ContentSubsection {
visible: !Config.options.background.widgets.clock.showOnlyWhenLocked
title: Translation.tr("Clock style")
Layout.fillWidth: true
ConfigSelectionArray {
currentValue: Config.options.background.widgets.clock.style
onSelected: newValue => {
Config.options.background.widgets.clock.style = newValue;
}
]
options: [
{
displayName: Translation.tr("Digital"),
icon: "timer_10",
value: "digital"
},
{
displayName: Translation.tr("Cookie"),
icon: "cookie",
value: "cookie"
}
]
}
}
}
ContentSubsection {
title: Translation.tr("Clock style (locked)")
ConfigSelectionArray {
currentValue: Config.options.background.widgets.clock.styleLocked
onSelected: newValue => {
Config.options.background.widgets.clock.styleLocked = newValue;
}
options: [
{
displayName: Translation.tr("Digital"),
icon: "timer_10",
value: "digital"
},
{
displayName: Translation.tr("Cookie"),
icon: "cookie",
value: "cookie"
ContentSubsection {
title: Translation.tr("Clock style (locked)")
Layout.fillWidth: false
ConfigSelectionArray {
currentValue: Config.options.background.widgets.clock.styleLocked
onSelected: newValue => {
Config.options.background.widgets.clock.styleLocked = newValue;
}
]
options: [
{
displayName: Translation.tr("Digital"),
icon: "timer_10",
value: "digital"
},
{
displayName: Translation.tr("Cookie"),
icon: "cookie",
value: "cookie"
}
]
}
}
}
ContentSubsection {
visible: settingsClock.digitalPresent
title: Translation.tr("Digital clock settings")
tooltip: Translation.tr("Font width and roundness settings are only available for some fonts like Google Sans Flex")
ConfigSwitch {
buttonIcon: "animation"
text: Translation.tr("Animate time change")
checked: Config.options.background.widgets.clock.digital.animateChange
onCheckedChanged: {
Config.options.background.widgets.clock.digital.animateChange = checked;
ConfigRow {
uniform: true
ConfigSwitch {
buttonIcon: "vertical_distribute"
text: Translation.tr("Vertical")
checked: Config.options.background.widgets.clock.digital.vertical
onCheckedChanged: {
Config.options.background.widgets.clock.digital.vertical = checked;
}
}
ConfigSwitch {
buttonIcon: "animation"
text: Translation.tr("Animate time change")
checked: Config.options.background.widgets.clock.digital.animateChange
onCheckedChanged: {
Config.options.background.widgets.clock.digital.animateChange = checked;
}
}
}
ConfigRow {
uniform: true
ConfigSwitch {
buttonIcon: "date_range"
text: Translation.tr("Show date")
checked: Config.options.background.widgets.clock.digital.showDate
onCheckedChanged: {
Config.options.background.widgets.clock.digital.showDate = checked;
}
}
ConfigSwitch {
buttonIcon: "activity_zone"
text: Translation.tr("Use adaptive alignment")
checked: Config.options.background.widgets.clock.digital.adaptiveAlignment
onCheckedChanged: {
Config.options.background.widgets.clock.digital.adaptiveAlignment = checked;
}
StyledToolTip {
text: Translation.tr("Aligns the date and quote to left, center or right depending on its position on the screen.")
}
}
}
MaterialTextArea {
Layout.fillWidth: true
placeholderText: Translation.tr("Font family")
text: Config.options.background.widgets.clock.digital.font.family
wrapMode: TextEdit.Wrap
onTextChanged: {
Config.options.background.widgets.clock.digital.font.family = text;
}
}
ConfigSlider {
text: Translation.tr("Font weight")
value: Config.options.background.widgets.clock.digital.font.weight
usePercentTooltip: false
buttonIcon: "format_bold"
from: 1
to: 1000
stopIndicatorValues: [350]
onValueChanged: {
Config.options.background.widgets.clock.digital.font.weight = value;
}
}
ConfigSlider {
text: Translation.tr("Font size")
value: Config.options.background.widgets.clock.digital.font.size
usePercentTooltip: false
buttonIcon: "format_size"
from: 70
to: 150
stopIndicatorValues: [90]
onValueChanged: {
Config.options.background.widgets.clock.digital.font.size = value;
}
}
ConfigSlider {
text: Translation.tr("Font width")
value: Config.options.background.widgets.clock.digital.font.width
usePercentTooltip: false
buttonIcon: "fit_width"
from: 25
to: 125
stopIndicatorValues: [100]
onValueChanged: {
Config.options.background.widgets.clock.digital.font.width = value;
}
}
ConfigSlider {
text: Translation.tr("Font roundness")
value: Config.options.background.widgets.clock.digital.font.roundness
usePercentTooltip: false
buttonIcon: "line_curve"
from: 0
to: 100
onValueChanged: {
Config.options.background.widgets.clock.digital.font.roundness = value;
}
}
}