BugFix: Timer UI

This commit is contained in:
Hariharan Mudaliar 2025-12-11 01:16:35 +05:30
commit 5a503b8238
No known key found for this signature in database
GPG key ID: D04F1C2B9194DDFC
2 changed files with 38 additions and 9 deletions

View file

@ -20,12 +20,35 @@ struct LockScreenTimerWidget: View {
} }
} }
private var countdownFont: Font { displayFont(size: 56) }
private func displayFont(size: CGFloat) -> Font { private func displayFont(size: CGFloat) -> Font {
.custom("SF Pro Display", size: size) .custom("SF Pro Display", size: size)
} }
private var hasHoursComponent: Bool {
abs(timerManager.remainingTime) >= 3600
}
private var hasDoubleDigitHours: Bool {
abs(timerManager.remainingTime) >= 36_000 // 10 hours or more
}
private var titleFrameWidth: CGFloat {
if hasDoubleDigitHours { return 78 }
if hasHoursComponent { return 90 }
return 130
}
private var countdownFrameWidth: CGFloat {
if hasDoubleDigitHours { return 248 }
if hasHoursComponent { return 235 }
return 205
}
private var countdownFont: Font {
let baseSize: CGFloat = hasDoubleDigitHours ? 52 : 56
return displayFont(size: baseSize)
}
private var timerLabel: String { private var timerLabel: String {
timerManager.timerName.isEmpty ? "Timer" : timerManager.timerName timerManager.timerName.isEmpty ? "Timer" : timerManager.timerName
} }
@ -104,7 +127,7 @@ struct LockScreenTimerWidget: View {
var body: some View { var body: some View {
VStack(spacing: 16) { VStack(spacing: 16) {
HStack(alignment: .center, spacing: 18) { HStack(alignment: .center, spacing: 8) {
controlButtons controlButtons
titleSection titleSection
@ -113,7 +136,7 @@ struct LockScreenTimerWidget: View {
countdownSection countdownSection
} }
} }
.padding(.horizontal, 24) .padding(.horizontal, 12)
.padding(.vertical, 18) .padding(.vertical, 18)
.frame(width: Self.preferredSize.width, height: Self.preferredSize.height) .frame(width: Self.preferredSize.width, height: Self.preferredSize.height)
.background(widgetBackground) .background(widgetBackground)
@ -161,10 +184,13 @@ struct LockScreenTimerWidget: View {
.foregroundStyle(timerManager.isOvertime ? Color.red : accentColor) .foregroundStyle(timerManager.isOvertime ? Color.red : accentColor)
.contentTransition(.numericText()) .contentTransition(.numericText())
.animation(.smooth(duration: 0.25), value: timerManager.remainingTime) .animation(.smooth(duration: 0.25), value: timerManager.remainingTime)
.lineLimit(1)
.minimumScaleFactor(0.68)
.frame(maxWidth: .infinity, alignment: .trailing) .frame(maxWidth: .infinity, alignment: .trailing)
} }
.frame(width: 220, alignment: .center) .frame(width: countdownFrameWidth, alignment: .center)
.padding(.trailing, 2) .padding(.trailing, 2)
.layoutPriority(2)
} }
private var titleSection: some View { private var titleSection: some View {
@ -174,12 +200,13 @@ struct LockScreenTimerWidget: View {
font: displayFont(size: 18), font: displayFont(size: 18),
nsFont: .title3, nsFont: .title3,
textColor: accentColor, textColor: accentColor,
minDuration: 0.18, minDuration: 0.16,
frameWidth: Self.preferredSize.width * 0.35 frameWidth: titleFrameWidth
) )
.frame(maxWidth: .infinity) .frame(maxWidth: titleFrameWidth)
} }
.frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .center) .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .center)
.layoutPriority(0)
} }
private var accentRibbon: some View { private var accentRibbon: some View {

View file

@ -215,6 +215,8 @@ struct NotchTimerView: View {
.foregroundStyle(timerManager.isOvertime ? Color.red : .white) .foregroundStyle(timerManager.isOvertime ? Color.red : .white)
.contentTransition(.numericText()) .contentTransition(.numericText())
.animation(.smooth(duration: 0.25), value: timerManager.remainingTime) .animation(.smooth(duration: 0.25), value: timerManager.remainingTime)
.lineLimit(1)
.minimumScaleFactor(0.8)
if timerManager.isOvertime { if timerManager.isOvertime {
Text("Overtime") Text("Overtime")
@ -222,7 +224,7 @@ struct NotchTimerView: View {
.foregroundStyle(.red) .foregroundStyle(.red)
} }
} }
.frame(width: 150, alignment: .trailing) .frame(width: 190, alignment: .trailing)
} }
@ViewBuilder @ViewBuilder