SwiftUI开发TimerView如何让Text自适应视图同时保持字体大小统一

直接上修改后的可运行代码，已经适配对齐、字号统一、不越界的需求：

import SwiftUI

struct TimerView: View {
    @State var fromTime = ""
    @State var toTime = ""
    
    var body: some View {
        VStack (alignment: .leading, spacing: 60) {
            // 改用Grid布局，自动对齐行列
            Grid(alignment: .leadingFirstTextBaseline, horizontalSpacing: 8, verticalSpacing: 6) {
                GridRow {
                    Text("From Time: ")
                        .font(.body)
                    Text(fromTime)
                        .font(.body)
                        .lineLimit(1)
                        .minimumScaleFactor(0.5)
                        .allowsTightening(true)
                        .frame(maxWidth: .infinity, alignment: .leading)
                }
                GridRow {
                    Text("To Time: ")
                        .font(.body)
                    Text(toTime)
                        .font(.body)
                        .lineLimit(1)
                        .minimumScaleFactor(0.5)
                        .allowsTightening(true)
                        .frame(maxWidth: .infinity, alignment: .leading)
                }
            }
            
            HStack(spacing: 20) {
                Button(action: {fromTime = getDate()}) {
                    Text("Start")
                        .padding(.vertical, 10)
                        .padding(.horizontal, 40)
                        .overlay(
                            RoundedRectangle(cornerRadius: 10.0).stroke(lineWidth: 2.0)
                        )
                }
                
                Button(action: {toTime = getDate()}) {
                    Text("Stop")
                        .padding(.vertical, 10)
                        .padding(.horizontal, 40)
                        .overlay(
                            RoundedRectangle(cornerRadius: 10.0).stroke(lineWidth: 2.0)
                        )
                }
            }
        }
        .padding(.horizontal, 16)
    }
}

struct TimerView_Previews: PreviewProvider {
    static var previews: some View {
        TimerView()
    }
}

extension TimerView {
    func getDate()->String{
        let time = Date()
        let timeFormatter = DateFormatter()
        timeFormatter.dateFormat = "yyyy-MM-dd HH:mm:ss"
        let stringDate = timeFormatter.string(from: time)
        return stringDate
    }
}

核心修改说明 #

• 用Grid替换原有嵌套的HStack+VStack，通过alignment: .leadingFirstTextBaseline配置直接实现左右文本基线对齐，不需要手动加padding调整位置
• 所有标签、时间文本统一设置.font(.body)，默认字号完全一致，避免缩放后基线偏移
• 时间文本统一添加.lineLimit(1)强制单行显示，配合.minimumScaleFactor(0.5)实现文本过长时自动缩小，.allowsTightening(true)进一步优化长文本显示效果
• 给时间文本添加.frame(maxWidth: .infinity, alignment: .leading)，自动占满右侧剩余宽度，不会超出视图边界；两个时间文本使用相同的缩放配置，会自动保持字号统一

内容的提问来源于stack exchange，提问作者pebble unit