SwiftUI与WidgetKit：实现AM/PM整体换行显示

算力阿峰

2026-7-10

解决WidgetKit中时间文本换行问题

要实现12小时制下AM/PM整体换行、24小时制不显示的效果，核心是拆分时间与AM/PM的布局，同时根据系统时区自动适配格式，具体步骤如下：

1. 自定义日期格式化逻辑

不再依赖系统的.short时间样式，而是根据当前设备的Locale判断是12小时制还是24小时制，生成对应的格式化字符串：

static func getSleepTimeFormat() -> DateFormatter {
    let formatter = DateFormatter()
    formatter.dateStyle = .none
    
    // 判断当前Locale是否使用12小时制
    let is12HourFormat = DateFormatter.is12HourFormat(for: Locale.current)
    formatter.dateFormat = is12HourFormat ? "h:mm" : "HH:mm"
    
    return formatter
}

// 单独获取AM/PM标识
static func getAmPmString(for date: Date) -> String? {
    guard DateFormatter.is12HourFormat(for: Locale.current) else {
        return nil // 24小时制下返回nil，不显示
    }
    let formatter = DateFormatter()
    formatter.dateFormat = "a"
    return formatter.string(from: date)
}

2. 用VStack实现换行布局

将时间文本和AM/PM文本分开，通过垂直栈布局让AM/PM整体显示在下方，24小时制下自动隐藏AM/PM部分：

VStack(alignment: .leading, spacing: 2) {
    Text("\(targetBedTime, formatter: Self.getSleepTimeFormat())")
        .font(.system(size: 14))
        .fontWeight(.bold)
    
    if let amPm = Self.getAmPmString(for: targetBedTime) {
        Text(amPm)
            .font(.system(size: 10))
            .fontWeight(.bold)
    }
}