SwiftUI使用HStack lastTextBaseline时文字上方空白且无法居中如何解决

• 首先是大号数字文本的手动frame配置错误：你给Text("3")手动设置了远大于文本自身高度的固定frame，且垂直对齐参数使用了.firstTextBaseline，这会让文本在这个过高的frame内沿首基线对齐，多余的高度全部变成了文本上方的空白。
• 其次是GeometryReader的默认布局行为：GeometryReader的子视图默认对齐左上角，不会自动居中，所以你整个VStack内容会偏移到屏幕上方，无法居中显示。

你遇到的异常效果如下：

1. 删掉Text("3")上的自定义固定高度frame，文本会自适应自身字体尺寸，不需要手动限制高度。如果需要控制整体HStack的尺寸，可以在外层容器加修饰符，不要直接给文本设置过高的固定高度。
2. 给GeometryReader的直接子视图添加frame(maxWidth: .infinity, maxHeight: .infinity)修饰符，让整个内容容器撑满GeometryReader的全部空间，内部内容自然就会居中。

struct SwiftUIViewTest: View {
    var body: some View {
        GeometryReader{ geometry in
            ZStack{
                Rectangle()
                    .fill(.black) // 补充背景色，原Rectangle默认透明
                VStack(alignment: .center, spacing: 8) { // 新增间距控制，优化布局
                    HStack(alignment: .lastTextBaseline, spacing: 4) {
                        Text("3")
                            .lineLimit(1)
                            .foregroundColor(Color.white)
                            .font(.bold(.system(size: 100))())
                            .minimumScaleFactor(0.1)
                            .lineLimit(1)
                            .shadow(radius: 2)
                        Text("cups")
                            .foregroundColor(Color.white)
                            .font(.system(size: 12))
                            .shadow(radius: 2)
                    }
                    Text("next cup on")
                        .foregroundColor(Color.white)
                        .font(.system(size: 10))
                        .shadow(radius: 2)
                        .opacity(0.5)
                    Text("10 : 00")
                        .foregroundColor(Color.white)
                        .font(.system(size: 12))
                        .shadow(radius: 1)
                        .opacity(0.5)
                }
            }
            .frame(maxWidth: .infinity, maxHeight: .infinity) // 撑满GeometryReader空间，实现内容居中
            .ignoresSafeArea()
        }
    }
}

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