refactor: clean up Dynamic Island expanded layout with phase badge, symmetric edges, and music+heart rate in bottom region
This commit is contained in:
@@ -79,24 +79,22 @@ struct WorkoutLiveActivity: Widget {
|
||||
|
||||
} dynamicIsland: { context in
|
||||
let phaseColor = Self.colorForPhase(context.state.phase)
|
||||
let phaseLabel = context.state.phase.capitalized
|
||||
|
||||
return DynamicIsland {
|
||||
DynamicIslandExpandedRegion(.leading) {
|
||||
VStack(spacing: 2) {
|
||||
HStack(spacing: 4) {
|
||||
Circle()
|
||||
.fill(phaseColor)
|
||||
.frame(width: 6, height: 6)
|
||||
Text("\(context.state.roundCurrent)/\(context.state.roundTotal)")
|
||||
.font(.caption2.weight(.semibold))
|
||||
}
|
||||
if context.state.heartRate > 0 {
|
||||
Text("\(Int(context.state.heartRate)) bpm")
|
||||
.font(.system(size: 9))
|
||||
.foregroundStyle(.red)
|
||||
}
|
||||
HStack(spacing: 4) {
|
||||
Text(phaseLabel.uppercased())
|
||||
.font(.caption.bold())
|
||||
.foregroundStyle(phaseColor)
|
||||
.padding(.horizontal, 4)
|
||||
.padding(.vertical, 2)
|
||||
.background(phaseColor.opacity(0.15))
|
||||
.clipShape(Capsule())
|
||||
Text("\(context.state.roundCurrent)/\(context.state.roundTotal)")
|
||||
.font(.caption.monospacedDigit())
|
||||
.foregroundStyle(.secondary)
|
||||
}
|
||||
.padding(.leading, 8)
|
||||
}
|
||||
DynamicIslandExpandedRegion(.center) {
|
||||
Text(context.state.exerciseName)
|
||||
@@ -107,17 +105,30 @@ struct WorkoutLiveActivity: Widget {
|
||||
Text(timerInterval: Date()...context.state.phaseEndDate, countsDown: true)
|
||||
.font(.system(size: 20, weight: .bold).monospacedDigit())
|
||||
.contentTransition(.numericText(countsDown: true))
|
||||
.padding(.trailing, 8)
|
||||
.frame(width: 56, alignment: .trailing)
|
||||
}
|
||||
DynamicIslandExpandedRegion(.bottom) {
|
||||
HStack(spacing: 6) {
|
||||
Image(systemName: "music.note")
|
||||
.font(.system(size: 10))
|
||||
.font(.caption)
|
||||
.foregroundStyle(.green)
|
||||
Text(context.state.trackTitle)
|
||||
.font(.caption2)
|
||||
Text(context.state.trackArtist.isEmpty
|
||||
? context.state.trackTitle
|
||||
: "\(context.state.trackTitle) — \(context.state.trackArtist)")
|
||||
.font(.caption)
|
||||
.lineLimit(1)
|
||||
.foregroundStyle(.secondary)
|
||||
Spacer()
|
||||
if context.state.heartRate > 0 {
|
||||
HStack(spacing: 2) {
|
||||
Image(systemName: "heart.fill")
|
||||
.font(.system(size: 9))
|
||||
.foregroundStyle(.red)
|
||||
Text("\(Int(context.state.heartRate))")
|
||||
.font(.caption.monospacedDigit())
|
||||
.foregroundStyle(.secondary)
|
||||
}
|
||||
}
|
||||
if context.state.isPlaying {
|
||||
LiveActivityMusicBars()
|
||||
}
|
||||
@@ -128,7 +139,7 @@ struct WorkoutLiveActivity: Widget {
|
||||
} compactLeading: {
|
||||
Circle()
|
||||
.fill(phaseColor)
|
||||
.frame(width: 8, height: 8)
|
||||
.frame(width: 10, height: 10)
|
||||
} compactTrailing: {
|
||||
Text(timerInterval: Date()...context.state.phaseEndDate, countsDown: true)
|
||||
.font(.system(size: 12, weight: .medium).monospacedDigit())
|
||||
|
||||
Reference in New Issue
Block a user